
How Typography Affects Readers - ankitoberoi
http://www.adpushup.com/blog/how-typography-affects-readers/
======
maho
I did not finish that article precisely because of their fonts.

When I first opened the page, the text was displayed in a "Times" font, which
looked very crisp but surprisingly bland, considering the topic of the text. I
have NoScript running and I realized it was probably blocking the script that
downloads a custom font. (In this case, "Karla" from googleapis.) Digging
deeper, their css rules don't specify a fallback font (the css file _does_ ,
but it is overwritten by an inline style), so Firefox defaulted to the 'Times'
font.

Ok, I thought, let me see that font-magic they are talking about in action,
and I enabled scripts on adpushup.com. The result was... suboptimal. The
letter spacing was huge and the fonts were extremely blurry.

I probably can't blame them for the fact the font displayed blurry. (A Firefox
problem? Maybe Windows? I don't know what is going on in the background.) But
I can, and I do, blame them for not being aware of the blurriness problem
(Windows XP + Firefox can't be such a rare combination) and for not specifying
a proper fallback font.

Well, those two things bugged me enough to stop reading.

~~~
ankitoberoi
Hi,

Thanks for pointing this out. XP+FF is indeed important, it is about 4% of our
traffic. The CSS fallback is being fixed.

The font looks same on 7 & XP both:
[http://www.browserstack.com/screenshots/21265f29764195b7a298...](http://www.browserstack.com/screenshots/21265f29764195b7a2985887cf62e7daebdf6f27)
[http://www.browserstack.com/screenshots/a81e07f3288687d3fc0f...](http://www.browserstack.com/screenshots/a81e07f3288687d3fc0f5344c554a9ff3686c911)

Would you be kind enough to upload a screenshot of the blurry font? :)

~~~
maho
Sure! Here is what I see (with scripts enabled):

[http://postimg.org/image/572wjz4rp/](http://postimg.org/image/572wjz4rp/)

It's similar to what browserstack shows (the wavy look of the top bar of the
capital T in the headline, the "hat" on the capital O in the text), but in
some ways it looks worse on my system, especially the bold face:

[http://postimg.org/image/r4zddrjs5/](http://postimg.org/image/r4zddrjs5/)

Note the jaggy lower part of the bold, lower case y, and how the bottom of the
bold lower case e and the top of the bold lower case t are thinning out
precariously..

Times, on the other hand, does not look blurry:

[http://postimg.org/image/4cl9wjwql/](http://postimg.org/image/4cl9wjwql/)

Maybe my eyes need recalibration, but personally I find times much easier to
read, mostly due to its crispness.

------
kszx
Ironically, the font family "Karla" on that blog makes the text quite
difficult to read.
([http://www.google.com/fonts/specimen/Karla](http://www.google.com/fonts/specimen/Karla))

They might benefit from inspecting their own quotations more closely: "when it
is a good design, the reader has to feel comfortable because the letter is
both banal and beautiful." (Frutiger)

------
JeroenRansijn
I don't agree with a lot of the explanations/guidelines this article gives.

An actually good article about guidelines for Typography: [The 100%
Easy-2-Read
Standard]([http://ia.net/blog/100e2r/](http://ia.net/blog/100e2r/))

~~~
Pitarou
I'll say this much. The article you linked to is much, much easier on the
eyes.

------
jakewalker
The New York Times ran a series of stories last year by Errol Morris that
suggested that the use of certain fonts resulted in the reader being more
likely to believe what was written. The articles reference other similar
research; I found the whole thing fascinating.

Part One: [http://opinionator.blogs.nytimes.com/2012/08/08/hear-all-
ye-...](http://opinionator.blogs.nytimes.com/2012/08/08/hear-all-ye-people-
hearken-o-earth/)

Part Two: [http://opinionator.blogs.nytimes.com/2012/08/09/hear-all-
ye-...](http://opinionator.blogs.nytimes.com/2012/08/09/hear-all-ye-people-
hearken-o-earth-part-2/)

[EDIT: And of course, now that I dig into the article, I see that it
references these Errol Morris articles, too.]

------
RamiK
I've personally seen proper typesetting with Baskerville or Computer Modern
using TeX changing "needs more work" draft essays into an "Excellent" mark
without content changes. More so, just using paragraph indentation instead of
spacing was enough at times.

------
exizt88
Any article on typography that uses word shape as an actual model of word
recognition instantly loses my attention. For better approaches, see
[http://www.microsoft.com/typography/ctfonts/wordrecognition....](http://www.microsoft.com/typography/ctfonts/wordrecognition.aspx)

------
cpsempek
Does anyone know if the laws that require tobacco companies, for instance, to
place health warnings on cigarette boxes also specify the appearance of the
label (e.g., font family or size). If not, this article seems to suggest that
companies should seek out typography, such as comic sans, that would lessen
the negative effects of such labels.

------
thenerdfiles
How do dyslexic fonts like OpenDyslexic[0], Eulexia[1], and AlphaSymbolic[2]
fit into all of this talk on normative typesetting ? And the internal rift of
Open Source latent to this discussion, with fonts like Dyslexie[3] ?

The underlying question here is the need to expose and enhance accessibility
around typefaces and metanotational typefaces. I believe that we should not
design to our demographic, because how do we truly know? Rather we should make
it possible for our demographic, whoever it is, to preferrentially set
typefaces to their cognitive and aesthetic needs, to shape the stage of
reception.

I say this primarily for the fact that many designs I do come across in
websites, once I apply a font like OpenDyslexic using browser extensions, for
instance, those designs fail, become distorted, elements shift about, become
hidden or obscured, etc.

Adding to that: what about color? Contrast? Do certain fonts work better on
inverted or otherwise?

I want to ask: What if that Higgs boson article had been set in OpenDyslexic?
I run a similar experiment on my own blog[4], where I set a font tailored for
dyslexics as the primary font (with hooks to change contrast and to set
AlphaSymbolic in the "sticky footer"): I receive similarly negative responses.

Does our industry even have the conceptual layout to meaningfully ask these
types of questions, and does it have the economic and aesthetic infrastructure
to initiate and sincerely act upon whatever answers and strategies we decide
upon?

[0]: [http://opendyslexic.org/](http://opendyslexic.org/)

[1]:
[http://antijingoist.github.io/Eulexia/](http://antijingoist.github.io/Eulexia/)

[2]:
[http://antijingoist.github.io/AlphaSymbolic/](http://antijingoist.github.io/AlphaSymbolic/)

[3]: [http://www.studiostudio.nl/](http://www.studiostudio.nl/)

[4]: [http://webjournal.nerdfiles.net/the-semantic-
web/](http://webjournal.nerdfiles.net/the-semantic-web/)

~~~
porker
All I can add is my partner is a dyslexia teacher and assessor, and we tested
those fonts on a range of pupils when building her latest website. None aided
our sample.

Dyslexia is a very broad definition, and I can imagine they could work for
certain types of dyslexia but not others.

~~~
thenerdfiles
I'm curious to know the scope and concrete findings and anecdotal
findings/reports of your tests.

What was the nature of the literature/content on the website? Longform?
Marketing? Blurbs? Did you test for memory? Comprehension? Speed?

Aside from aiding, did the fonts hurt comprehension? Hurt readability?

~~~
porker
There were no concrete findings - these were informal tests in a field where
concrete findings are nigh-on impossible.

The website is a mix of marketing and longform, advertising dyslexia services.
Often it's read by the parent of a dyslexic so there's two audiences to
address. Of the dyslexics we tested with, all found the fonts hurt readability
and they were seeing individual letters (instead of words) _more_ than they
were with a standard font (Source Sans Pro). The parents we also tested found
the 'Dyslexic' fonts very hard to read. So for our small sample of children it
didn't help, and in this situation wasn't worth pursuing.

Most of these children IIRC find a coloured overlay is all they need to read
acceptably; colour and contrast is another thing I'd have liked to test but
there's only so much you can subject children (who aren't your own) to!

------
dingaling
Is it possible to determine what proportion of browsers actually accept the
specified fonts and colours into which designers pour so much time and
thought?

'Ignore fonts specified by websites' is one of the quickest usability
configurations, particularly for people with impaired vision.

------
JoeAltmaier
I'm not sure about the 'research' part of this article. That Twitter exploded
when Higgs was announced in Comic Sans? So what? Its a hot button, and a
flash-mob flaming on it is not much of a datapoint.

~~~
ankitoberoi
This Case Study of Higgs simply proves why selecting an appropriate font is
important. This is followed by data of experiments done by Errol Morris.

~~~
JoeAltmaier
It proves nothing - Comic Sans is a hot-button, a singularity. If they had
used Ariel instead of Courier, would Twitter have exploded? No? It had nothing
to do with the effectiveness of the font, it was just a nerd thing.

~~~
ankitoberoi
Exploded? No.

But that's what we've been trying to find with this article: How Typography
affects users.

From the different researches cited in the articles (all backed with data),
font selection did seem to make a difference. Maybe Little.

