The Rules of Margin Collapse — Adjacent margins in CSS can sometimes overlap. This is known as ‘margin collapse’, and Josh notes it has a reputation for “being quite dastardly”. This excellent, comprehensive, interactive tutorial dives into everything you need to know about it, covering the eight rules of margin collapse.

Josh W. Comeau

The 'Import on Interaction' Pattern — You know what’s faster than loading lots of front-end code? Not loading it. You can then ‘lazy-load’ non-critical resources when the user needs to actually use them. Addy Osmani digs in deep as to how this can work here.

Addy Osmani

Designing High-Impact Dashboards for BI — Embedded analytics can transform your product, but terrible presentation can get in the way of great data. Design expert Laura Klein shares UI/UX guidelines and tips to improve your application’s dashboards, analytics, and reports.

Logi Analytics sponsor

On Chrome's Goal of Instant Experiences for the Whole Web — Chrome cares about speed and here they share details of their ideas about turning things up to 11 with prefetching and the use of a ‘private prefetch proxy.’

Michael Buettner and Kenji Baheux (Google)

A font-display Setting for Slow Connections — Swap? Fallback? Optional? Which font-display setting should you pick? Let Matt walk you through the considerations.

Matt Hobbs

Bootstrap 5 Beta 1 Released — The journey towards a stable v5 release of this popular framework continues. The biggest new thing here is RTL support.

Mark Otto

At re:Invent Today, Dec. 9, 1pm PT—Nerd Talk with Lew Cirne

New Relic sponsor

Progressively Deliver New Image Formats with CSS and Cloudflare Workers — When your browser makes a request, it can tell the server what types of responses it accepts, including what image formats it supports. Couple this information with a Cloudflare Worker.. and you can dynamically return more modern formats like AVIF or WebP to users and know it’ll work.

James Ross

How To Migrate From WordPress To The Eleventy Static Site Generator — A step-by-step walk through converting a WordPress site into a static site generated from Markdown. (For more like this see our Jamstack newsletter.)

Scott Dawson

Running Lighthouse in GitHub Actions — How to automate Lighthouse audits in your GitHub repository and some of the things to consider to use it efficiently.

Barry Pollard

An Opinionated Guide to Accessibility Testing — Yes, automated tools like Lighthouse are great, but if you want to really understand accessibility, you’ll need to get your hands dirty.

Iain Bean

How to Get Sticky and Full-Bleed Elements to Play Well Together

Silvestar Bistrovic

Using Feature Flags on Static Websites

LaunchDarkly sponsor

Color Theory: A Beginner's Guide for Designers

Neal O'Grady

Why I Love Tailwind — “Why Tailwind is blowing up, why I (the creator of styled-components) love it and how I avoid the downsides of atomic CSS.”

Max Stoiber

FSJam Podcast — A new show featuring conversations about the emerging world of fullstack jamstack apps. Explores the development practices of the frameworks, libraries, and services enabling this new paradigm.

Anthony Campolo and Christopher Burns podcast

Progressive Enhancement and the Modern Web — Thoughts on progressive enhancement in the time of modern frontend frameworks.

Markus Oberlehner

I Browsed Through 100+ Brutalist Sites; Here’s What I Learned

Malavika Doshi

Senior Web Developer (Node/ReactJS) - Remote — Millions get inspired and plan adventures with our apps. To help us make komoot.com the place to go to plan outdoor adventures, we’re looking for a one of a kind Web Developer to join our team.

Komoot

Find Your Next Job Through Vettery — Create a profile on Vettery to connect with hiring managers at startups and Fortune 500 companies. It's free for job-seekers.

Vettery

noUiSlider: Lightweight Range Slider with Full Multi-Touch Support — No dependency. Fits into wherever you need it. Great homepage too. GitHub repo.

Leon Gersen

Tailwind Starter Kit: An Open Source Extension for Tailwind CSS — This library extends Tailwind with 120 fully-coded CSS elements, four sample pages, and 16 dynamic JavaScript components. Homepage is here.

Creative Tim

Decent Patterns: Simple Customizable SVG Patterns Using Single Unicode Characters — Neat idea! Each pattern uses a single character inside of an SVG <text> element, as the basis for what repeats, and you can customize the background and foreground colors for each.

Chris McGrane

SiriWave: The Apple Siri Waveform Replicated in Pure JavaScript — If you need an effect that implies sound is playing or being recorded, perhaps.

Flavio Maria De Stefano

InstaCube — Maps six photos from your (or any public) Instagram feed on to a cube. Some neat CSS 3D animations here too. The related repo is here.

Jorge Moreno

Pure CSS Monument Valley II — A very impressive CSS recreation of the beautiful puzzle game from Ustwo. Note: This doesn’t work as intended in Safari.

Julia Miocene codepen