Better Screen, Same Typography

Three years ago I waited in line to buy the original iPhone and I haven’t upgraded since, so I’m definitely warming up my credit card for Apple’s newly announced iPhone 4. I admit that it took some will power to sit out the subsequent releases of the iPhone 3G and the iPhone 3GS; the not-insignificant speed gains that those models brought would’ve come in really handy. Still, neither of those updates struck me as particularly impressive. They were incremental, at best, where iPhone 4 seems like a major leap forward.

Even the new phone’s screen, the so-called Retina Display, is an important development on its own. Its incredibly high concentration of pixels (326 ppi, or four times the density of previous iPhones) promises a quality of resolution that’s positively print-like, where the pixels seem to disappear to the eye and rendering of curved shapes is much smoother. The advent of higher and higher density screens like this one will continue to have some subtle but important changes on the way we practice design for digital media, eventually pushing us to work in a resolution-independent framework that’s currently foreign to most.

Perfectly Awful

However, this advancement in raw presentation abilty is hardly everything it can be. It’s worth pointing out one glaring omission that, seemingly, still remains: a lack of truly rich typographic controls. A few months ago, my friend Stephen Coles wrote an excellent and damning indictment of Apple’s apparent indifference to typography, in spite of the company’s reputation as a champion of good design. Joe Clark also followed up with an argument that today’s Microsoft actually beats today’s Apple in typography, which is also well worth reading.

It’s only been a few short months, but the situation has hardly changed, even with the introduction of the newly-renamed iOS. Perhaps even more galling is the fact that Apple continues to lay claim to being a purveyor of excellent typography merely through hardware innovations like the Retina Display, which to my mind address only one aspect of the problem of getting us all to a richer typographic environment.

Here’s an example. In one of the elaborately produced, incredibly self-congratulatory promotional videos that the company released to announce the arrival of iPhone 4, one particularly outrageous moment stuck out for me. At about three minutes into the video, senior vice president for iPhone software Scott Forstall extolls the virtues of the Retina Display by declaring that “The text… is just perfect!” Meanwhile, the central image in the video at just that moment is this little typographic calamity:

I urge you to fast-forward the time code to 3:02 to hear this for yourself. Forstall is quite literally claiming perfection while a hand model holds up this terrible example of everything that’s wrong with Apple’s commitment to typography. While the letterforms on that virtual page may look gorgeous, it’s apparent to any designer that the text is far from perfectly typeset. It’s hideous, scarred as it is by unsightly “rivers” of bad spacing within the text. No self-respecting typographer would dare call that perfect.

Less-than-Perfect Vision

Creating a beautiful display and patting yourself on the back for having good typography is disingenuous, I think. It’s a little like saying a high-definition television set makes for better television shows; an absurd claim at best.

That metaphor is imperfect, of course, because television manufacturers have nothing to do with the content that appears on their devices or with its production. But that, supposedly, is the unique value that Apple claims to offer: they build the whole widget. Not just the hardware and not just the software, but the divine unification of the two into transcendent commercial products.

Steve Jobs’ vision for Apple, repeated in yesterday’s keynote address, posits that the company operates at the intersection between technology and the liberal arts. I think it’s reasonable to regard fine typography as falling within that mandate, but unfortunately, they are falling short of that promise. Building a great display for typography without building great typographic tools is a dereliction of duty.

+
  1. I totally agree, and I can’t help but wonder: how much of iOS’s poor typography comes from Apple’s use of HTML/WebKit as the technology behind the rendering? Apple is using WebKit throughout, and certainly in your iBooks example — would things be better if they used Quartz, like they do in OS X?

    Some of it (like justified text with no hyphenation) is just poor design decisions — but I wonder how much has to do with HTML just not being a great platform for typography yet?

  2. Very interesting article.
    As a web designer I fear a little bit for the weight of the pages designed in 300dpi…

    Concerning the typographic aspect I’m not a type designer but I can easily see what’s wrong in the Iphone page shown in your article… I can’t understand that no one in Apple team had seen this wrong point before the conf’… Weird… really weird.

    Thanks for sharing your point of view 🙂

  3. Even in windows types have better rendering than in osx. Windows makes types sharper by adding blue and yellow pixels to the edges. On macs type is more blurry and flatten.

  4. @timur:
    I took a screenshot on my Mac of the paragraph you just wrote. Here’s how it looks zoomed in:

    link

    The coloured anti-aliasing isn’t Windows-only

  5. I think the real problem is that internally iBook is just a WebKit frontend with some graphic overlays, and the web still doesn’t support a lot of basic typography, like hyphenation, footnotes, etc. If WebKit were improved, those improvements could then be kicked out to a lot of other apps, the Times Reader among them no doubt.

  6. I’m getting tired of posting this link everywhere, but yes, it’s possible to do good justification (and eventually hypenation) in WebKit. And no, it does not necessarily require the use of the canvas element:

    TeX line breaking algorithm in JavaScript

    Why this basic stuff isn’t already in use everywhere is beyond me.

  7. I appreciate your criticism of the type rendering on the iOS4 based upon a video from a website, but other than the design community, do you really think the vast majority of the end users will get to that level of attention to level such criticisms?

    It’s doubtful the masses will even understand the criticisms you present here let alone recognize the difference between a serif and a sans-serif font or even if a font is rendered correctly on an iPhone, Android or some other smart phone device.

    I agree font rendering on many devices isn’t up to par, but I believe as long as you and others continue to draw attention to it the issue may eventually be corrected.

  8. I’m not sure what they are showing in the promo video, but maybe it’s an early version of iBooks for iPhone. The one available on the demo phones at the WWDC does offer ragged right text. I have hope.

  9. @Matthew:
    Anyone who has read a book will realize that text with huge rivers of space and poorly-set type (on the iPhone) is harder to read than properly-set text. It strains the eye and the reader has to struggle to keep their place.

    I would guess that 1) the book being used and 2) the size of the text in the video are what contributed to MOST of the typographic atrocity seen in the video.

  10. My PC experience is limited largely to Windows XP wherein all type looks like crap. While I agree that Apple’s recent type indifference is disheartening, I can’t believe for a second MS is any better. Designing for Windows Phone 7 has meant you’re limited to one, that’s one typeface in 2 weights. Segoe UI Light and Segoe UI Semilight. I’m not talking about Windows Mobile, I’m talking about their brand spanking new platform. Similarly to the Apple video – a Microsoft developer video makes the exact same claim – that text looks gorgeous on the new Phone while only supporting a single typeface.

    Futhermore, last year I worked on an eBook app for the iPhone and let’s just say the data you get from publishers leaves a lot to be desired. What you see on any device – be it the Kindle, or an iPad may not have anything to do with the application but the source data. Publishers are light years behind in providing useful, well-formatted, data in any standardized way. All the talk of terrible typesetting, lack of justification or hyphenation etc. may be moot – sometimes crap data just cannot be parsed elegantly.

  11. Many thanks to Kari PСtilС for the link to the TeX example. When I pushed to have this considered for an iPhone eBook app the development team answered that is was “non-trivial” and in fairness to them, at the time they were struggling with slow load times caused by JS.

  12. I’m not normally the guy you want standing up for Apple, but… isn’t Winnie the Pooh a children’s book? Like, the kind of thing where the younguns wrap their heads around word forms, spaces and punctuation?

    My guess is that they picked it because the text is large enough to read while keeping the phone completely in frame in the video, and it’s the one you get with iBooks anyway. Don’t get me wrong: it may still suck. But I will reserve judgment on how sucky it may be until I see it with my own eyes.

  13. Caveats:

    Justified text.

    Typeface sized larger than typical to be viewable in video edit of less than a second.

    Possible limits of the specifications in the epub format.

    Yes, no?

  14. Tangential note: I am shocked that in iMovie, there is no way to use smart quotes or apostrophes in the title screens, not even with keyboard commands.

    This does, in my opinion, support the point that Apple is slipping on the typography front.

  15. Joe Clark also followed up with an argument that today’s Microsoft actually beats today’s Apple in typography, which is also well worth reading.

    Actually, the very first lines of Clark’s article read: “Where Microsoft beats Apple? In fonts. Not per se in typography and absolutely not in graphic design, but in typefaces“.

    So no, MS does not beat Apple in Typography. RTFA.

    As for the “rivers” in the text, it’s due to the (open) e-pub format used in iBooks.

    Creating a beautiful display and patting yourself on the back for having good typography is disingenuous, I think.

    You think, Dinoso?

    Because they haven’t bragged about “improved typography” at all.

    What they said was that the text “looks perfect” due to the higher pixel density. Which it does. Text is not typography.

  16. Hmmm…I take it you have other examples of Apple’s poor typesetting, but – and correct me if I’m wrong – but aren’t the publishers of products on the Apple iBook store responsible for the formatting? I would be very surprised if Apple took it upon themselves to ensure the quality of design of every book offered via their bookstore.

    This argument strikes me as akin to blaming Apple for poorly-designed web pages simply because you’re viewing them through Safari.

  17. @a

    Please file a bug if you have issues with things like this:
    Apple Bug Reporter

    Yes, because a bug report is so much more influential than a highly regarded blog.

    Is it too much to ask to stop and think before posting?

  18. So, their typography is crap, so don’t upgrade the hardware so that it has the capability not to be crap?

    Wow.

  19. ePub format will gain more momentum and more features (such as embeddable fonts, etc.). I think it is more of a restriction to ePub rather than anything else.

    Sure, Apple could add more fonts. But most websites look good in Verdana (seems to be a good font when ppi is not that great). I prefer reading books with verdana as the font on my iPad.

    Also, considering the iPhone, the width of the device is so narrow that you can hardly fit five words in it (at a decent size) as the above illustrates. So, any typesetting that tries to justify text at higher font sizes will look terrible. Either you will have too many hyphenated words or the spacing issue.

    On a side note, if an ePub contains embedded font, can I extract the font from there and use it for my personal sites? If so, how is the font protected from being copied?

  20. > As for the “rivers” in the text, it’s due to the (open) e-pub format used in iBooks.

    No, the rivers in the text is not due to ePub. It’s due to Apple rendering ePub with WebKit, and choosing to justify the text. WebKit doesn’t support hyphenation (no HTML rendering engine does, yet), and justified text just doesn’t work very well without hyphenation.

    Apple could have simply aligned the text ragged-right and avoided the issue. The rivers in iBooks is definitely a result of a poor design decision on Apple’s part. Period.

  21. > HmmmЁI take it you have other examples of Apple’s poor typesetting, but – and correct me if I’m wrong – but aren’t the publishers of products on the Apple iBook store responsible for the formatting?

    You are wrong. The books in the iBookstore are published using ePub, which doesn’t specify any formatting. It’s up to the rendering program (in this case, iBooks) to supply the visual design and typography choices.

  22. I take your point, but the example you’ve picked is of a large set font (childrens book) on a 3″ screen.
    It’s also worth noting that unlike print, the font size is adjustable by the reader, just like this website. Should I hold you responsible for it’s appearence if I bump the font to 32pt?

  23. Hard to believe this comes from someone working at the same NYT that released a crappily type set Editor’s Choice iPad app. Wow.

  24. As far as I know, you can specify some formatting in ePub, but the reader can choose to override it. What we saw in iBooks on the iPad and the iPhone 4 video is Apple choosing justified text rather than ragged right. I’m glad to see that this might have been changed in the unreleased version.

  25. You know you guys area bunch of lunatics, right? Who obsesses over finicky things like this? I followed a link to this post because supposedly it documented some deficiencies in the display on the new iPhone, only to find some OCD text freaks flipping out over how much space is between words.

    Seriously, who gives a crap?

  26. Yes, because a bug report is so much more influential than a highly regarded blog.

    Yes it is

    From spending time on Apple developer mailing lists, I have picked up the following…

    Apple engineers are not allowed to make changes to code just because they think it’s a good idea (or that they read a blog that contained a cool idea)

    They need a bug report to log the change against. They could raise one themselves, but it will probably get pushed to the bottom of the pile.

    A bug report raised by someone outside Apple is better. Not only does it show that it’s a real problem faced by customers, but it provides an external point of review for the bug. You will often get an email when they fix it, saying “Can you check what we;ve done and give feedback”

    If lots of people raise the same bug, they get closed as duplicates, but that info is attached to the original bug report, and the priority will get bumped up.

    The best type of bug report is one raised by an external party with a business case that says “If you fix this, I’ll sell X thousand Xserves” Something like that will get immediate attention!

  27. @Rohan Lloyd
    Re: Filing bug report is better …
    But since we learned that the text in iBooks can be set Ragged Right instead of horridly justified, isn’t filing bug report a waste of Apple’s time?

    Only file bug reports when you have evidence.

  28. This is precisely the right way to criticize Apple. You are right and I hope Apple will pay attention to what you say. Thank you.

  29. > The books in the iBookstore are published using ePub, which doesn’t specify any formatting. It’s up to the rendering program (in this case, iBooks) to supply the visual design and typography choices.

    The epub specification allows for CSS in the epub files: link

    Also: though the language of the spec discourages Javascript, it doesn’t prohibit scripting.
    See examples here: link

    That implies that things like Hyphenator.js and the JS typesetting algorithm are conceptually feasible in epub readers like iBooks.

  30. Jeff Croft: “Apple is using WebKit throughout … would things be better if they used Quartz, like they do in OS X?”

    The iPhone OS (sorry, iOS) does use Quartz, and most of the text you see in apps (outside Safari) is not rendered with WebKit. It just happens that iBooks uses WebKit since the ePub standard is HTML-based.

    Existing reader apps like Eucalyptus have shown that it’s definitely possible to do high quality typesetting on iPhone; it’s just that the most easily available layout engine (WebKit) isn’t yet up to the task.

    Dan: “Who obsesses over finicky things like this? ”

    People who create something always obsess over it to an extent unimaginable to the people who merely consume it. That goes for food, movies, and furniture, not just books. And in all cases, the little details that users don’t consciously notice do make a big difference. Why do people complain that “it’s too hard to read on computer screens”? They may not realize it, but part of the reason is poor layout that decreases legibility and results in extra effort and eyestrain.

  31. > The iPhone OS (sorry, iOS) does use Quartz, and most of the text you see in apps (outside Safari) is not rendered with WebKit. It just happens that iBooks uses WebKit since the ePub standard is HTML-based.

    Right, I understand and agree. So, my question is: how much of the poor typography in iOS is found in areas where Apple relies on HTML/WebKit versus Quartz?

  32. So Apple’s new display has higher Pixel density than the human eye can even discern. And you’re bitching about the font used in iBooks…in the demo.

    I’m sure this Typography stuff is your whole life, and MS has you holed up in a cave somewhere. You poor….poor bastard. I weep for you.

  33. That was a children’s book. Think back, way back to the early grades and how there were rivers of space between the words so you could read them.

  34. As far as I can tell, the essence of your complaint is a lack of hyphenation, which, coupled with the large text size, narrow screen width, and justification results in spaces that are uncomfortably large between the words.

    This is a valid complaint, but I think you’d be much better off (ie would get a better hearing from Apple, and be more understood by your readers) if you made it clear that THAT (lack of hyphenation) is the complaint.
    When I hear “xxx’s typography sucks” I think of poor font rendering, or poor kerning. When someone complains about “a lack of truly rich typographic controls” I assume they are talking about something like controlling the swishes in Hoefler. In neither case do I assume that they are talking about an issue that is more (IMHO) language than “graphics” related, like typography.

    So yes, report the bug to Apple (and my experience is that most issues I report to Apple, even aesthetic or usability matters) do eventually get fixed, but report it for what it is — limited or non-existent hyphenation, even when pretty good algorithms (eg TeX) exist.

  35. It’s actually not just webkit. The type support in full obj-c apps is awful as well. Try centering multiple lines of text – they aren’t always centered in relation to each other. Try adjusting letterspacing – you can’t. Leading? Nope. And that’s in English.

    My experience with Japanese and Chinese was even worse. The alignment of type is that much more off. Want a serif font? You can’t have one – even setting your type in Times or Georiga renders the Asian characters in a sans font. Sure, you can embed your own fonts, but at 30-40Mb each that’s not really an option for multiple Asian languages. Try mixing Latin and Asian characters. Not nice.

    I couldn’t agree more with the central argument of this post – Apple acts like its the best thing that ever happened to design. And Steve Jobs is meant to be a typographic snob. So what’s the excuse?

    Oh, and I have submitted bugs – because its ridiculous.

    And Dan, you might not realize that you think something is well designed because it has good typography – but I can guarantee that when you see it you like it.

  36. > Tangential note: I am shocked that in iMovie, there is no way to use smart quotes or apostrophes in the title screens, not even with keyboard commands.

    If you press and hold some keys on the software keyboard, alternate, closely related, or accented characters pop up. In the case of iPhone OS 3.1 and Android 1.6 (I don’t have older phones to test how far back it is), this includes not only smart quotes/apostrophes, but angle quotes and the lowered smart quotes. They also do em-dashes and ellipses. This works in any app, including notes, iMovie, even SMS and address book.

    > Yes, because a bug report is so much more influential than a highly regarded blog.

    Significantly so, especially if multiple people file it. A bug report has a lot more staying power, too.

    Not many Apple software engineers check typography blogs daily, nor will check up on week-old posts. I’ve hung out with some Apple software engineers. Even if I’m right there, showing them a bug, they tell me to file a bug report instead, for good reason.

    This way, they will be able to see how much it matters to users and devs, have a way to track its progress, know how old it is, how many people care about it, and have a means to triage and choose the largest showstoppers to fix.

  37. Text looking perfect does no equal to typography looking perfect. Reading too much into a video about text in high resolution, not about text type. Thanks for bringing up the valid problem though, Apple do need to work on that.

  38. “Please file a bug if you have issues with things like this:
    Apple Bug Reporter
    Yes, because a bug report is so much more influential than a highly regarded blog.”

    Uhh, foljs, unlike you I actually WORKED at Apple for ten years. So I imagine I am in a reasonable position to state that, yes, a bug report IS the way things get fixed. Apple takes bug reports very seriously — especially if there is a pattern of different people reporting the same thing. And aesthetic complaints are treated reasonably, they are not simply dismissed as stupid complaints.

    On the other hand, there is no cadre of people reading blogs to see what Apple should do next. And when you, the engineer, want to fix something, the easiest way you do it is to point to a bug report and say “I’d like to take a day (or an hour, or a week) to deal with this”. Of course if the right engineer reads a blog and thinks a suggestion reasonable he/she might try to get it into the OS — but that’s a lot more hit-and-miss than just using the system that has been provided.

  39. If you want a good example of good typography on the iPhone, check out what a company called River Valley Technologies has done in going from ePub->TeX->iPhone display:

    link

    The video is only 23 minutes long, with a bit of preamble about their workflow, but the on-screen demo is at 13:30. Zooming into the text occurs at around 21:45.

    As for web typesetting, Blaine Cook had a good post on “resolution independence” recently as well:

    link

  40. danny: “The type support in full obj-c apps is awful as well … Try adjusting letterspacing – you can’t. Leading? Nope.”

    You can actually do these things using the CoreText framework, avaiilable in 3.2 or later (so it’s on iPad now, iPhone in a few weeks.) Keep in mind that the iOS is a less mature platform than OS X, which does have extremely sophisticated typographic controls.

    Keep in mind that we’re talking about a _phone_ here. When the iPhone came out, it was amazing enough that it could merely render web pages decently, unlike its predecessors. Now 3 years later we’re down to nitpicking about hyphenation and tracking. The progress is pretty great, and I see the limitations as temporary.

  41. One question: If the Windows 7 type rendering is so good, why do I have to run an anti-aliasing tool on my work computer at all times so as to not get a headache after five minutes of work? And choose Safari style text rendering to actually be able to surf the web without aforementioned pain in the uppermost part of my body?

  42. Asking why Apple uses WebKit instead of Quartz is like asking someone why they use a car instead of wheels. WebKit is an HTML rendering engine and Quartz is a collection of 2D graphics APIs that just about every part of the operating system–including WebKit–uses on a regular basis. There is nothing about their relationship that makes them mutually exclusive technologies.

  43. I’m not sure I would read too much into what is being shown on screen at particular moments of the voice over, and it is essentially HTML text being displayed (ePub) in the iBook example. Regardless, I see your point.

    I have seen, in other areas of standards compliance namely CSS, JS, that standardized tests that call out the specific capabilities of different platforms (and the failings of others) can be incredibly useful and motivational for platform developers.

    Consider that no self-respecting browser developer puts out a release that doesn’t improve on its CSS support in the Acid3 Test. They all want to improve on the sunspider JS benchmarks, and sites like caniuse.com clearly highlight the specific capabilities of one platform vs. another.

    I would love to see the typographic community come up with a similar test that distills all of the relevant standards and capabilities for typography on the web and native platforms into a test that can be automated and run on different platforms (both in native code and in the various browsers). If done well, and publicized well, the type community would gain a powerful tool to encourage competition and an arms race for standards compliance and excellence in typography.

    This would seem far more productive than the fairly frequent complaints heard about the failings of typography on various platforms.

  44. iPad is capable of doing excellent, precision text layout, since the Macintosh’s Core Text framework is also available on iPad. It’s just unfortunate that iBooks evidently doesn’t make use of it. Let us hope it is only a matter of time until it gets fixed.

  45. I get it. I just used Apple’s new Safari 5 Reader feature (brilliant), and I was dismayed that it, too, justifies the text in the article, creating eye-halting rivers of negative space in the text. I don’t understand why left-justified text isn’t the standard.

  46. @Curtis, unfortunately your blowup does NOT replicate how the text appears on-screen.

    “Pixels” are a bit of a fiction on both color cameras and displays. Instead of a collection of square pixels (as with the original Mac, or the shiny-paper receipt or fax machines), almost all color displays have a collection of red, green and blue subpixels, each a third the width of the square area. (Some CRTs had round dots.)

    When you enlarge an image — say, quadrupling it in each dimension — each subpixel is repeated into each of the 4X4 subpixels of corresponding color. The actual location information, e.g., that a blue subpixel was turned on because the bright area reached just that far, is smushed out by the magnification.

    Unfortunately, I don’t know a better way to capture what you’re seeing. But your display is misleading you.

  47. The hokey faux-paper frame and background doesn’t help either. But Khoi, what I think you’re pointing to here is a lack of taste from a company that otherwise has an impressive record of good taste. Perhaps Apple’s weakness is classical typography with seriffed faces (remember ITC Garamond?). It seems to do much better with sans serif faces (Helvetica and Myriad).

    The other problem you’re hinting at is what happens to typography when you let non-typographers have control.

    But I agree that the default settings could at least have been better considered.

  48. I just want to point out that the canvas implementation of TeX line-breaking is more or less useless in practice as the text is rendered as a raster element and thus can’t be selected, copied or searched. Anyone using that system cares more for their own personal type fetish than for usability and serving themselves at the expense of their users.

  49. The Kindle 1 had a rag right option, which pretty much solved the rivers-of-white problem. They got rid of it in Kindle 2 for some reason, but you’d think Apple would at least have a rag right option, and better yet, autodetect when to turn it on as the font size got bigger and the letters-per-line count decreased.

  50. @Walt French: your point about sub pixels is correct with regard to OLED and CRT, but not so for LCD. And, interestingly enough, screen shots taken while connected to LCD and CRT displays will look different because the OS applies different antialiasing algorithms for each.

  51. Now that they have 300 dpi displays, they can work on the typography to optimize for 300 dpi displays. The next version of OS X will likely include optimizations for Retina displays.

    In iBooks specifically, though, maybe they just don’t want to put lipstick on the ePub pig? They also added PDF so you can do books with layout. There are a lot of books that don’t work in ePub, and it’s 10 years behind the Web as well. Books should be better than the Web, not worse.

    > As a web designer I fear a little bit for the weight
    > of the pages designed in 300dpi

    The weight will be less because you’ll be using SVG and CSS3.

    If you look at the Web on iPad it is common to see chunky bitmaps because of the pervasive zoom, so it’s already past the time to switch to vectors.

  52. There are certainly shortcomings in Apple’s typography, but claiming, like someone did, that Microsoft’s rendering is better, is a matter of taste. I’d say their rendering sucks and distorts type beyond unrecognizable.

  53. Actually, I found Apple’s use of a rubber hand holding the iPhone more distracting and insulting. Reading on a devise smaller than your palm is nothng more than a unexcesary strain of anyone eyes. Pick up a book.

  54. This is another example where designers totally miss the point. A regular consumer reading this post would ask: “who the hell cares?”

  55. Just a couple notes:

    – I work for a textbook publisher and you don’t hyphenate books that are going to be read by kids below a certain age, such as a Pooh Bear book.

    – The iPhone screen is smaller than a business card. Combine that with non-hyphenated text and you’re bound to see rivers. A column in a magazine (with 12 point text) might be about 2.4 inches wide–an 8.5″ wide page with 1/2″ and 1/6″ gutters. The text shown in that Pooh sample looks like it has almost 1/4 inch margins–yielding a column width of about 1.5 inches–and 14 or 16 point text.

    – The WWDC keynote video clearly shows ragged-right text at 1:16:36. See also this image: link

    Personally, I’m more concerned with the fact that they show text being selected and a contextual menu that contains dictionary, highlight, note, and search–but not copy. DRM strikes again!

    PS: @Steve: Mr. Jobs usually sends email (posts?) from his iPad these days. 🙂

  56. The typeset changes as you change the font size and/or go from one device to another, even when you change the layout from portrait to landscape. I don’t know what the author is suggesting, exactly… unless he’s thinking only of those with perfect vision who do not need to be able to adjust the font size.

  57. ************************STOP

    I cannot believe the number of comments about this. I can 100% assure you it DOES NOT RENDER LIKE THIS ON THE PHONE.

    This was a promotional video made using Motion & Final Cut Pro, the person making the video accidentally justified the text.

    Anyone attending WWDC can tell you it doesn’t look like this at all.

    iBooks DOES NOT JUSTIFY TEXT, it’s an illusion created in “gasp” a freaking video box. It’s not the real screen

  58. > I work for a textbook publisher and you don’t hyphenate books that are going to be read by kids below a certain age, such as a Pooh Bear book.

    This is a valid point, except that iBooks displays ALL books justified and un-hyphenated, not just kids books.

    > The iPhone screen is smaller than a business card. Combine that with non-hyphenated text and you’re bound to see rivers.

    Which is exactly why Apple should have used ragged-right instead of justified text.

    > The WWDC keynote video clearly shows ragged-right text at 1:16:36.

    Interesting. The iPad version of iBooks is certainly justified. It works better on the iPad without justification due to the longer measure length — but it’s still not great. Will be very interesting to see how the iPhone version actually comes out, given the mixed marketing messages.

    Besides ragged-right over justified, I’d asset that Apple would be better served on iPhone to not indent paragraphs, and instead use block paragraph, with a white line between each one. The indention just serves to further reduce the already-short measure length.

    They also probably should use vertical scrolling instead of having a page turn every 15 lines — that seems obnoxious.

    > Personally, I’m more concerned with the fact that they show text being selected and a contextual menu that contains dictionary, highlight, note, and search—but not copy. DRM strikes again!

    Yep, same way on iPad, too. 🙁

  59. > I cannot believe the number of comments about this. I can 100% assure you it DOES NOT RENDER LIKE THIS ON THE PHONE.

    I hope you’re right. Justified text on iPhone does seem likely, though, given that iBooks on iPad is justified and the new Safari reader is, too. But even if you’re right that it’s not justified on iPhone, that really only scratches the surface of everything wrong with typography on iOS.

    Definitely read Stephen Coles article, linked above. It really highlights the issues at hand: What the iPad is Missing (No, it’s not a Camera)

  60. Alas iBooks seems to have been fixed, if you notice the keynote and not the comercial you will notice that the text in the keynote is not justified centrally but to the left.

    iOS4 uses coretext (same APIs as in MacOS X 10.4 and forward) so as you have not been screaming about text on Mac OS X for 2 years dont start now cause it just makes you look silly. All that needs to happen is that developers get qued in about typography and they will see that they need curated correctly hyphenated text if they wish to use it equally justified.

    Problem solved move on to real problems.

  61. That’s really fantastic to see the power of such discussions and articles… (Well, ok this is probably not the only place where the problem have been discussed)


    Tue 08 Jun 2010 around 1:30 pm
    Khoi Vinh : article publication

    Tue 08 Jun 2010 at 10:28 pm
    Steve : This was a mistake that’s being fixed.

    Waho…

  62. I’ve noticed this consistent problem in E-Reading apps on Apple devices, Kindle app included. A hyphenation engine or the option to unjustify text would go a long way to solving these issues. But even with those necessary, and unfortunately ignored, steps we still have to rely on Publishers and copy-editors to actually read e-books after their output from Word. Until publishers look at the electronic version of their books as equals to print we won’t have the typographic quality that these devices make possible.

  63. re. Matthew’s comment – whether the ‘masses’ understand the issues is irrelevant, the point is that they are affected by them.

    The same applies for shoddily made clothes, cars, food, computers, etc – the fact that people lack the knowledge and language to express why something is ‘rubbish’ doesn’t mean they’re not frustrated by it.

    On the wider problem – implementing proper H&J in an engine that allows text to be re-sized and multi-lingual is a non-trivial problem, and still needs human judgement in some places. If it was doable, there wouldn’t be any need for human type-setters.

    Which isn’t to say it can’t be done better than now.

  64. hear hear but I do believe that HTML sucks when it comes to rendering type…this is particularly galling for someone who comes from a pint background to doing some web design….I have nearly torn all my hair out.

  65. The problem is the use of FULL justification, not typography or hyphenation.

    If iBooks only has that and does not give the reader a choice of left justified (i.e., ragged right margins), then Apple has made the same mistake that Amazon did with Kindle.

    OTOH, Stanza and eReader work fine and look great on the i-devices, with choice of font.

    Hyphenated text is often, if not most of the time, a visual distraction, especially on small screens. It’s irritating to see many lines with hyphens at their end, not to mention aesthetically poor!

  66. @Curtis
    I dont have colored anti-aliasing, here is a screen made on 10.6.3 (i didn’t changed any settings)

    link

    Is this color anti aliasing shouldn’t be by default?

  67. “Dereliction of duty?” Last time I checked, Apple’s “duty” was to their shareholders, not aesthetics mavens.

  68. I think this all boils down to people trying to poke holes in a bonified industry leader. Bottom line, I’d much rather have this problem (addressing platform level typography shortcomings) than be a spec in the rearview mirror of my competition, and I am a designer. The time spent on “typography” in Win 7 may fall in priority to the *many* other issues at hand such as being 2 years late to market. I agree, this is a moot point.

  69. @timur In the appearance System Preference pane, check to see if “Use LCD font smoothing when available” is checked. Also, sub-pixel rendering (the color anti aliasing) is not used whenever the positions of the pixel elements are unknown, can change, or the screen can rotate. This means CRTs, text in a view that’s rotated, and all iPhones, iPads, and iPod Touches.

  70. These remarks about typographic problems lying with the EPUB spec are woefully misinformed. Responsibility for those improvements lie entirely with the creator of the renderer; in the instant example, that’s Apple.

    EPUB is simply a collection of three standards, two being types of XML that define the structure of the book, the third being HTML. EPUB is silent on typography, as it should be. CSS3 contains some great new typographic controls (forcing page breaks—essential in EPUBs—and widow/orphan control, most notably), which can be used within EPUB, of course, although Apple has only implemented some of these in WebKit/iBooks at this point.

    I’m particularly baffled by one commenter’s lament:

    There are a lot of books that don’t work in ePub, and it’s 10 years behind the Web as well.

    There’s nothing correct there. EPUB supports the most current versions of HTML and CSS, in the sense that EPUB is a container in which you can put both of those, they’ll validate, it works fine, and the use of them is encouraged. I just finished hand-coding an EPUB using XHTML 1.1 and CSS3. It worked great. I’ve been a website developer for seventeen years, and creating XHTML 1.1 documents that would pass the EPUB validator meant creating the most modern HTML documents in my career.

  71. foljs: “As for the “rivers” in the text, it’s due to the (open) e-pub format used in iBooks.”

    Absolutely incorrect, and frankly this demonstrates a distressing amount of ignorance about how reflowable text (in any format) works.

    It is up to the reading system (in this case iBooks) to manage the word-spacing properly.

  72. > Besides ragged-right over justified, I’d asset
    > that Apple would be better served on iPhone
    > to not indent paragraphs, and instead use
    > block paragraph, with a white line between
    > each one. The indention just serves to further
    > reduce the already-short measure length.

    Funny, I much prefer indented paragraphs over extra lines because as important as kerning and tracking are, vertical real estate is even more important since that has a much bigger impact on how much text can fit on the screen. Which makes your reading experience worse: rivers in the text, or having only six short lines of dialog before you’ve got to turn the page again?

  73. > Which makes your reading experience worse: rivers in the text, or having only six short lines of dialog before you’ve got to turn the page again?

    You must have missed the part where I said Apple should use vertical scrolling. My suggestion was to use ragged-right text, block paragraphs AND vertical scrolling, which would mean no rivers in text, no further shortening of an already-short measure with indentation, AND you would have to turn the page far less often (or even never).

  74. I agree with much that you’ve said. And after reading these responses that have become so in depth and farther from what you’ve written, I’ve only got the following to say.

    It comes as no surprise that Apple vouches they have found ‘perfection’. They do this for everything, yet they still only have good products after 3-4 updates, overhauls or generations. That being said, it wouldn’t come as a surprise if they did really overhaul the typography displayed on their products in a model farther down the road. Everything Apple has done in their later models of products was completely possible in their initial model of a product, they just like money. 😉

  75. > You must have missed the part where I said
    > Apple should use vertical scrolling.

    No, I saw it. Either way, you’ve still got to do *something* every few lines to keep reading, and I’d rather do it every 15 lines than every 10. Or did you mean readers that continually scroll the page for you? I’ve tried that too and don’t like it.

  76. > Either way, you’ve still got to do *something* every few lines to keep reading, and I’d rather do it every 15 lines than every 10.

    Fair point. I dunno, I guess I feel like scrolling is a less intrusive, more typical touchscreen action than “turning the page,” and that it would be more comfortable that way. But it’d probably take some user testing to prove it.

  77. The more dismissive comments here about fonts, typography, layout, etc. being “finicky” or not “understood” by lay users are off-base, as they ignore the nature of usability.

    When an untrained eye sees a Manet painting, few people have any clue about how the painter accomplished his visual effects. And yet the vast majority of people who see a Manet painting find it appealing and masterfully done.

    Similarly, when most of us go to the movies, we have little or no knowledge of the vast array of film conventions (from jump cuts to inserts to pans to reaction shots) that the director and cinematographer and sound designers are deploying. Even if you are a film nerd, much of what’s technically occurring to convince you of the reality of the narrative is invisible, unless you detach from that narrative to only observe its formalism.

    But the fact that we may not understand or care about technique and craft and artfulness does not mean that we are *unaffected* by it. Someone may pick up a well-designed book and not know anything about typography et al. … and yet they will experience the book as well-designed, whether consciously or not.

    Similarly, a badly-crafted or poorly-designed product (whether a painting, film, book, website, ebook, whatever) will be received in a less comfortable and positive manner, *even if* its consumer has no idea why the user experience feels awkward or unsatisfying.

    As such, complaints like some of those found above—suggesting that concerns about “rivers” and smart quotes being trivialities which matter only to design experts—completely miss the mark.

  78. Better analogy: I couldn’t bake a croissant to save my life. But if you present me with one “crescent roll” microwaved for an inflight meal, and another fresh out of the oven of a master, artisanal pastry chef, I’ll know which one to pick…

    People can always refine or debase their taste, and develop greater appreciation for the more subtle aspects of any art or technique. But basic usability issues–like whether a text is easier or harder to read because of how it was set and laid out–do not require more than a basic, common social skillset for a meaningful difference to occur between a helpful and a frustrating user experience.

Thank you! Your remarks have been sent to Khoi.