As a web font loads, you can now adjust its scale, to normalize the document font sizes and prevent layout shift when switching between fonts Jun 9, 2021• Updated Jun 9, 2021 Consider the following demo where the font-size is a consistent 64px, and the only difference between each of these headers is the font-family. Read More

Optimize web fonts for Core Web Vitals. Jun 3, 2021 This article discusses performance best practices for fonts. There are a variety of ways in which web fonts impact performance: Delayed text rendering: If a web font has not loaded, browsers typically delay text rendering. In many situations, this delays First Contentful Paint (FCP). In Read More

A foundational overview of how to establish a dynamic and configurable color scheme Jun 9, 2021 In this post I want to share thinking on ways to manage multiple color schemes in CSS. Try the demo. Demo If you prefer video, here’s a YouTube version of this post: Overview # We’ll build an accessible color Read More

This article will help you understand how Core Web Vitals correlate with key business metrics by exploring examples of companies which have already see positive impact for their users and business. May 18, 2021 Are you struggling to convince your stakeholders to adopt Core Web Vitals? Or are you wondering if it actually helps your Read More

CSS-related techniques for optimizing Web Vitals Jun 2, 2021 The way you write your styles and build layouts can have a major impact on Core Web Vitals. This is particularly true for Cumulative Layout Shift (CLS) and Largest Contentful Paint (LCP). This article covers CSS-related techniques for optimizing Web Vitals. These optimizations are broken down Read More

Learn how to send Web Vitals data to Google Analytics 4 properties and export the data for analysis in BigQuery and Data Studio. May 18, 2021• Updated May 18, 2021 Google provides a number of tools—Search Console, PageSpeed Insights (PSI), and the Chrome User Experience Report (CrUX)—that let developers see how their sites perform against Read More

These seemingly small additions to CSS selector syntax are going to have a big impact. May 27, 2021• Updated May 27, 2021 When writing CSS, you can sometimes end up with long selector lists to target multiple elements with the same style rules. For example, if you want to color adjust any tags found inside Read More

Finding opportunities to improve user-experience with Chrome’s web tooling. May 11, 2021 Today, we’ll cover new tooling features in Lighthouse, PageSpeed and DevTools to help identify how your site can improve on the Web Vitals. As a refresher on the tools, Lighthouse is an open-source, automated tool for improving the quality of web pages. You Read More

Controlling macro and micro layout in a new era of responsive web design. May 19, 2021• Updated May 26, 2021 Responsive Design Today # Today, when using the term: “responsive design”, you are most likely thinking about using media queries to change layout when resizing a design from mobile size, to tablet size, through to Read More

Before optimizing third party tags, make sure that these scripts are still needed on your site. Apr 22, 2021 Third-party scripts, or “tags” can be a source of performance problems on your site, and therefore a target for optimization. However, before you start optimizing the tags you have added, make sure that you are not Read More

1 2 3 4 8