[web-php] PR #752: Add woff2 fonts and other font related tweaks

From: Date: Sat, 28 Jan 2023 09:08:58 +0000
Subject: [web-php] PR #752: Add woff2 fonts and other font related tweaks
Groups: php.webmaster 
Request: Send a blank email to php-webmaster+get-30752@lists.php.net to get a copy of this message
Pull Request: https://github.com/php/web-php/pull/752 Author: javiereguiluz This Pull Request proposes 3 changes related to fonts: **(1)** Add the WOFF2 variant of web fonts. [WOFF2 standard](https://w3c.github.io/woff/woff2/) reduces the file sizes significantly. This is important to make our website more accessible to folks with limited Internet connections. 96% of browsers support WOFF2 ([source](https://caniuse.com/?search=woff2)) and we still have WOFF and TTF/OTF/EOT formats for those edge-cases which don't support it. Real examples of the file size reductions for php.net: ``` Fira Sans Regular: 183 KB (woff) -> 129 KB (woff2) --> 30% reduction in size Fira Mono Regular: 87 KB (woff) -> 65 KB (woff2) --> 35% reduction in size ``` **(2)** Use font-display: swap for web fonts (see [MDN Docs for font-display](https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display)) This is recommended to not block the rendering the page for a long time if the web font is not available. Again, this is important for folks with suboptimal network connections. The swap value is also the default option in popular font services like [Google Fonts](https://fonts.google.com/). **(3)** Update the list of alternative font families. I updated the sans-serif and mono font stack used in the design. The new stacks are much longer (not a problem in practice thanks to CSS variables) but they cover all common browsing devices (including smartphones). I crafted the list from the recommended font stacks of the most popular CSS frameworks and the most popular websites for developers.

« previous php.webmaster (#30752) next »