Recall & Review
beginner
What is font optimization in web development?
Font optimization means making fonts load faster and use less data so websites open quickly and look good on all devices.
Click to reveal answer
beginner
Why should you only load the font styles and characters you need?
Loading only needed font styles and characters reduces file size, which speeds up page loading and saves user data.
Click to reveal answer
intermediate
How does using font-display: swap help with font optimization?
It shows a system font first while the custom font loads, so text appears quickly and avoids blank spaces.
Click to reveal answer
intermediate
What is the benefit of preloading fonts in Astro?
Preloading fonts tells the browser to start loading fonts early, improving how fast text appears styled correctly.
Click to reveal answer
beginner
Name one way Astro helps with font optimization.
Astro can automatically optimize Google Fonts by only loading needed font weights and styles, reducing load time.
Click to reveal answer
What does font optimization mainly improve?
✗ Incorrect
Font optimization focuses on making fonts load faster to improve page speed and user experience.
Which CSS property helps avoid invisible text while fonts load?
✗ Incorrect
font-display: swap shows fallback fonts immediately, avoiding invisible text.
In Astro, what does preloading fonts do?
✗ Incorrect
Preloading fonts tells the browser to load fonts early, speeding up text rendering.
Why avoid loading all font weights and styles?
✗ Incorrect
Loading only needed font weights reduces file size and improves load speed.
Which is NOT a font optimization technique?
✗ Incorrect
Loading all font variants increases load time and is not an optimization.
Explain how font-display: swap improves user experience during font loading.
Think about what the user sees while the custom font is still loading.
You got /3 concepts.
Describe two ways Astro helps optimize fonts on a website.
Consider how Astro manages font loading and file size.
You got /3 concepts.