​

The Rapid Adoption of Web Fonts

& the Opportunities that Lie Ahead!

David Kuettel, John Giannopoulos

ATypI 2013 - Amsterdam

goo.gl/Bze9U6

Goals of the adoption analysis

Determine how far along the industry has come

​

Gather hard, quantitative data together

​

Share cross-industry perspective & opportunities ahead

​

➠ The results are surprising, even to us!

​

​

​

commons.wikimedia.org/wiki/File:Technology-Adoption-Lifecycle.png

Have web fonts crossed “the chasm”?

What is a web font?

Chrome : Inspect Element : Network : Fonts (web fonts)

e.g., Google Maps Preview is using web fonts for info cards + map labels

Initial web font adoption analysis

​

From 1% adoption to...

http archive analysis overview

Periodic analysis of key web trends, including the adoption rate of web fonts.

​

Since November 2010, analyzing the Alexa Top 1000 top home pages, looking for signs of web fonts.

​

Doesn't provide much detail, such as integrations by web font service, font used, or penetration across the site.

http://httparchive.org/about.php

Web Font Adoption Alexa Top 1000

27%

Percent of the Alexa Top 1000 domains that are using web fonts on home page.

Source: httparchive.org/trends.php?s=Top1000 (October 1st, 2013)

New approaches to analyzing usage

​

in 2013...

fonts.com analysis overview

Analysis of web font adoption across the Alexa Top 1M

​

​

Analysis

• Alexa Top 100, 1K and 1M home pages
• Analyzes web pages (HTML) for integration patterns of each service

​

Sample Size

• Up to 1M home pages

​

Key Features

• Able to accurately determine integration pattern (including highly-optimized ones)

Web Font Adoption Alexa Top 1M

28%

Percent of the Alexa Top 1M domains that are using web fonts on home page

Source: Monotype Inc. analysis of the Alexa Top 1M

Analysis Sample Size Overview

Usage across two home pages

Analysis Sample Size Overview

Alexa Top 1000 - httparchive.org analysis [1K pages]

Alexa Top 1M - fonts.com analysis [1M pages] 1,000X!

The Web - Google Fonts analysis [10B+ pages] 10,000X!

Google Fonts analysis overview

Analysis of web font adoption across the Alexa Top 1M and far beyond

​

Analysis

• Alexa Top 1M and far beyond
• Analyzes rendered web pages
• Chrome + MapReduce + BigQuery

​

Sample Size

• 10B+ web pages
• 100M+ domains

​

Key Features / Limitations

• Generates a queryable database, to enable discovery
• Limited to crawlable public web pages (respects robots.txt), light-weight analysis

​

Conrad Chan’s 2013 summer internship project!

Web Font Adoption Deep Analysis

66% Alexa Top 100 !!

62% Alexa Top 1K

55% Alexa Top 10K

43% Alexa Top 100K

35% Alexa Top 1M

�Percent of the top Alexa domains that are using web fonts on one or more pages.

Source: Google Fonts large-scale web font analysis

Web Font Adoption The Web

1 Billion⁺

Number of pages across the web using web fonts

Source: Google Fonts large-scale web font analysis

Web Font Adoption The Web

35 Million⁺

Number of domains across the web using web fonts on one or more pages

Source: Google Fonts large-scale web font analysis

Interesting adoption stats

​

From across the industry...

Extensis

Adoption stats

• Enterprise implementations are now growing faster than all other segments (3x over SMB segments)
• Pan-European adoption has skyrocketed in the last 12 months (exponential - 5x)
• Demands for responsive design have become a key driver for adoption

​

Observations

• For the last year the market has been approaching the 'chasm', yet suddenly seems to have been launched into 'mid-air' to early adoption
• As adoption increases (esp. across geographies), custom subsetting, delivery speed, and uptime demands are increasing accordingly
• Adoption rates vary dramatically by industry

​

​

fonts.com

Font requests up dramatically over the past two years, with 30%+ increase in the last six months alone

Most viewed video on YouTube

Gangnam Style on YouTube

1,786,874,961 total video views

​

​

Videos vs. Web Fonts

Gangnam Style by PSY on YouTube

1,786,874,961

total video views

​

Open Sans by Steve Matteson on Google Fonts

139,535,440,098

total font views

October 8th, 2013

Web Font Views by Country

Views of Google Fonts by country (Sept 16th)

Flash to Web Fonts? Top 200K

http://httparchive.org/trends.php?s=All

Migration underway from Flash to Web Fonts?

Flash to Web Fonts?

• Accelerated growth due to mobile device explosion
• Potential crossover in April / May 2014?

Projected from historical data

Opportunities Ahead...

Opportunities ahead

Extensis

• Non-English markets are the brightest beacon: Language support is becoming a crucial factor (e.g., Pan-European use skyrocketed 5x in the last 12 months)

​

fonts.com - web font adoption accelerators

• Conversion of graphics in headlines images to web fonts
• Industry wide adoption of a single font file format (WOFF 2.0): streamlined integrations + better compression / lower latency

​

Google Fonts

• Adoption will explode as lingering technology issues (rendering, compression, loading earlier, etc, all in progress) are resolved
• Projecting 10B web pages using web fonts (from across the industry) within 2 years!

​

And the Best Part!

​

Announcing...

Analysis data in BigQuery!

Explore the large-scale web font analysis data with BigQuery (a database in the Cloud). Drill in by domain, integration and more!

​

Sites using “Source Sans Pro” as a web font, with example pages where text usage is greater than 50%!

Available today!

Explore away!

​

Access the data via BigQuery.

​

goo.gl/5HeqYf

Summary

Summary

Rate of adoption in the past three years has been tremendous

​

Web Fonts are now being used across 1B+ web pages

​

Majority of top web sites are experimenting with / using web fonts

​

Future is very bright for entire industry

​

Call to action…

➠ Support initiatives that make the web better

​

Reference

Large-scale web font usage analysis

https://bigquery.cloud.google.com/table/google.com:googlefonts:fonts.analysis

​

httparchive.org (Alexa Top 100, 1K)

http://httparchive.org/trends.php?s=Top1000

​

Alexa Top 1M

http://www.alexa.com/topsites

​