Share your questions, comments, and ideas about the Fonts chapter of the Web Almanac…
I’m amazed to see such high usage (1.8%) of variable fonts! Is there a way to access the dataset to see which sites are using them?
@stewf The majority of this sites actually use Oswald (94.5%) and Comfortaa (5.3%) followed by Markazi Text, Work Sans, Source Sans/Serif, Inter and 3 or 4 sites using others. I can share a Google Doc of all variable fonts from the Almanac results incl the page URL if you like?
It seems the “most popular typefaces” section is kinda inaccurate, simply because it’s aggregated on font-family name only.
According to your “ranking” for example FontAwesome is only on rank #11, even though my best guess would be it should be on #2.
Looking at the Almanac data there are 723 different font-family namings for FontAwesome alone, like
and so on.
To be more specific:
4,455,431 FontAwesome < only this is taken into account
… plus 716 alternate font-family names
I also noticed an issue with the function to retrieve font names in respective query, it also returns font names like
"\FontAwesome\;src:url(//diyservicemanuals.com/wp-content/thesis/skins/sparkez/\fonts/fontawesome-webfont.eot?v=4.0.3\);src:url(//diyservicemanuals.com/wp-content/thesis/skins/sparkez/\fonts/fontawesome-webfont.eot?#iefix&v=4.0.3\) format(\embedded-opentype\), url(//diyservicemanuals.com/wp-content/thesis/skins/sparkez/\fonts/fontawesome-webfont.woff?v=4.0.3\) format(\woff\), url(//diyservicemanuals.com/wp-content/thesis/skins/sparkez/\fonts/fontawesome-webfont.ttf?v=4.0.3\) format(\truetype\), url(//diyservicemanuals.com/wp-content/thesis/skins/sparkez/\fonts/fontawesome-webfont.svg?v=4.0.3#fontawesomeregular\) format(\svg\)"
or multiple names like
"微軟正黑體,新細明體, Arial, Helvetica, sans-serif, FontAwesome"
Guess this is related to the original response data and not the function itself though.
There’s another issue with the “most popular typefaces” btw., possibly affecting other sections, too. Some requests attributed to Open Sans are not actually requests related to the actual page they had been attributed to, but due to Cloudflare’s anti-bot protection.
For example: http://www.madereros.com/ doesn’t use any web font at all, even though according to the Almanac data it does, but instead your crawler saw Cloudflare’s anti-bot page here (which uses Open Sans).