Hacker Newsnew | past | comments | ask | show | jobs | submitlogin

Web fonts are my litmus test for whether I can trust a designer's judgment. Users don't want to see a site's brand in every letter on the page. They want legible text that loads quickly.

The default fonts on Windows, Mac, iOS, and Android are the result of millions of dollars of R&D. Custom fonts are far more likely to have issues with kerning, hinting, or subpixel rendering. They also degrade load times and cause a re-flow when the font is done downloading.

All of these issues can be avoided by using the fonts that are already installed on the user's device. That's what Github, Wordpress, Facebook, and Twitter do. They all have distinct brands without custom fonts.



> Users don't want to see a site's brand in every letter on the page. They want legible text that loads quickly.

The worst cases of this are when a site loads a font that has a few letters re-drawn to match the companies logo, but the font is used as the site's default for body text. That leads to words unrelated to the company's name appearing with pieces of the company logo—very distracting and harmful to legibility.


Wordpress:

Open Sans, via Google Fonts https://wordpress.org/

Facebook:

Freight Sans https://www.facebook.com/


When I visit Facebook I see...

    font-family: Helvetica, Arial, sans-serif
...on every element I inspect.

When I visit Wordpress.com and check the font on the body, I see:

    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif
For paragraph text such as on https://wordpress.com/about/ I see...

    font-family: Merriweather, Georgia, "Times New Roman", serif
...though no web fonts are downloaded.

It's wordpress.org (not .com) that has Open Sans. Not sure what that's about.


You snuck in a hidden implication, which is that web fonts are less legible than system fonts. That's absolutely not the case across the board.


The system fonts are legible. With web fonts... sometimes they are and sometimes they aren't. And web fonts have that re-flow during page load, which is super annoying when you're reading the first paragraph and lose your place because the web font finally loads and it's a different width than the system font. If that's not an instance of illegibility, I don't know what is.


It's very simple to use font sizes and contrast ratios that are different to read with system fonts too, if you want to do that for some reason. Web fonts aren't unique there. The re-flow is a valid technical problem, and one that ought to be improved.


If that happens, it means someone doesn't understand HTML and CSS, and how they work to display in a browser.

Hint, it should never happen on a well designed site.


The default fonts on Windows, Mac, iOS, and Android are the result of millions of dollars of R&D.

For quite some time, Apple was using Helvetica, a typeface that has objectively awful (edit: legibility) properties.

Meanwhile, some of the web fonts you see have had a very large amount of money spent on making them and world class font designers working on them.

So I don't think this argument carries much weight.

Custom fonts are far more likely to have issues with kerning, hinting, or subpixel rendering.

That depends entirely on the quality of the custom font.

As another example, for a long time on Windows you could get strange results with font stacks that used Helvetica/Arial/equivalents, because someone's random printer font would end up taking precedence over the system font you intended and result in your page looking atrocious. If you didn't know that one and used some widely recommended font stacks based on default system fonts, you would get awful results for a significant number of users.

That's what Github, Wordpress, Facebook, and Twitter do. They all have distinct brands without custom fonts.

They all have strong brands without any reference to visual design at all, other than arguably their highly recognisable logos.

However, the other 99.9999% of businesses you'll come across don't. If you're not already a world-famous unicorn brand, a well-designed and consistent look and feel does affect brand recognition and, in some cases, have very practical effects on usability.




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: