
Google Web Fonts Typographic Project - endianswap
https://femmebot.github.io/google-type/
======
jimhefferon
I find these pairings interesting, and thank the authors. Having knowledgeable
and experienced people make suggestions is neat, really great.

FWIW, what would help me most (not that the authors are obliged to provide it;
I'm not saying that) is if someone in that category would give some guidelines
under what circumstances certain parings are reasonable. Kind of a white-wine-
with-fish thing.

For instance, "sober, as with a business report" or "lighter, such as a human-
interest story" would help those of us who are, sigh, completely without a
clue.

~~~
mastax
This is not quite what you're asking for but
[http://practicaltypography.com](http://practicaltypography.com) has lots of
useful advice.

~~~
afandian
Did you try clicking on that link? There's some referrer detection. I think
the author doesn't think much of HN.

~~~
weblemur
Yeah, he has a whole rant about referral sites generating traffic but not
interest. It's actually a good read, if a bit sour. However, I don't think
that should color the opinion of the book, as it still is one of the best
modern, freely available typography resources around (in my opinion).

------
aban
Beautiful Web Type [0] is another beautiful showcase made using the fonts
available on the Google Fonts directory.

Font Pair [1] and Font Pairing [2] are pretty awesome too.

[0]: [http://hellohappy.org/beautiful-web-
type/](http://hellohappy.org/beautiful-web-type/)

[1]: [http://fontpair.co/](http://fontpair.co/)

[2]:
[http://www.ourownthing.co.uk/fontpairing/](http://www.ourownthing.co.uk/fontpairing/)

------
widdma
Wow, this is really beautiful. One thing I feel lets it down is that "text-
align: justify" still isn't on par with print quality in browsers. It is
getting better, but it's still a way behind pdflatex+microtype.

I'm sure there's work being done by talented people, but it's a hard problem,
and maybe there's been compromise between speed and quality stuck?

~~~
david_ar
See
[https://bugzilla.mozilla.org/show_bug.cgi?id=630181](https://bugzilla.mozilla.org/show_bug.cgi?id=630181)

My understanding is that the main problem is incompatibilities between the CSS
and TeX layout models. That's not to say that there isn't still plenty of room
for improvement, however.

------
duncanawoods
My problem with google fonts is not how to pair them but how differently they
appear on different OS/browser combinations.

Something like Lato can look great but its relative weight on OSX Safari vs.
Chome Windows is so different that I just don't think it can be used in
production.

------
cheriot
Yes! I love typography and try to start the design of my personal projects
with font choice and positioning. I'm a developer, though, so I can never
match two fonts well. This site is fantastic.

------
aorth
Great examples of font pairings—web fonts have come a long way! I like the
parallel trend of web sites/frameworks like Medium, WordPress, Bootstrap,
GitHub, etc moving to using native system fonts, though[0]. Make websites look
good on all platforms and load quickly.

[0] [https://www.smashingmagazine.com/2015/11/using-system-ui-
fon...](https://www.smashingmagazine.com/2015/11/using-system-ui-fonts-
practical-guide/)

------
plg
I would love to find a list of which google fonts include ligatures

~~~
ternaryoperator
Be careful with ligatures in Web pages. They have downsides, which might not
initially be apparent.

Ligatures are their own font characters. That is, an s-t font ligature is not
recognized as an s and a t except visually. So, some things break:

1) search of text. "step" become a font-dependent codepoint followed by "tep"

2) accessibility for handicapped users. Readers generally cannot correctly
translate ligatures.

3) browsers do not guarantee to handle your ligature correctly, especially
older versions of browsers.

So, for the small increment in esthetics, you're creating a small pile of
annoyances for readers and affecting the ability to find docs on your site via
search engines.

For these reasons, you don't frequently find ligatures in Web pages.

~~~
glitch
The trick is to use a font that has ligatures, but not to use the ligature
characters directly. Let the presentation choose the glyphs to display, and
let the encoded characters remain separate as they should. CSS handles this
with "font-variant-ligatures" (works in some browsers). I just did a test in
Chrome on OS X; toggling between "font-variant-ligatures: common-ligatures"
and "font-variant-ligatures: none" changed the presentation, but it did not
negatively impact the accessibility, searchability, etc. as the ligature
characters would. Automatic glyph substitution in presentation yay; encoded
character substitution nay.

------
eknight15
Download all Google fonts:
[https://github.com/google/fonts](https://github.com/google/fonts)

------
ishi
In The Fox & the Grapes, if you try to move the fox over to the grapes they
move away. Nice touch :)

------
infocollector
Are Google fonts free to use in publications/books? Does anyone know?

~~~
CharlesW
For any given font, the license is specified on the font's specimen page.

For example, near the bottom-right corner of
[https://fonts.google.com/specimen/Montserrat](https://fonts.google.com/specimen/Montserrat)
we can see that the license used is the SIL Open Font License. And from the
SIL fonts FAQ[1]:

 _Please feel free to use SIL fonts in printed publications and PDF documents,
including PDF documents posted on web pages. Such use is within the intended
use of SIL fonts. No additional license or fee is required to use the fonts in
a printed publication._

[1]
[http://scripts.sil.org/cms/scripts/page.php?site_id=nrsi&id=...](http://scripts.sil.org/cms/scripts/page.php?site_id=nrsi&id=FontFAQ_use)

------
restapi
Looks very nice, thanks a lot to the authors.

------
korefan
Liked the colours

~~~
jacobsievers
Agreed. Typography? Not so much...

