Optimizing Fonts and Images

Adding a primary font

Adding the desktop hero image

The <Image> component

Practice: Adding the mobile hero image

Recommended reading

There's a lot more to learn about these topics, including optimizing remote images and using local font files. If you'd like to dive deeper into fonts and images, see:

Image Optimization Docs
Font Optimization Docs
Improving Web Performance with Images (MDN)
Web Fonts (MDN)
How Core Web Vitals Affect SEO