These font stacks will improve your site performance
74 هزار بار بازدید -
7 ماه پیش
-
Feeling pretty good with your
Feeling pretty good with your CSS and looking to take the next step up in your game? This course might be what you’re after 👉 https://beyondcss.dev/?utm_campaign=g...
Web fonts have made the web a much nicer looking place, but if we don’t put the work in to host them properly and optimize them, they can be heavy files that slow things down and lead to FOITs and FOUTs, which is never great for the user experience.
Luckily, modern font stacks can help a lot with that!
🔗 Links
✅ Modern Font Stacks: https://modernfontstacks.com/
✅ How website performance affects conversion rates: https://www.cloudflare.com/learning/p...
✅ My video on self-hosting Google Fonts: Self-hosting fonts explained (includi...
⌚ Timestamps
00:00 - Introduction
00:30 - The problem(s) with Google Fonts
01:40 - the best font to start with
02:26 - simple font stack for system-ui
03:35 - The “original” system-ui stack
05:00 - Advantages of system-ui
06:09 - Other font stacks that take advantage of system fonts
07:30 - Different fonts across different operating systems is okay
09:35 - Use web fonts where users will actually notice them
#css
--
Come hang out with other dev's in my Discord Community
💬 Discord: discord
Keep up to date with everything I'm up to
✉ https://www.kevinpowell.co/newsletter
Come hang out with me live every Monday on Twitch!
📺 Twitch: kevinpowellcss
---
Help support my channel
👨🎓 Get a course: https://www.kevinpowell.co/courses
👕 Buy a shirt: https://teespring.com/stores/making-t...
💖 Support me on Patreon: Patreon: kevinpowell
---
My editor: VS Code - https://code.visualstudio.com/
---
I'm on some other places on the internet too!
If you'd like a behind the scenes and previews of what's coming up on my YouTube channel, make sure to follow me on Instagram and Twitter.
Twitter: Twitter: KevinJPowell
Codepen: https://codepen.io/kevinpowell/
Github: https://github.com/kevin-powell
---
And whatever you do, don't forget to keep on making your corner of the internet just a little bit more awesome!
Web fonts have made the web a much nicer looking place, but if we don’t put the work in to host them properly and optimize them, they can be heavy files that slow things down and lead to FOITs and FOUTs, which is never great for the user experience.
Luckily, modern font stacks can help a lot with that!
🔗 Links
✅ Modern Font Stacks: https://modernfontstacks.com/
✅ How website performance affects conversion rates: https://www.cloudflare.com/learning/p...
✅ My video on self-hosting Google Fonts: Self-hosting fonts explained (includi...
⌚ Timestamps
00:00 - Introduction
00:30 - The problem(s) with Google Fonts
01:40 - the best font to start with
02:26 - simple font stack for system-ui
03:35 - The “original” system-ui stack
05:00 - Advantages of system-ui
06:09 - Other font stacks that take advantage of system fonts
07:30 - Different fonts across different operating systems is okay
09:35 - Use web fonts where users will actually notice them
#css
--
Come hang out with other dev's in my Discord Community
💬 Discord: discord
Keep up to date with everything I'm up to
✉ https://www.kevinpowell.co/newsletter
Come hang out with me live every Monday on Twitch!
📺 Twitch: kevinpowellcss
---
Help support my channel
👨🎓 Get a course: https://www.kevinpowell.co/courses
👕 Buy a shirt: https://teespring.com/stores/making-t...
💖 Support me on Patreon: Patreon: kevinpowell
---
My editor: VS Code - https://code.visualstudio.com/
---
I'm on some other places on the internet too!
If you'd like a behind the scenes and previews of what's coming up on my YouTube channel, make sure to follow me on Instagram and Twitter.
Twitter: Twitter: KevinJPowell
Codepen: https://codepen.io/kevinpowell/
Github: https://github.com/kevin-powell
---
And whatever you do, don't forget to keep on making your corner of the internet just a little bit more awesome!
7 ماه پیش
در تاریخ 1402/09/21 منتشر شده
است.
74,066
بـار بازدید شده