Wired Magazine and VQR: 2 Ways to iPad

So far the Apple iPad is turning out to be anything but a fad. As Wired magazine’s Eliot Van Buskirk reported last month,

“One million iPads in 28 days — that’s less than half of the 74 days it took to achieve this milestone with iPhone,” said Apple CEO Steve Jobs. “Demand continues to exceed supply,” he claimed, “and we’re working hard to get this magical product into the hands of even more customers.” . . . Regardless, this announcement marks a big vote of confidence by consumers. Nearly one out of every 300 Americans already owns one of these devices.

Apple’s original estimate of 5 million iPads sold in 2010 is well on its way, and it’s only June. I foresee a lot of flat boxes under the tree this holiday season.

Periodical publishers have been as eager for the introduction of a full-color, multi-media tablet as anybody else who publishes content on paper, perhaps more so. Everyone’s looking for a new way to deliver their signature content to readers in the face of subscribers fleeing to free, web-based content. This raises the real fear that your publication will lose its franchise as your subscribers create new brand loyalties.

One of the first to show a new form of content delivery was Sports Illustrated, with a very fluid demo of what a digital “magazine” might look and act like, and it was pretty heady stuff. Now magazines have made the first steps onto this remarkable new platform. I thought, as publishers, we can learn something from the steps—and missteps—the pioneers will make. I looked at two very different releases for the iPad, each connected to a print publication with a serious franchise.

Here’s what I found.

Wired Magazine App for the iPad

Wired Magazine issued a complete electronic version of their June issue, to much fanfare. They chose to package the issue as an app, sold through the App Store for $4.99. The app takes a massive 527 MB, over half a gigabyte just for the one issue. On a 16 G iPad this is not a trivial amount of space.

The app, which launched to much fanfare and excited talk, is basically a canned version of a print publication. Wired has outstanding editorial design, sophisticated typography, precise graphics and picture placements, and luscious advertisements.

Given the limitations of the platform, the only way these elements could be displayed is in an app, where the whole publication is fixed as pages of graphics that you navigate by swiping. There are, as in the print magazine, a large number of ads.

Click to enlarge

How did Wired use the capabilities of the iPad? There are numerous “interactive” elements. Most of them are connected to ads. There are many videos you can play in place, buttons to press to rotate content within the window you’re looking at. There are animations and other effects. Want to watch one of the latest Intel commercials? It’s right here.

The entire production comes off as very slick, and very canned. Despite the profusion of buttons, I felt like an observer, not a participant. There is, however, one area where you get to play a kind of guessing game.

Click to enlarge

Unfortunately, that area is the page navigation. The designers have assembled Wired’s beautiful fixed pages into a kind of strange tree diagram. From any page, you might be able to scroll right, scroll up, scroll down. But not from every page. How do you tell the difference? Good question! There are very few navigation cues, so you end up swiping every page in every direction tring to uncover the hidden content or the continuation of the story.

Check out the page above, “Warming Trends.” You’ll see a blue “start” box and a blue ribbon running through the page. Do you think the blue navigation ribbon pointing up means there’s content up there? Fooled you! There’s nothing there.

The other page, “Rise of the Machines” is early in the magazine. From this page you can go right or go down to more editorial content. See any way to know that? No, I didn’t think so. This interface is incredibly irritating. This irritation is punctuated by ads, many with meaningless buttons to play with. Other buttons, that look similar, do nothing, and you end up feeling a bit foolish poking the screen to absolutely no effect.

I will say, the Wired app has the coolest scroll bar, where you can see thumbnails of each page as you run your finger along the bottom of the screen. Other than that, it came across as a beautiful, clueless corporate production.

Virginia Quarterly Review (VQR)

This “National Journal of Literature and Discussion,” published since 1925 by the University of Virginia, has a different kind of franchise. They have just published their Spring 2010 issue on the iPad, but under the direction of Web Developer Waldo Jaquith, they have gone a different route and created an ePub file, for sale in iBookstore.

Now, you might think that this is a suicidal move for a publication that carries advertising and regularly shows illustrations and photographs in their editorial matter. We’ve seen some of the terrible-looking ePub files being produced, and the disappointing iBooks typography of the books in the iBookstore, no matter who publishes them.

Click to enlarge

But VQR has made the transition to ePub brilliantly, and their publication is far and away the best I’ve seen on this platform. There is nothing Jaquith and company can do about the limitations of the ePub format, but here they show just what is possible with attention to detail and painstaking care.

Obviously, we are in the familiar iBook environment. But it’s been adapted to the purposes of a magazine. Even the page above shows how careful this ePub conversion was done. First of all, we’ve got rag right composition, defeating the awful full justification-without-hyphenation common in iBooks. This is enough to improve the overall look of the page considerably.

Click to enlarge

But the careful ordering of the iPad fonts, the type sizes, the arrangement on the page, is calmingly logical and orderly. There are no buttons, videos (that I saw anyway) or commercials. You page through the story as you would an iBook. There are ads, and the ads are hot-linked so you can go directly to an advertiser’s site in Safari, but that appears to be the limit of the interactivity.

In the interior page above, you can see the placement of a spot photograph along with its caption. Just seeing this page in ePub really raised my spirits. Maybe there is survival for typographers in an ePub world.

Two Completely Different Experiences

These two publications couldn’t be more different, and I encourage you to take a look at them if you have an ePub reader. For me, the choice was pretty clear.

No matter how much I admired the artfulness and typographic beauty of the Wired pages, I felt lost in a corporate maze, with only the stylized prose to keep me company.

Reading VQR was the first enjoyable experience I’ve had with an iBook. It achieved one of the goals of publication design, at least in my mind: to present the story in such a way that the reader has unimpeded access to the fulness of the author’s intent. The iBook environment in this case worked in VQR’s favor, and the calm design did a superb job of transmitting the writing. No bells and whistles, but a great and humane reading experience.

VQR really makes me more optimistic than I have been for some time. And if you really need a bolt of inspiration, fire up Safari and take a look here.

Takeaway: The first two magazines on the iPad—Wired and VQR—show completely different approaches to the platform. VQR looks like the clear winner.

Joel Friedlander is a self-published author, an award-winning book designer, and an accomplished blogger. He's the founder of the Self-Publishing Roadmap online training course, and a frequent speaker at industry events where he talks to writers about how the new tools of publishing can help them reach and inspire their readers.

If you like this post, you can stay up to date with the latest information from The Book Designer by subscribing via RSS, or receive articles directly in your inbox. Then click here to download a free 24-page ebook on the top 10 things you need to know about self-publishing.

Why is it so bad to choose fonts? Web site designers do it all the time (though they too can be overridden by visitors). And certainly print book designers have no compunctions about choosing the font for their books. Why should ebook designers be any different?

Bad? Who said it was bad?

We chose a half dozen fonts for VQR’s ePub. The only font that we didn’t specify is the body font, allowing the user’s choice to be the default. (We also didn’t specify a size, specifying, simply, “medium.”) There are only two options available to an iBooks user: font size and face. Anybody who has used it for more than a very brief time has selected both. Given the very small selection of reasonable body fonts on the iPad, why should we specify Baskerville over Palatino? Or Georgia over Cochin? I can see no compelling reason not to simply default to the reader’s preference.

This is actually very different than with websites. On a website, yes, we specify a fallback list of fonts that we prefer for display and, yes, it is possible for the user to override that. But a supermajority of users do not know how to override that or, if they do, they have no reason to do so. Browsers do not have a “select your preferred body font” widget displayed at the top, as iBooks does. So this habit is more one of ideological purity and habit than of practical choice, particularly when contrasted with iBooks.

VQR’s ePub is not an ePub of the magazine. It’s an ePub of the website, which is, in turn, based on the magazine. Likewise, I am not a book designer. I’m not even a print designer. I am a website developer and, as such, I have approached this and will continue to approach this from that perspective, the only one that I have. :)

Waldo, I think that’s an interesting distinction (although I have noticed some websites with the small, big, bigger “A” at the top for selecting a type size).

I know I’m not alone in being mystified about the fonts that were chosen for the iBooks. Who would have known there are people who want to read a whole book in Cochin? Other than Baskerville, the list really include NO traditional book typefaces, and it just seems to fly in the face of the accumulated 500 years of design experience about how to present long text documents in the best way. It reinforces the reality (as you’ve stated here) that typographers and type designers have somehow been cut out of the process, and the fonts we’ve been presented with are those chosen by engineers, software designers, and professionals with different kinds of expertise. That’s something that it seems would be pretty easy to rectify.

I think you’re right about font selection, Joel. I don’t know much about typography, but I do know that the five user-selectable fonts are nothing to write home about. For Apple to get support from book designers—something that I think they need, badly—they’d do well to provide things like decent text fonts. I’m from a world where the addition of Verdana in 1999 expanded by 50% the typefaces available to me (Times/Times New Roman and Arial/Helvetica); now, practically speaking, I have perhaps ten faces to draw on, which seems like an embarrassment of riches. Which is OK. for me, but I get the sense that may also be the world of the folks who created iBooks. That’s substantially less OK.

Regarding website types selections, yes, type sizes are easy to change in most browsers, though some website developers also choose to drop a JavaScript widget into place to allow it within the website. (Some versions of Internet Explorer were incapable of changing font sizes if they were specified in pixels, bizarrely.) Few users have any idea of how to change the font used, but sizes can be expected to vary a great deal.

Yes, you can lock it down, but it’s an ugly kludge (David figured that out too).

Why is it so bad to choose fonts? Web site designers do it all the time (though they too can be overridden by visitors). And certainly print book designers have no compunctions about choosing the font for their books. Why should ebook designers be any different?

It’s interesting that this has become a point of discussion. As type designers, we’ve always felt it was our job to select, match and harmonize the fonts in a publication. The idea that the user (reader) can pick their own fonts tosses the whole idea of “designer” into some confusion. In a text-only work, do you really need a designer at all? Or in other words, am I starting to feel like the buggy whip manufacturer watching the Model As roll down the street?

@ Joel. We can do a lot with CSS. Most of the problems with Web typography are in the spacing (leading and paragraph) and line length. We can pick fonts that are reasonable now and I am certainly glad to have some serif choices (though I don’t really like any of them). But we even seem to have lost the line length controls in ebooks as they are now.

Yup. I only spent a few minutes playing with it (long enough to say yup, that works) but the few fonts that I requested worked very nicely.

What I do not know is how the user-selected font preferences affect your choices. That is, when the reader selects a new font within iBooks, which of your specified fonts will be replaced with that selected font? I can switch fonts in VQR’s ePub and our specified fonts (that is, everything but the body) remain unchanged. But I don’t know how iBooks determines which font(s) to replace with the user choice or whether that’s something that a designer can lock down to prevent a user from changing (not that I’d advocate that). It would be helpful for Apple to document that, I imagine.

Thanks, Keith. In addition @David, there are several free apps in the App store that will show all the fonts available and let you see them at various sizes, etc. Try Font Displayer, AllFonts, or Fonts, I believe they’re all free.

I’m glad to find out there are a few more options. They’re not great, but then I’m accustomed to using my own. eBook options have a long way to go before we can make them look a whole lot better. But then the Web, in general, has the same problem.

I’m looking forward to seeing what options become available in the next versions of InDesign and Dreamweaver. CS5 hasn’t done much in that regard. Though teus de jong’s script makes ePUB exports validate.

I have the Time and Wired mag-apps on my iPad, and they quickly became very “normal” to me, with fewer compromises than reading eBooks on the iPad.

Despite deficiencies in graphic artistry, I’ve gotten quite used to eBooks, and I find I’m now reading more eBooks than I read when book delivery required dead trees. I often read two or three related books at the same time, and I love being able to easily flip from one to another without having to go to my book shelf. And if I get bored with a book, I can quickly get into another one, or go to the web or check email.

While iMags have a long way to go, we are only a little over two months into what will likely be a lengthy evolution, and what we’ll have in a year or five years may be radically different from what’s on our screens and in our ears now.

Around 1980 Sears experimented with videodisc kiosks in stores and they even distributed discs and players to customers as an experimental replacement for the huge Sears catalog. That experiment failed, but helped lead the way for selling on the Internet.

Yes, there are huge advantages to eBooks and those advantages are likely to hasten the move to digitization for much of our published material. Although I didn’t suspect that this would be true, I was more attracted by the “aliveness” of the ePub magazine, with its ability to respond to the reader’s requests (for changes in font or typesize, for instance) than in the packaged and mostly advertising-connected multi-media fireworks of Wired which, despite it’s lovely design, seemed cannd and lifeless.

David, this is actually all laid out by hand in HTML. I’ve been a website developer for seventeen years, and by hand is the only way I’ve ever done anything. :) Those image/caption pairs are actually definition lists (DL tags): the image is a DT, the caption a DD. Each DL is floated left, right, or run full width.

Also, note that the iPad has forty-odd fonts, not five. Users can select between five, but designers get to pick from far more.

Joel, to respond to your very kind review, I want to expand on a couple of things that you brought up. Your point about the limitations of the iPad are quite right. I spent a lot of time trying out all of the major rendering systems and readers for ePub, and the iPad is far and away the best right now. (There are some smaller ones that are quite good—Ibis Reader really stands out.) But the iPad is not without its limitations. There are a handful of things that we would have loved to do, and I’m disappointed to have needed to do without them.

For instance, the fact that our photos can’t be enlarged is a real frustration. I’d initially hacked in a feature to enlarge photos (hidden chapters, one for each photo), but I quickly realized that was useful only for vertical images, since vertical images cannot be any wider than the short side of the iPad. That’s because rotating the display, rather than providing more display area, actually cuts the display area in half, using the two-page display.

Also, the fact that it’s not possible to embed audio or video in a (valid) ePub is a shame. It’s actually entirely possible, technologically, to include both, as I initially did on our ePub, and it worked fine. But it fails epubcheck, since the ePub standard does not permit either of these elements. I’m looking forward eagerly to the ePub 2.1 release, due to be publicly released in May of next year, as that’s slated to support both of those elements.

I’ll permit myself one more kvetch: the fact that some really important CSS2/3 layout rules are not yet supported by WebKit, Apple’s HTML rendering engine. For instance, there’s no such thing as a page break. The only way to force a new page is to start a new chapter. So we’ve got a bunch of “chapters” that are really just new pages. There’s neither widow nor orphan control.

Oh, heck, one more area of complaint: The painful shortcomings in the rendering engine. No hyphenation. The TOC hierarchy is not represented visually within the generated TOC. Contents of floated DIVs cannot be selected, and links within them cannot be clicked on. Full-page images are followed by a blank page. There’s no UI indicator when somebody has followed an internal link to linear=no embedded subcontent, such as an enlarged image, a footnote, etc.

The part that I understand about Wired’s approach is the desire to get all of this stuff right. But the part that I really don’t understand is that, in doing so, they’re simply opting out of the digital information ecosystem and, while they’re at it, running up a huge bill. I’ll bet that they spent—no exaggeration—a hundred times more on the digital edition of Wired than we spent on the digital edition of VQR, quite possibly more. Each new issue of VQR will take about a day to convert to ePub. Each new issue of Wired will probably take a couple of weeks to convert, followed by another week to wash off the feeling of shame and regret. ;)

Waldo, thanks for your detailed explanations. I know little of ePub and have not tried to do any conversions from my print projects, but the transition from print to digital can be pretty painful for those of us who have spent years or decades honing our skill at typography.

The whole VQR publication implies a designer’s hands behind the work, but considering the difficulty of getting a publication to look as good as yours does, I wonder just how many dreadful ePub “books” we’re going to be subject to before better controls and procedures come along.

In any event, you helped me to see that there’s more possible than what usually meets the eye in the iBookstore, and thanks for that.

How do you think they did the wrapped graphic? An anchored object in Indesign? Or a left alignment in HTML?

I’m still trying to get a handle on what i can get way with as far as design is concerned. I can live with the five fonts available so far. Though, as a font designer, I certainly wish that font embedding was supported. The main thing for me is stuff like Run-ins, paragraph styles and character styles, and what I can get away with with using anchored graphics.