9th November, 2007

Justifying Readability

Friday, 10:19 am in Geeking

So, yesterday ~Jem [h] made a post about “web naughties” in which she confessed her love for justified text.  Now, as I’m sure you can probably guess, I too love justified text and sure, I’ve heard the arguments against it like everyone else has, but I got to wondering; does justified text really make text harder to read and (maybe more importantly) does it actually matter?

I was only wondering about it in a kind of idle, abstract fashion until I saw the following comment – addressed to me – left by Jordan.

The issue with justified text on a computer, is that it’s an entirely different source of light. It’s NOT the same as a newspaper, magazine, or book. Those are different sources of light. They reflect.

Having justified text on screen causes the eyes to notice patterns in the text, and can sometimes confuse a reader or even distract them. Keeping the text left aligned (for those of us that read languages that go left/right) also helps our eyes to scan the words better.

Your website is a bit of a perfect example. You have a larger line height with justified text. It isn’t easy on the eyes to read that. If you lessened the line height and remove the justification, it would definitely be more readable for a user.

Quoted From: Jordan

Now, my first impression of this was one of snide lulz because, while this is probably about the politest thing Jordan has ever said to me,1 I was amused she still couldn’t resist a little dig at my site.  Ooh, burn!  So, I went to her site to check out the alleged readability of her text; as I suspected, single-spaced left aligned 8 point Verdana, black on white; the ultimate “look at me I’m accessible!” option.  Thing is, you know how everyone always talks about text readability being aimed at people with poor eyesight?  Well, guess what.  That’s me you’re talking about.  Sure, I don’t use a magnifier, but I have massive astigmatism and a hardening in my lenses that makes focusing difficult and causes my eyes get incredibly fatigued when reading text off a screen (you know that feeling in your eyes when you’re really tired?  Well, I get that all the time).  The net result is that I’m incredibly sensitive to the formatting of text,2 and one of the things that really gives me a headache really fast is trying to read single-spaced lines.  I mean, the fact that I personally think they’re incredibly ugly aside, the squashed words and lines have a tendency to all run together for me and make it much more difficult for me to focus and much easier for me to ‘skip’ lines.  I need my white space!  Not only does my personal sense of aesthetics think it looks nicer, but it’s much less likely to give me a raging headache for the rest of the day.

See, the thing is, the fact that I like double-spaced lines is subjective.  That’s my whole point; because it is subjective, it essentially negates the ‘fact’ Jordan was trying to slap me with that single-spaced left-aligned text “isn’t easy on the eyes”.

So, curious, I went trawling Google for readability studies regarding text displayed on screens rather than in print.  I couldn’t find very many.  I could find plenty of opinions on the subject, sure, but only one a couple of actual studies and they were primarily about font face and size (12 point Verdana, if you’re wondering).  See, text readability is about a hell of a lot more than just whether or not your text is justified or not.  Actually, the justification of text wasn’t even mentioned very much at all; it seemed to be a relatively minor consideration.  So what does contribute to text readability?

Factors Contributing to Text Readability (A List)
  • Font Face
    The actual font of your text seems to be the primary factor in its readability.  Serif versus sans-serif is always a hotly-contested issue, and from what I’ve read it seems that most people read sans-serif fonts slightly faster than serif fonts, but the actual physical shape of the letters is important as well.  Up until very recently, most fonts were designed for print and had a tendency to display badly on the screen; generally by having the letters touch one another, especially at smaller point sizes, which is a great big readability no-no.  So fonts like Gerogia and Verdana were designed; their hinting is specifically targeted at screen display.  This is, incidentally, why Verdana at 8pt looks a lot different to Verdana at 12pt; the font attempts to compensate for the smaller text size by re-shaping its letters to improve readability.  The x-height of a font seems to be important too; fonts with smaller x-heights (e.g. Century Gothic) are harder to read than fonts with slightly more pronounced x-heights (e.g. Verdana).
  • Text Size
    Text size seems to be about the next more important factor in readability.  10-12pt seems to be ‘optimum’ for adults, with point sizes larger than that not significantly increasing readability.  Anything smaller than 10pt is getting into the ‘unreadable’ territory and interestingly it seems that the older you are the more likely you are to be affected by smaller fonts (this may seem obvious until you realise that, culturally, font size is an indication of age; children’s books having large text and adult books having small text).  Incidentally, this is why I make my site’s text small; to give my parents a headache when they try and read my blog (and no I am not joking).
  • Contrast
    Black text on white seems to be the consensus as far as optimum readability goes, however with that being said, I’d just like to send out a plea from someone who is incredibly sensitive to screen glare; for gods’ sakes if you’re going to have this, have a neutral coloured background outside your text box!  I’m actually much more partial to off-whites and pale colours than #FFF, which I find very harsh on my poor eyes.
  • Words Per Line
    The more words you try and cram on any one single line, the harder it is to read (well, generally speaking; I’ve found some dissent to this).  This seems to be caused by the eyes of the reader having to travel further; both to the end of the line and ‘wrapping’ back again.  Most people on the web try to jam way too many words in; if you look at most books, they tend to use either 8 to 12 or 12 to 15 words per line.  Before you all shout, “But The Internet Is Not A Book!”, I’m not convinced this is something we should be discounting as part of the bygone days of print.  About 30-40em seems to be a good size.
  • Line Height
    I did manage to find one study on line height (called leading in the industry), which seemed to indicate that a slightly larger gap between lines and paragraphs is, in fact, easier to read than single-spaced.  Anecdotal evidence from designers backs this up.
  • Margins
    How far away your text is from the ‘edge’ of its bounding box.  Butting your text right up against the edge is generally considered a no-no.
  • Alignment
    People seem to have awfully strong opinions on the subject, but nevertheless I couldn’t actually find any studies on it.  The best I can do is say that the longer your individual lines are, the less intrusive justified text becomes.  On very short lines, justified text is a definite no-no due to the choppy white-space.  However, when dealing with ‘normal’, body text length lines (30+em) justified text seems to emerge as a definite aesthetic winner; the consensus is that it makes text look nicer and (amongst the ‘common folk’) ‘more professional’, probably because this is how 99% of books are formatted.  On the other hand, block right-aligned text is a definite no-no, and even the use of centred text is contested (and quite rare).
Readability vs Aesthetics

I’m just going to come right out and say it; if everyone on the internet decided to format their text as 40em wide 10pt black-on-white Verdana with 1.5 line-height and 2em margins I would cry.  Because – c’mon people – that’s so fucking boring.  We’re back onto my old bugbear here of aesthetics versus ‘accessibility’ and, as you can probably tell, I’m more in the aesthetics camp.  To be perfectly frank, I think a lot of the harping that goes on about what does and doesn’t improve readability is a bit of a shield people hide behind to excuse what are essentially boring design choices.  Yeah, we can all take the safe route; but do we always want to?  I mean sure, if what you’re going for is 100% readability 100% of the time then by all means, go ahead, but I don’t necessarily think that this choice is any more justified (a-har!) in the context of personal websites than the designer who is prepared to shave a bit of accessibility off the edge in order to present text in a way that is more aesthetic.

I mean, if you’re designing on a proper semantic model your choices can all be over-ridden anyway if people have a real problem with them, so why not go for what you personally love?  It’s your site, after all; all that 10pt left-aligned Verdana tells me about you is that you unquestioningly believe everything you read on A List Apart.

This is Not Science (Yet)

And here’s the other thing, you see, because all the guidelines on readability are just that; guidelines.  Sure, on average people find 10pt Verdana easier to read than 7pt Verdana; so what?  And the thing is, I don’t necessarily think it’s as simple as all that.

I’m going back to justified text again.  One of the most common arguments against it is that it’s bad because it can leave larger gaps between words and this can distract your readers.  But… does it?  It certainly doesn’t distract me; in fact, slightly larger gaps between words actually make them sightly easier for me to read.  And I think I know the reason why; I was taught whole-word reading.

Unlike people (probably most of you) who were taught phonics, I don’t read words by recognising the individual letters inside them.  Instead, I register the ‘shape’ of the whole word.  This is why I find it very difficult to pick out letter-shifted spelling mistakes, especially in text where I’m ‘expecting’ to see a certain word (my beta tells me I have a tendency to write ‘Brice’ instead of ‘Bruce’ for example).  I’m not sure if any studies have been conducted on readability for people taught phonics versus people taught whole word reading, but from personal experience I can assert that I find words with larger white-space surrounding them much easier to read as the shapes of the words themselves become more prominent.  The more squashed together words are (such as is the case with left-aligned text), the more I have to concentrate on picking out the individual shapes.

And this is what I mean when I say readability is not an exact science; because so much of it is subjective.  If I find the presentation of text aesthetically pleasing, I’m more likely to try reading it than if it’s simply boringly functional (because I am vain like that).  In a case of not being able to please all of the people all of the time, other people are exactly the reverse.  It also seems that past biases are hugely influential on what people ‘think’ should be more readable; people who’ve been told that justified text is ‘bad’ are more likely to dislike it when they come across it than people who haven’t.  And even people who advocate readability seem to vary wildly on what parts they actually implement; I’ve seen people decry justification while simultaneously implementing tiny font sizes, or hugely long lines, or small leadings.  The whole thing’s a bit of a mess, in other words.

I don’t really know where I’m going with this.  On the one hand, I definitely think that everyone should be aware of best-practice readability but on the other hand I’d never advocate that it should be applied to everyone, all the time, in every context.  Have some personality, people!  I mean, unless you’re redesigning news.com.au or something.

The one thing I definitely would like to see, however, are more studies.  Anyone out there need a PhD?

References
  1. A Study of the Readability of On-Screen Text (PDF)
  2. Text Font Readability Study
  3. Readability - making pages easy to read by design
  4. Reading Text Online: A Comparison of Four White Space Layouts
  5. Compose to a Vertical Rhythm
  1. I told her once that being clingy and whiny on the one day of the year her boyfriend wanted to go watch wrestling with his mates was a good way to not have a boyfriend any more.  Apparently, when it comes to unfounded advice, Jordan can dish it out but she certainly can’t take it. ^
  2. Yes, if you’re wondering; I find my own site difficult to read because of the low contrast and small font-size.  If I can suck it down in the name of aesthetics, then so can you. ^

Comments

  1. User Avatar

    A little off-topic

    It’s very puzzling to me how assumptions made about opinions on the internet are treated at times. When you given an opinion, is it implied that it’s only YOUR opinion or should you need to express that? When do we assume subjectivity and objectivity in opinions? Would it have made a difference if Jordan had said “In my opinion, it isn’t easy on the eyes to read that”?

    You see it elsewhere too, when people say things like “oh your colours don’t match at all”; implied subjectivity or not? Because a common response to that is “that’s YOUR opinion” and the answer to THAT is “well duh”. It’s just…  how do you read opinions?

  2. User Avatar

    I think it’s almost purely contextual; it depends on who’s doing the saying and how they’re expressing it.

    Would it have made a difference if Jordan had said “In my opinion, it isn’t easy on the eyes to read that”?

    Well, it depends on what you mean by ‘difference’.  Would I still have written this?  Most likely.  Would I maybe have a slightly higher opinion of her opinion?  Probably that, too.

    In the first part of her comment she’s presenting information as ‘facts’ and – let’s face it – it’s Jordan we’re talking about here; the kid who tries so hard to be the biggest, baddest bitch on the block it sometimes seems like she’s forgotten how to be anything else.  So yes, I assume in the latter part of her comment she’s presenting something that she thinks is also a fact; I, on the other hand, think she’s an idiot and because she’s offered no corroborating evidence (she’s essentially said, “My site is better; be more like me!”) I’m inclined to take her ‘fact’ as ‘opinion’.  Since I never actually hear this argument expressed as anything other than an opinion, I went out to do research on whether or not it has a grounding in some kind of empirical study, and came up lacking; I can only assume then that the idea has travelled from designer to designer memetically.

    I think the whole “that’s YOUR opinion” “well duh” is a bit of a double straw-man, too.  I mean, by definition someone’s opinion cannot be ‘wrong’ – it’s their opinion either way, after all.  I can certainly disagree with someone’s opinion, and if someone is presenting something as a fact which is actually an opinion… well then I can disagree with that, too.

  3. User Avatar

    Actually I’m of the opinions that opinions can often be wrong, but it’s just impolite to point it out, especially in our culture of hastily jumping to “let’s agree to disagree!”. Having an opinion and the right to one doesn’t mean you get exempt from having it challenged.

    Mmm but I agree, I guess it does depend on context and what is being said. Once you present something as a fact, you better have something to back it up. tongue.png

  4. User Avatar

    Actually I’m of the opinions that opinions can often be wrong

    Ah, semantics issue here I think.

    If someone says, “I think the world is flat” then this is an opinion and yes, it’s correct; they do, indeed, think the world is flat.  (Well, unless they’re lying I guess, but let’s pretend they’re not.)  However the fact behind it – that the world is flat – is the thing that is incorrect.

    It becomes less clear-cut when the expressed opinion is about something which is not objectively demonstrable; most issues of design fall into this category.  You can’t really refute someone’s personal preferences.  You personally might think that they’re bad preferences, but again, this is merely an opinion of an opinion.

    If that makes sense?

  5. User Avatar

    “the kid who tries so hard to be the biggest, baddest bitch on the block it sometimes seems like she’s forgotten how to be anything else.”

    Man, when the fuck did I burn you so bad that you think I’m some “kid” who’s trying to be some bad ass bitch? Because that’s the last thing I’ve ever cared of. I mean, forgive me for being clueless here, but aside from your bringing up a thread from Snark, I have no fucking clue who you are.

    “So yes, I assume in the latter part of her comment she’s presenting something that she thinks is also a fact; I, on the other hand, think she’s an idiot and because she’s offered no corroborating evidence (she’s essentially said, “My site is better; be more like me!”) I’m inclined to take her ‘fact’ as ‘opinion’.”

    I wasn’t even trying to imply that with my comment. I don’t even see how you could have gotten that impression, other than the fact that you’ve got a personal grudge against me from whatever was said in the past. I made my comment to you as a complete stranger, not really remembering who you were, what you’ve said to me, and what I’ve said to you.

    If you want to call me an idiot solely based on the fact that I didn’t give you links/cite why I have my opinion, then hey, it’s not going to affect me in any way. I don’t have any issues with you. Sure I disagreed and was pissed at a comment you made to me, but I got the fuck over it.

    Maybe you should too.

  6. User Avatar

    I have but one thing to say: I love you.

  7. User Avatar

    I must have missed the memo that text justification had anything to do with a comment you made to me months upon months ago in regards to something that doesn’t even correlate to your post.

    And god forbid I make a comment directed to you while using your site as an example. Explain to me how that qualifies as me personally digging at you? Sorry but I had *no* idea who you were when I was replying to your comment.

    I don’t go around forums and member’s websites to attack them in the future. Kudos to you for remembering something as pedantic as your little footnote. Seriously, I forgot about it and you should have forgotten about it as well.

    The only issue with your font, to me, is the fact that you’re using a serif based font, coupled with larger line-height and justification. Like I had mentioned in my comment viewing a website versus a book is entirely different as their different lightsources. Which is almost why web design + typography, is different then print + typography.

    Either way I wasn’t trying to be snide in my comment, nor was I making it personal AT ALL. So I’m pretty amused that you took it as such, and also took it upon yourself to bring in an outside “issue.” Regardless, I highly doubt most of us actually practice what we’re preaching. Again, I use the context of “us” in general, and I’m not necessarily implying you.

    I’m the last person that gives a damn about accessibility. I know about it and apply it to my work, but when it comes to my personal websites, it doesn’t get applied [as throughly.]

  8. User Avatar

    Mmm, inciting trolls!  Delicious!

    Seriously, I forgot about it and you should have forgotten about it as well.

    Forget your self-aggrandizingly vicious cruelty?  Hardly.  Oh, I don’t expect you to remember – far from it – but I certainly do.  Like I suspect most of the people you’ve attacked in the past do.  I mean, don’t get me wrong, I don’t sit around dwelling on it, but it’s there in my mind, filed away in the back so that when I see you again I can pull it out and think, “Ah, right.  Jordan; the girl who works so hard at being the Big Bad Bitch.”

    is the fact that you’re using a serif based font

    Er, no.  It’s Century Gothic (defaulting back to Verdana, I believe, then generic sans-serif); very definitely a sans-serif font.  Oh, except in the quotes; they’re in Bookman or something.

    Either way I wasn’t trying to be snide in my comment

    Purely based on your reputation, I don’t think I actually believe you know how to be anything other than snide.  Welcome to the downside of deliberately making yourself unlikeable.  People won’t like you.  Shocking, I know.

  9. User Avatar

    lolfest

    I completely agree with everything you’re saying here! The only reason Jem, Jordan, and all the other Validation/Readability drones don’t agree, is simply because they’re completely unoriginal.

    They like to follow these obscure rules, because this way they get to be MOAR 1337!!11, and at the same time, don’t have to have a creative bone in their body. It’s purely laziness and unoriginality, and it’s very distressing, I agree.

    I happen to think your site is perfectly readable, and originally designed as well — I’m guessing the drones secretly agree, but can’t admit it. ((Perhaps not even to themselves.)) It all falls back on jealousy, my friend! I honestly believe this. They’ve criticised me many times on this subject alone, ‘LAWL YOU CANZ BE SRS, WE ARE IS NOT JELOUS’, but I honestly believe that they ARE jealous of us. ((Us being people of creative minds and creative sites alike.))

    Oh, and you may be interested in this, which is how I found your site: http://police.babblative.com/subjectifying-stupidity Although I’m sure you’ve already found out about it via your webstats. ((On a side note, isn’t their site nice and readable? Oh yes, it is! White on BLACK? Isn’t that a Readability TABOO? Jesus, even I haven’t done that combination in years, and I’m a total I-Love-The-Colour-Black freak.)) If you’ve never heard of their site before, pay it no mind — Just another couple of drones trying to ‘start’ things for their own amusement.

    Anyway, kudos to you and your work.

  10. User Avatar

    The only reason Jem, Jordan, and all the other Validation/Readability drones don’t agree, is simply because they’re completely unoriginal.

    Well, that’s not quite why I’m saying, no… sweatdrop.png

    Oh, and you may be interested in this

    Aah, I was wondering why my hits tracker seemed to be going nuts.

    Goddamnit, looks like my project for November is completed and it’s only the 11th.  Sheesh, what else am I gonna post about for the rest of NaBloPoMo…

  11. User Avatar

    Lawl. ^^;

    Whoops, sorry Dee … I guess I misinterpreted. @_@

    I read this: ‘Yeah.  It gets quite depressing.  I mean, okay, a lot of these sites look nice but they don’t look… spectacular.  They’re functional designs rather than works of art.’ After I read your whole blog, so I just figured … You felt the same way as I. gasp.png

    And Jem, please, no begging for hits/advertising on other’s comments. It’s quite rude! Besides, you’ll get much more visitors if you go out and find a soul, I promise. smile.png

    Or if you pay them.

  12. User Avatar

    H’okay.  While I’m sure ~Jem [h] is a big girl and can defend herself… this is my site and the only one allowed to use cutting remarks against her is me.  So that’s quite enough of that, okay?

    Let’s at least try and pretend we’re all adults here and back-stab each other in our own blogs like normal people.

  13. User Avatar

    LOL. Mallory, perhaps you should have read my site.. you know, the part where I clearly state that I actually quite like justified text?

    Pfft, insult someone’s website once and they think they know ya, ‘ey.

  14. User Avatar

    Seems to be an unfortunate side-effect of the IP post, really; people back-patting me for what IP say I said rather than what I was actually saying.

    Learn to read, pls, internets…

    >_>

  15. User Avatar

    Dee, IP was very careful to quote you, so that what you said wasn’t misinterpreted. I know, because I made sure that I quoted you. If there was any confusion please feel free to clear it up.

  16. User Avatar

    It’s less to do with what I said and more of the vibe around designing for oneself versus designing for other people.  On my personal site, I design primarily for myself; I’m happy to admit that and I don’t think that’s a ‘wrong’ choice per se, even if it’s somewhat unfashionable at the moment.  When I do freelance professional stuff (hah!) I try and be a bit more generic, but at void-star.net I’m happy enough to experiment a bit and make mistakes.

    IP was quite critical of this attitude and, I mean, that’s fine (I quite like IP and it would be silly of me to complain about getting ‘featured’ there after deliberately going out and picking a fight, after all) but it does provoke people who don’t agree with IP to come over here and laud me as some kind of hero to their cause.  Which I’m really not.  It’s true that I do think the rush to standardise (which I agree with, incidentally) and the current focus on content-over-presentation has kinda induced a trend towards blandness and I wouldn’t be sad to see a bit of a push back the other way.  I mean, the hallmark of a really good professional webdesigner is the ability to pull off both, but for the rest of us there’s always a bit of a trade-off.

    Talking about this sort of stuff in hyperbolic, emotive language gets people thinking about it, at the very least. smile.png

Add Comment
auto insert line breaks
use log.code
use smilies
Verification
  • v-s.net v0.6 and all content (unless noted) © Dee.
  • sk.log v0.6 spat this out in 2.091 seconds.
  • 39 / 211,497
artistic-twobyfour