The five best design links, every weekday

Domain: web.dev

web.dev

New CSS functional pseudo-class selectors :is() and :where()

These seemingly small additions to CSS selector syntax are going to have a big impact.

web.dev

Best practices for fonts

Learn about how to optimize web fonts for Core Web Vitals.

web.dev

CSS for Web Vitals

This article covers CSS-related techniques for optimizing Web Vitals.

web.dev

Learn CSS

An evergreen CSS course and reference to level up your web styling expertise.

web.dev

Best practices for cookie notices

Learn about how cookie notices affect performance, performance measurement, and UX.

web.dev

Compat2021: Eliminating five top compatibility pain points on the web

Google is working to fix the top five browser compatibility pain points for web developers.

web.dev

Building a Tabs component

A foundational overview of how to build a tabs component similar to those found in iOS and Android apps.

web.dev

Centering in CSS

Follow 5 centering techniques as they go through a series of tests to see which one is the most resilient to change.

web.dev

Logical layout enhancements with flow-relative shorthands

New logical property shorthands and new inset properties for Chromium.

web.dev

min(), max(), and clamp(): three logical CSS functions to use today

Min, max, and clamp provide some powerful CSS capabilities that enable more responsive styling with fewer liens of code.

web.dev

How to use CSS clipping

Using clipping in CSS can help us move away from everything in our designs looking like a box.

web.dev

How to use CSS masking

CSS masking gives you the option of using an image as a mask layer.

web.dev

Custom bullets with CSS ::marker

It is now trivial to customize the color, size or type of number or bullet when using a <ul> or <ol>.

web.dev

content-visibility: the new CSS property that boosts your rendering performance

The CSS content-visibility property enables web content rendering performance benefits by skipping rendering of off-screen content.

web.dev

@property: giving superpowers to CSS variables

Learn how to implement CSS custom properties with semantic typing, a fallback value, and more, directly in your CSS file.

web.dev

Optimize Cumulative Layout Shift

Learn how to avoid sudden layout shifts to improve user-experience.

web.dev

Web Dev Metrics

User-centric performance metrics are a critical tool in understanding and improving the experience of your site in a way that benefits real users.

web.dev

Largest Contentful Paint

Making it easier to know when a page's important content has loaded.

web.dev

Native lazy-loading for the web

Browser-level native lazy-loading is finally here!

web.dev

The Layout Instability API

This post introduces the Layout Instability API, its key concepts, and explains how to use the API and provide feedback