oreilly.comSafari Books Online.Conferences.


AddThis Social Bookmark Button

QuarkXPress Comes to OS X
Pages: 1, 2

Taking it to the Web

Now I'll walk you through my experiences exporting the file to HTML.

First I wanted to see what would happen if I simply changed a print layout to a Web layout and opened it in a browser. Converting QuarkXPress files to HTML has been a constant preoccupation for many magazines and other kinds of publishers. Often, magazines like to post stories on the Web after they've first appeared in print; what they normally do is reformat the entire thing, copying out all the text, and pasting it into a web format.

Then they take all the images and create web-friendly versions. Another option is to create PDFs, but opening PDFs is still fairly slow on many machines, since it requires the help of an additional application.

So I opened my Project file, "Dispatch", and duplicated the one Layout in the file by choosing Duplicate from the Layout menu. Then I called the new layout "Dispatch Online", and changed the Layout Type from Print to Web. I left everything else alone.

If you ever want to change any of these options, such as adding a background color or choosing a background image, choose Properties from the Layout menu. As you can see, objects are all in the correct places, and everything looks the same.

click for larger view

If we zoom into the tiny text of the caption, we see that even that is rendered correctly. You'll notice that in the corner of every box is a camera icon; as you many have guessed, everything looks fine in the web layout because all of the elements have been turned into graphics.

I then chose Export -> HTML from the file menu, and after telling the program where I'd like to store the folders, it created an HTML file and a folder full of web-optimized graphics. You can see that for the most part, this page looks fine, although it might look better or worse depending on your browser.

Compare it to the PDF I created earlier. If you look a little closer at the HTML page, you'll see that the caption didn't come through, even though it looked fine in the web layout. Also, you'll notice that the title looks jagged because the program didn't treat the type with any kind of anti-aliasing, a trick whereby pixels of progressively lighter shade are placed around the edges of a graphic to make it look smooth.

I searched high and low, by the way, and there didn't seem to be an option for doing this. (Are you listening, XTension developers?) However, we're not doing too badly in the file-size department; the HTML file and all its assets weigh only 360k.

I thought I'd try to rescue the caption. It had been set in 6pt Verdana, and I changed it to 8pt. As you can see in the next export, I'm not out of the woods yet. The type is barely legible, and I had to enlarge the box that the caption is in, altering the layout.

I experimented next with taking select text boxes and telling QuarkXPress I'd rather they not be exported as graphics. You can do this by selecting a box, choosing Modify from the Item menu, and unchecking the box at the bottom that says "Convert to graphic on Export". Doing this cut my file size down to 108k, but it unleashed a series of problems that I won't assault your eyes with.

For one thing, it completely changed the leading, throwing the original design out the window. The point is that if you want to publish a QuarkXPress document online, export everything as graphics. For the sake of some tiny text, you might have to tweak the design a bit. If you really need to preserve the integrity of the original printed document, use PDF.

There is, however, one more important drawback to exporting QuarkXPress documents as HTML, which involves multi-page documents. When you save your file as PDF, this isn't a problem; if you have a ten-page document, the PDF will also be ten pages long. But that's not the case when you use QuarkXPress to export a multi-page document as HTML. Instead, QuarkXPress will create pages called "Export1.htm," "Export2.htm," etc.. When you open Export1.htm, you won't have any way to move to the next page or back again. So you have to build this navigation into your the pages explicitly. I checked with a representative from Quark, who said he didn't know of an XTension developer with a solution that would do this from within QuarkXPress. (Once again, developers, here's your chance!)

If you want to create an online version of a printed document (or vice versa), it would probably be best to use the method I described just as a starting point and then significantly tweak the online version until it can squarely stand on its own feet. You might want to import graphics to replace the headlines, and you'll want to add hyperlinks of course and other navigational elements.

QuarkXPress 6 also lets you select individual text boxes in any layout (print or Web) and "synchronize" them with corresponding boxes in any other layout in your project. Though the two layouts might look very different, any synchronized text in the one version will immediately reflect changes made to the corresponding text in the other version.

To do this, click on any text box and choose Synchronize Text from the Style menu. Give the Synchronized Text a name, and that name will appear in the Synchronized Text Window. Then go to any other text box in any other layout in the same project, click on the Synchronized Text name in the Synchronized Text window, and then click the "Insert Text Into Text Box" button at the top of the Synchronized Text window. From that point on, the text in both boxes in each layout will be the same.

Another way to take advantage of the multi-layout aspects of QuarkXPress would be to use the program to create HTML from scratch, since you can position the objects exactly where you want them. (Try using Macromedia's Dreamweaver MX to do that, even if you're working in its Design View, and you'll be unpleasantly amazed at the many ways you can't position objects.) Then you can bring the HTML file into Dreamweaver or whatever other HTML editor you'd like, for the heavy coding. From there you can swap out the jagged titles and replace them with your own anti-aliased ones, and perform all the other fancy HTML moves at your disposal.

The $900 Question

QuarkXPress is not cheap, but if you already work with QuarkXPress files, version 6 would be a great reason to upgrade to Mac OS X, which crashes far less frequently and brutally than OS 9, among other things. From what I've seen, QuarkXPress 6 is just as simple and flexible as its predecessors.

The new version's web features are a bit rough, but they point a way toward a much more intuitive way to design web pages. It's certainly worth the couple of hundred or so it would cost to upgrade from 5, but if you're thinking of purchasing QuarkXPress or InDesign for a new design shop, recommending one over the other is way beyond the scope of what I've covered here. Read everything you can about both products. I hope I've given you a hands-on feel for what it's like to grapple with a few problems using QuarkXPress 6.

David Weiss is an Oakland, California based freelance writer. He's worked as a senior editor at Macworld magazine, and as the lead editor of MacHome Journal. Read more about David at

Return to