diff --git a/src/content/en/2024/fonts.md b/src/content/en/2024/fonts.md
index f04433f5094..28e08d2f8bd 100644
--- a/src/content/en/2024/fonts.md
+++ b/src/content/en/2024/fonts.md
@@ -235,53 +235,53 @@ Digging down even further, we can take a look at the individual table sizes used
glyf |
- 76.55% |
- 77.92% |
+ 77% |
+ 78% |
GPOS |
- 6.38% |
- 5.80% |
+ 6% |
+ 6% |
CFF |
- 5.08% |
- 4.44% |
+ 5% |
+ 4% |
hmtx |
- 2.68% |
- 2.63% |
+ 3% |
+ 3% |
post |
- 2.09% |
- 2.18% |
+ 2% |
+ 2% |
name |
- 1.40% |
- 1.33% |
+ 1% |
+ 1% |
cmap |
- 1.36% |
- 1.31% |
+ 1% |
+ 1% |
gvar |
- 1.14% |
- 1.14% |
+ 1% |
+ 1% |
fpgm |
- 1.07% |
- 1.13% |
+ 1% |
+ 1% |
GSUB |
- 0.66% |
- 0.62% |
+ 1% |
+ 1% |
@@ -392,53 +392,53 @@ We think the rise of `block` usage is concerning so we decided to investigate a
Font Awesome |
- 15.49% |
- 16.12% |
+ 15.5% |
+ 16.1% |
ETmodules |
- 1.71% |
- 1.71% |
+ 1.7% |
+ 1.7% |
TablePress |
- 1.12% |
- 1.06% |
+ 1.1% |
+ 1.1% |
icomoon |
- 1.02% |
- 1.05% |
+ 1.0% |
+ 1.1% |
vcpb-plugin-icons |
- 0.77% |
- 0.74% |
+ 0.8% |
+ 0.7% |
fl-icons |
- 0.60% |
- 0.62% |
+ 0.6% |
+ 0.6% |
dm-social-font |
- 0.46% |
- 0.52% |
+ 0.5% |
+ 0.5% |
dm-font |
- 0.46% |
- 0.52% |
+ 0.5% |
+ 0.5% |
dm-social-icons |
0% |
- 0.51% |
+ 0.5% |
dm-common-icons |
0% |
- 0.51% |
+ 0.5% |
@@ -598,53 +598,53 @@ Looking at foundries, the main surprise is the rise of Adobe Fonts as a foundry.
Google Fonts |
- 33.77% |
- 18.50% |
+ 34% |
+ 19% |
Adobe Fonts |
- 14.39% |
- 14.71% |
+ 14% |
+ 15% |
Font Awesome |
- 14.37% |
- 18.86% |
+ 14% |
+ 19% |
Indian Type Foundry |
- 7.21% |
- 9.74% |
+ 7% |
+ 10% |
Łukasz Dziedzic |
- 4.81% |
- 6.38% |
+ 5% |
+ 6% |
Julieta Ulanovsky |
- 4.75% |
- 6.14% |
+ 5% |
+ 6% |
Mark Simonson Studio |
- 2.03% |
- 2.23% |
+ 2% |
+ 2% |
Ascender Corporation |
- 1.75% |
- 2.24% |
+ 2% |
+ 2% |
Paratype |
- 1.64% |
- 2.08% |
+ 2% |
+ 2% |
Linotype |
- 1.46% |
- 1.97% |
+ 1% |
+ 2% |
@@ -858,10 +858,12 @@ To give a sense of where these increases have been most consequential, it helps
{{ figure_markup(
image="writing-systems.png",
caption="Writing systems supported by fonts.",
- description="Bar chart showing the writing systems supported by fonts. Cyrillic is at 13% for both desktop and mobile, Greek is at 8% for desktop and 7.5% for mobile, Emoji are at 1.6% for both desktop and mobile, Katakana is at 1.2% for desktop and 0.95% for mobile, Hiragana is at 1.2% for desktop and 0.95% for mobile, Hebrew is at 1.1% for both desktop and mobile, Hangul is at 0.9% for desktop and 0.5% for mobile, Devanagari is at 0.9% for desktop and 0.8% for mobile, Arabic is at 0.7% for desktop and 1% for mobile, Thai is at 0.5% for both desktop and mobile, finally Han is at 0.35% for desktop and 0.3% for mobile. Omitted the Latin script at 47% for desktop and 46% for mobile to give better insight into the support for other scripts.",
+ description="Bar chart showing the writing systems supported by fonts. Cyrillic is at 13% for both desktop and mobile, Greek is at 8% for desktop and 7.5% for mobile, Emoji are at 1.6% for both desktop and mobile, Katakana is at 1.2% for desktop and 0.9% for mobile, Hiragana is at 1.2% for desktop and 0.95% for mobile, Hebrew is at 1.1% for both desktop and mobile, Hangul is at 0.9% for desktop and 0.5% for mobile, Devanagari is at 0.9% for desktop and 0.8% for mobile, Arabic is at 0.7% for desktop and 1% for mobile, Thai is at 0.5% for both desktop and mobile, finally Han is at 0.4% for desktop and 0.3% for mobile. Omitted the Latin script at 47% for desktop and 46% for mobile to give better insight into the support for other scripts.",
chart_url="https://docs.google.com/spreadsheets/d/e/2PACX-1vTHmcrit1gMzxfZNeFp9LrA4NQSMEh140fapD4CFQ89knpy6LvEKz7VafGaFGlxCAxTdpLZXaVaq8Pg/pubchart?oid=1521239630&format=interactive",
sheets_gid="1749442653",
- sql_file="performance/styles_font_display.sql"
+ sql_file="performance/styles_font_display.sql",
+ width=600,
+ height=486
)
}}
@@ -1240,7 +1242,7 @@ This point is driven home if we take a look at the features used in combination
{{ figure_markup(
image="popular-font-feature-settings-values.png",
caption="Most popular `font-feature-settings` values.",
- description="Bar chart showing the most popular `font-feature-settings` values. The `kern` feature tag is at 2.6% of desktop and mobile pages, the `liga` feature tag is used on 2.35% of desktop pages and 2.25% of mobile pages, the `tnum` feature tag is used on 0.77% of desktop and 0.67% of mobile pages, the `palt` feature tag is used on 0.66% of desktop pages and 0.6% of mobile pages, the `pnum` feature tag is used on 0.41% of desktop pages and 0.39% of mobile pages, the `lnum` feature tag is used at 0.35% of both mobile and desktop pages, and finally the `calt` feature tag is used at 0.2% of desktop pages and 0.17% of mobile pages.",
+ description="Bar chart showing the most popular `font-feature-settings` values. The `kern` feature tag is at 2.6% of desktop and mobile pages, the `liga` feature tag is used on 2.3% of desktop pages and 2.2% of mobile pages, the `tnum` feature tag is used on 0.8% of desktop and 0.7% of mobile pages, the `palt` feature tag is used on 0.7% of desktop pages and 0.6% of mobile pages, the `pnum` feature tag is used on 0.41% of desktop pages and 0.39% of mobile pages, the `lnum` feature tag is used at 0.4% of mobile and 0.3% of desktop pages, and finally the `calt` feature tag is used at 0.2% of both desktop and mobile pages.",
chart_url="https://docs.google.com/spreadsheets/d/e/2PACX-1vTHmcrit1gMzxfZNeFp9LrA4NQSMEh140fapD4CFQ89knpy6LvEKz7VafGaFGlxCAxTdpLZXaVaq8Pg/pubchart?oid=133823749&format=interactive",
sheets_gid="666056788",
sql_file="development/styles_font_feature_settings.sql"
@@ -1283,53 +1285,53 @@ As an aside, usage doesn’t necessarily imply that a web developer chose to use
Noto Sans JP |
- 26.80% |
- 23.37% |
+ 27% |
+ 23% |
Open Sans |
- 15.87% |
- 17.68% |
+ 16% |
+ 18% |
Montserrat |
- 9.01% |
- 10.19% |
+ 9% |
+ 10% |
Noto Sans KR |
- 7.29% |
- 3.79% |
+ 7% |
+ 4% |
Noto Serif JP |
- 4.89% |
- 4.95% |
+ 5% |
+ 5% |
Raleway |
- 3.66% |
- 4.03% |
+ 3% |
+ 4% |
Inter |
- 2.69% |
- 2.81% |
+ 3% |
+ 3% |
Noto Sans TC |
- 2.40% |
- 1.98% |
+ 2% |
+ 2% |
Google Sans 18pt |
- 1.69% |
- 2.31% |
+ 2% |
+ 2% |
Oswald |
- 1.66% |
- 1.90% |
+ 2% |
+ 2% |
@@ -1349,7 +1351,7 @@ Open Sans was the second most popular variable font this year, being found on 16
{{ figure_markup(
image="variable-font-usage-by-service.png",
caption="Popular hosts for serving variable fonts over time.",
- description="Column chart showing hosts for serving variable fonts over time. In 2022 Google Fonts served 97% of all variable fonts, this decreased only slightly in 2023 (96.8%) and dropped to 92% in 2024. In 2022 variable fonts were self-hosted on 2.8% of pages, 3.1% in 2023, and 8% in 2024.",
+ description="Column chart showing hosts for serving variable fonts over time. In 2022 Google Fonts served 97% of all variable fonts, this decreased only slightly in 2023 (97%) and dropped to 92% in 2024. In 2022 variable fonts were self-hosted on 3% of pages, 3% in 2023, and 8% in 2024.",
chart_url="https://docs.google.com/spreadsheets/d/e/2PACX-1vTHmcrit1gMzxfZNeFp9LrA4NQSMEh140fapD4CFQ89knpy6LvEKz7VafGaFGlxCAxTdpLZXaVaq8Pg/pubchart?oid=906487759&format=interactive",
sheets_gid="1090790567",
sql_file="development/fonts_variable_service.sql"
@@ -1361,7 +1363,7 @@ In terms of serving variable fonts, the vast majority of users choose between tw
Like color fonts, variable fonts also have two competing outline formats: the variable extensions of the `glyf` format and Compact Font Format 2 (`CFF2`). The main technical differences between the `glyf` format and `CFF2` are the types of Bézier curves, more automated hinting, and (perhaps most importantly) the companies backing them. `CFF2` is backed by Adobe and `glyf` by all other major contributors to the OpenType specification (Google, Microsoft, and Apple).
{{ figure_markup(
- content="99.4%",
+ content="99%",
caption="Variable fonts using the `glyf` outline format.",
classes="big-number",
sheets_gid="1116222836",
@@ -1537,9 +1539,9 @@ Although emoji offered a major impetus for the initial development and support o
It’s worth noting a point of complexity in the data gathered on color fonts. Our analysis considers a font with a single color glyph a color font. That is a rather broad definition and also includes many fonts which are primarily used for their non-color glyphs. If we remove fonts with only a small percentage of color glyphs from the equation, the use of color font technology looks very different. For example, the top three fonts using `SVG`, 貂明朝 (Ten Mincho), 貂明朝テキスト (Ten Mincho Text), and Source Code Pro make up a combined 41% of `SVG` total usage, while having only a handful of color glyphs. Removing all “color” fonts with less than 5% of their codepoints mapped to color glyphs from the calculation would reduce the share of `SVG` to roughly 5%! While the `COLR` formats also have some fonts with a low percentage of color glyphs, that percentage is much lower at 3-4%, reducing the `COLRv0` share to 25.1% and 7.2% for `COLRv1`. This would make `COLR` the most popular format by far!
{{ figure_markup(
- image="color-font-format-usage.png",
+ image="color-font-formats.png",
caption="Most popular color formats after removing fonts with only a handful of color glyphs.",
- description="Column chart showing color font usage by color format for fonts with more than 5% of color glyphs. The `COLRv0` format is at 25%, the `sbix` format is at 12%, the `COLRv1` format at 7%, the `SVG` format is at 5%, and the `CBDT` format is at 2.5%.",
+ description="Column chart showing color font usage by color format for fonts with more than 5% of color glyphs. The `COLRv0` format is at 25%, the `sbix` format is at 12%, the `COLRv1` format at 7%, the `SVG` format is at 5%, and the `CBDT` format is at 3%.",
chart_url="https://docs.google.com/spreadsheets/d/e/2PACX-1vTHmcrit1gMzxfZNeFp9LrA4NQSMEh140fapD4CFQ89knpy6LvEKz7VafGaFGlxCAxTdpLZXaVaq8Pg/pubchart?oid=892501065&format=interactive",
sheets_gid="463077022",
sql_file="development/fonts_color_format_by_family.sql"
@@ -1577,7 +1579,7 @@ While system font families are not ideal from a design perspective, as universal
{{ figure_markup(
image="generic-family-name-usage.png",
caption="Usage of generic `font-family` names.",
- description="Column chart showing usage of the generic `font-family` names. The `sans-serif` generic family name is used on 89% of desktop and mobile pages, the `monospace` generic family names is used on 65% of desktop pages and 64% of mobile pages, the `serif` generic family name is used on 50% of desktop pages and 51% of mobile pages, the `system-ui` generic family name is used on 7.3% of desktop pages and 7.2% of mobile pages, the `cursive` generic family name is used on 3.4% of desktop pages and 3.5% of mobile pages, the `ui-monospace` generic family name is used on 2.6% of desktop pages and 2.4% of mobile pages, the `ui-sans-serif` generic family name is used on 2.4% of desktop pages and 2.3% of mobile pages.",
+ description="Column chart showing usage of the generic `font-family` names. The `sans-serif` generic family name is used on 89% of desktop and mobile pages, the `monospace` generic family names is used on 65% of desktop pages and 64% of mobile pages, the `serif` generic family name is used on 50% of desktop pages and 51% of mobile pages, the `system-ui` generic family name is used on 7% of desktop pages and 7% of mobile pages, the `cursive` generic family name is used on 3% of both desktop and mobile pages, the `ui-monospace` generic family name is used on 3% of desktop pages and 2% of mobile pages, the `ui-sans-serif` generic family name is used on 2% of both desktop and mobile pages.",
chart_url="https://docs.google.com/spreadsheets/d/e/2PACX-1vTHmcrit1gMzxfZNeFp9LrA4NQSMEh140fapD4CFQ89knpy6LvEKz7VafGaFGlxCAxTdpLZXaVaq8Pg/pubchart?oid=1077237634&format=interactive",
sheets_gid="1543061572",
sql_file="development/styles_family_system.sql"
diff --git a/src/static/images/2024/fonts/color-font-format-usage-over-time.png b/src/static/images/2024/fonts/color-font-format-usage-over-time.png
index ed52d931e48..6ed10323b63 100644
Binary files a/src/static/images/2024/fonts/color-font-format-usage-over-time.png and b/src/static/images/2024/fonts/color-font-format-usage-over-time.png differ
diff --git a/src/static/images/2024/fonts/color-font-format-usage.png b/src/static/images/2024/fonts/color-font-format-usage.png
index eada062f3c5..0dad540cb05 100644
Binary files a/src/static/images/2024/fonts/color-font-format-usage.png and b/src/static/images/2024/fonts/color-font-format-usage.png differ
diff --git a/src/static/images/2024/fonts/color-font-formats.png b/src/static/images/2024/fonts/color-font-formats.png
new file mode 100644
index 00000000000..f8e347030a4
Binary files /dev/null and b/src/static/images/2024/fonts/color-font-formats.png differ
diff --git a/src/static/images/2024/fonts/color-font-usage-over-time.png b/src/static/images/2024/fonts/color-font-usage-over-time.png
index a6de7646df6..c29d1b55b19 100644
Binary files a/src/static/images/2024/fonts/color-font-usage-over-time.png and b/src/static/images/2024/fonts/color-font-usage-over-time.png differ
diff --git a/src/static/images/2024/fonts/font-display-usage.png b/src/static/images/2024/fonts/font-display-usage.png
index 960c5843250..fdf9532619e 100644
Binary files a/src/static/images/2024/fonts/font-display-usage.png and b/src/static/images/2024/fonts/font-display-usage.png differ
diff --git a/src/static/images/2024/fonts/font-outline-formats.png b/src/static/images/2024/fonts/font-outline-formats.png
index 7f3acd6a2af..b15b0fd1358 100644
Binary files a/src/static/images/2024/fonts/font-outline-formats.png and b/src/static/images/2024/fonts/font-outline-formats.png differ
diff --git a/src/static/images/2024/fonts/font-outline-glyf-cff-comparison-compressed.png b/src/static/images/2024/fonts/font-outline-glyf-cff-comparison-compressed.png
index 9dc555cec06..61592865451 100644
Binary files a/src/static/images/2024/fonts/font-outline-glyf-cff-comparison-compressed.png and b/src/static/images/2024/fonts/font-outline-glyf-cff-comparison-compressed.png differ
diff --git a/src/static/images/2024/fonts/font-outline-glyf-cff-comparison.png b/src/static/images/2024/fonts/font-outline-glyf-cff-comparison.png
index 677010f69aa..17222e55c0d 100644
Binary files a/src/static/images/2024/fonts/font-outline-glyf-cff-comparison.png and b/src/static/images/2024/fonts/font-outline-glyf-cff-comparison.png differ
diff --git a/src/static/images/2024/fonts/font-resource-hint-usage.png b/src/static/images/2024/fonts/font-resource-hint-usage.png
index 101cceb3e33..db85019b6ea 100644
Binary files a/src/static/images/2024/fonts/font-resource-hint-usage.png and b/src/static/images/2024/fonts/font-resource-hint-usage.png differ
diff --git a/src/static/images/2024/fonts/font-sizes.png b/src/static/images/2024/fonts/font-sizes.png
index ab8ce37b16f..fb6a3a6449f 100644
Binary files a/src/static/images/2024/fonts/font-sizes.png and b/src/static/images/2024/fonts/font-sizes.png differ
diff --git a/src/static/images/2024/fonts/font-smoothing-usage.png b/src/static/images/2024/fonts/font-smoothing-usage.png
index 0777194892f..6453de4c4eb 100644
Binary files a/src/static/images/2024/fonts/font-smoothing-usage.png and b/src/static/images/2024/fonts/font-smoothing-usage.png differ
diff --git a/src/static/images/2024/fonts/font-variation-axes.png b/src/static/images/2024/fonts/font-variation-axes.png
index 69d82345afd..1b9db772582 100644
Binary files a/src/static/images/2024/fonts/font-variation-axes.png and b/src/static/images/2024/fonts/font-variation-axes.png differ
diff --git a/src/static/images/2024/fonts/generic-family-name-usage.png b/src/static/images/2024/fonts/generic-family-name-usage.png
index 0985f24c646..4c63db3999e 100644
Binary files a/src/static/images/2024/fonts/generic-family-name-usage.png and b/src/static/images/2024/fonts/generic-family-name-usage.png differ
diff --git a/src/static/images/2024/fonts/hosting-type.png b/src/static/images/2024/fonts/hosting-type.png
index cd32dcdaa63..ce71ed785f3 100644
Binary files a/src/static/images/2024/fonts/hosting-type.png and b/src/static/images/2024/fonts/hosting-type.png differ
diff --git a/src/static/images/2024/fonts/nabla-color.png b/src/static/images/2024/fonts/nabla-color.png
index e6ab81e0080..a07fee97d9c 100644
Binary files a/src/static/images/2024/fonts/nabla-color.png and b/src/static/images/2024/fonts/nabla-color.png differ
diff --git a/src/static/images/2024/fonts/opentype-feature-support-fonts.png b/src/static/images/2024/fonts/opentype-feature-support-fonts.png
index a25bb5efeb9..503f7404b60 100644
Binary files a/src/static/images/2024/fonts/opentype-feature-support-fonts.png and b/src/static/images/2024/fonts/opentype-feature-support-fonts.png differ
diff --git a/src/static/images/2024/fonts/opentype-features-low-level-vs-high-level-properties.png b/src/static/images/2024/fonts/opentype-features-low-level-vs-high-level-properties.png
index 2bf36e5c3ec..eab203bbe85 100644
Binary files a/src/static/images/2024/fonts/opentype-features-low-level-vs-high-level-properties.png and b/src/static/images/2024/fonts/opentype-features-low-level-vs-high-level-properties.png differ
diff --git a/src/static/images/2024/fonts/popular-font-feature-settings-values.png b/src/static/images/2024/fonts/popular-font-feature-settings-values.png
index 87b645b80b1..527e9dc4e76 100644
Binary files a/src/static/images/2024/fonts/popular-font-feature-settings-values.png and b/src/static/images/2024/fonts/popular-font-feature-settings-values.png differ
diff --git a/src/static/images/2024/fonts/popular-mime-types-self-hosted.png b/src/static/images/2024/fonts/popular-mime-types-self-hosted.png
index 5442c50ad8a..34ba981dc3d 100644
Binary files a/src/static/images/2024/fonts/popular-mime-types-self-hosted.png and b/src/static/images/2024/fonts/popular-mime-types-self-hosted.png differ
diff --git a/src/static/images/2024/fonts/popular-mime-types.png b/src/static/images/2024/fonts/popular-mime-types.png
index 9e5bf495cd6..6c69ef7c55d 100644
Binary files a/src/static/images/2024/fonts/popular-mime-types.png and b/src/static/images/2024/fonts/popular-mime-types.png differ
diff --git a/src/static/images/2024/fonts/ttf-font-sizes.png b/src/static/images/2024/fonts/ttf-font-sizes.png
index a3b450aeb7f..cc246851dc4 100644
Binary files a/src/static/images/2024/fonts/ttf-font-sizes.png and b/src/static/images/2024/fonts/ttf-font-sizes.png differ
diff --git a/src/static/images/2024/fonts/variable-font-axes.png b/src/static/images/2024/fonts/variable-font-axes.png
index 5348f894b99..4f928b587b0 100644
Binary files a/src/static/images/2024/fonts/variable-font-axes.png and b/src/static/images/2024/fonts/variable-font-axes.png differ
diff --git a/src/static/images/2024/fonts/variable-font-usage-by-service.png b/src/static/images/2024/fonts/variable-font-usage-by-service.png
index 6c684ea8eff..701729e12d8 100644
Binary files a/src/static/images/2024/fonts/variable-font-usage-by-service.png and b/src/static/images/2024/fonts/variable-font-usage-by-service.png differ
diff --git a/src/static/images/2024/fonts/variable-font-usage-over-time.png b/src/static/images/2024/fonts/variable-font-usage-over-time.png
index f8e5b998692..f74007f253b 100644
Binary files a/src/static/images/2024/fonts/variable-font-usage-over-time.png and b/src/static/images/2024/fonts/variable-font-usage-over-time.png differ
diff --git a/src/static/images/2024/fonts/web-font-usage-by-service.png b/src/static/images/2024/fonts/web-font-usage-by-service.png
index 93cf705d2ac..dfc58d25260 100644
Binary files a/src/static/images/2024/fonts/web-font-usage-by-service.png and b/src/static/images/2024/fonts/web-font-usage-by-service.png differ
diff --git a/src/static/images/2024/fonts/webfont-usage.png b/src/static/images/2024/fonts/webfont-usage.png
index 28a353f0c19..a925206a2d9 100644
Binary files a/src/static/images/2024/fonts/webfont-usage.png and b/src/static/images/2024/fonts/webfont-usage.png differ
diff --git a/src/static/images/2024/fonts/woff2-font-sizes-google-vs-self-hosted.png b/src/static/images/2024/fonts/woff2-font-sizes-google-vs-self-hosted.png
index ee6efa35e03..cf341b6d5e7 100644
Binary files a/src/static/images/2024/fonts/woff2-font-sizes-google-vs-self-hosted.png and b/src/static/images/2024/fonts/woff2-font-sizes-google-vs-self-hosted.png differ
diff --git a/src/static/images/2024/fonts/woff2-font-sizes.png b/src/static/images/2024/fonts/woff2-font-sizes.png
index 3ce3bca1907..afa70b4273d 100644
Binary files a/src/static/images/2024/fonts/woff2-font-sizes.png and b/src/static/images/2024/fonts/woff2-font-sizes.png differ
diff --git a/src/static/images/2024/fonts/writing-systems.png b/src/static/images/2024/fonts/writing-systems.png
index 26ba2a06b82..5f503f9d078 100644
Binary files a/src/static/images/2024/fonts/writing-systems.png and b/src/static/images/2024/fonts/writing-systems.png differ