Blinded by the Light DOM

Let’s grasp and work with Light-DOM web components.

Chrome 120 beta

CSS masking, relaxed CSS nesting, and more.

The state of HTML

“HTML has become more of an output format like PDF.”

Totally remdom

How desktop and mobile browsers zoom rem/px-based text.

Google abandons Web Integrity API proposal

After a backlash, Google is no longer pursuing its plan.

How to release a side project as a real product

Build a reputation, earn extra income, or start a business.

A change to the default durability mode in IndexedDB

The mode goes from ‘relaxed’ to ‘strict’ from Chrome 121.

Smolsite

How to make a website that is contained in its URL.

A glossary of web accessibility terms

Accessibility jargon and acronyms briefly explained.

An accessibility bookmarklet for testing 200% text size

Check how well a webpage handles text resizing.

Confusing Git terminology

A compilation of Git’s most weird terms with explanations.

What exactly is “modern CSS”?

And when is “modern CSS” not so modern anymore?

Workarounds for buggy gradients

What to do if you run into some weird gradient behavior.

Why you should use px units for spacing techniques

The drawbacks of using relative units for margin, padding, and the like.

How can we keep domains working long after our death?

Let’s find an option to tackle the challenging issue.

Removing CSS list styles without affecting semantic

A new way to deal with a special list behavior of Safari.

Surprising facts about the new CSS selectors

These selectors might trick you; use them with care.

What the QWAC?!

What to expect from the Qualified Website Authentication Certificate.

Introducing Angular v17

Angular gets a new look and a set of forward-thinking features.

Stop saying ‘best practice’

Tell what you’re practicing; ‘best practice’ is unspecific.

New security headers grading criteria

Security Headers, the security scanning tool, gets an update.

Using CSS to boost your rendering performance

CSS ‘content-visibility’ can speed up your page’s initial load.

How Core Web Vitals saved users 10,000 years of waiting

Today, over 40% of sites pass all of Google’s UX metrics.

What’s new in DevTools (Chrome 120)

Third-party cookie phaseout, improved animation debugging, and more.

CSS nesting relaxed syntax update

What has changed in the spec and from Chrome 120.

A faster web in 2024

The current state of web performance (metrics).

“Use ChatGPT for RegEx stuff. Nobody understands how this works anyway.”

HTML web components

“It feels like web components are having a moment right now.”

Monaspace

An innovative family of monospace fonts for code.

SVG ViewBox

How the SVG ViewBox works; a creative coding lesson.

Lost in translation

Some practical tips for multilingual web accessibility.

(Don’t) mind the gap

“The CSS Flexbox ‘gap’ property is pretty cool.”

Cracking a ‘DevTools killer’ script…

Developers can go far to hinder you from code inspection.

HTML Web Components

“On the web, augmentation wins in the long run.”

Step into the light (DOM)

Simple Web Components with just the regular old DOM.

Troubleshooting Edge (or Chrome) browser crashes

How to explore the causes of browser and renderer crashes.

Understanding and applying HTML landmarks

How to translate visual information into HTML landmarks.

Interactive image gallery with HTML and CSS

A unique design crafted with the latest CSS features.

Why doesn’t AI work for producing accessible code?

The challenge of making AI-generated code accessible.

The CSS ‘scripting’ media feature

Detect whether scripting languages, such as JavaScript, are supported.

HTML Web Components: an example

There are Web Components that run before JavaScript.

Be excited for new features

“Resignation regarding new browser features is outdated.”

HTML Web Components are just JavaScript?

What to expect from the fresh take on Web Components.

The web can do what!?

A showcase of the incredible capabilities of the modern web.

Should AVIF be the dominant image format on the web?

The answer is familiar but uncomfortable: it depends.

An attempted taxonomy of Web Components

Lessons learned from building open-source Web Components.

Getting started with CSS Container Queries

What they are and where they may replace Media Queries.

Request additional migration time

Google now offers a third-party cookie deprecation trial.

Thoughts on framework churn

Lessons learned from using modern web frameworks.

Managing remotely hosted variable fonts

With great power comes great responsibility.

The State of Developer Ecosystem in 2023

Insights into developers’ technologies, lifestyles, and interests.

An interactive guide to CSS Grid

CSS Grid may be more complex than you think.

Accessibility testing with Chrome DevTools

A handy way to explore accessibility issues right in the browser.

CSS Nesting

An in-depth guide with many use cases and examples.

Width and height in CSS

They may not work quite the way you think.

Example of an HTML Web Component

An HTML ‘select’ with progressively enhanced interactivity.

Why is IPv6 adoption slow?

A walk through the possible causes and potential solutions.

PHP 8.3 released

Typing of class constants, deep-cloning of readonly properties, and more.

Old school web techniques best forgotten

When a dancing baby GIF was cutting edge.

“Folks, you may find it hard to believe, but the reality is: the vast majority of the web runs on PHP, MySQL, and jQuery.”

Git branches: intuition and reality

Are you confused about how Git branches work? Read on.

CSS4 is coming (not a clickbait)

We were told that it would never happen, but it will.

A few ways CSS is easier to write in 2023

What’s possible today that wasn’t one year ago.

How to use responsive HTML video (...and audio)

HTML video/audio can be delivered using media queries again.

The ‘hanging-punctuation property’ in CSS

How to build a blockquote that starts with a curly-quote.

Web Components eliminate JavaScript framework lock-in

They can deliver a uniform interface across frameworks.

CSS oklch() retains perceived lightness for different hue angles

It’s time to switch from hsl() to oklch() for color palettes.

How to use Chrome’s accessibility tree

Debug issues and check custom widgets for accessibility.

“SVG filters are some of the most underrated front-end tech. They are ridiculously powerful.”

Keyboard accessibility myths and WCAG

A key aspect of web accessibility is often misunderstood.

Introducing Amazon Q

Amazon launches a generative AI-powered work assistant.

Oh no, overflow!

Mastering CSS overflows in layouts and with scrollbars.

Off The Main Thread Podcast

Two code ninjas discuss the latest around web development.

HTMHell Advent Calendar 2023

24 articles in 24 days, mainly on front-end development.

Detecting when a Web Component is loaded with CSS

Easily hide a required JS component until instantiated.

JavaScript console methods

“You might discover methods that you didn’t know existed.”

Announcing Deno Cron

The widely-used JavaScript runtime simplifies cron job setup.

CSS Hooks

Inline styles doing what we thought they couldn’t.

A year working with HTML Web Components

How they could shape the future of web development.

Better floats, :has(), color-mix(), and more

Servo, the evolving browser engine, is steadily improving.

The UX of HTML

Let’s talk about ‘HTML UX’ instead of ‘semantic HTML!’

Advent of Code 2023

An Advent calendar of small programming puzzles.

The new best way to run a LLM on your computer

What to expect from Mozilla’s Llamafile (think your own ChatGPT).

Web Performance Calendar 2023

The yearly publication about everything web performance.

Web development advent calendars for 2023

This year’s advent calendars covering web-related topics.

Weird HTML hacks

Workarounds got our web pages through rocky times.

CSS Relative colors

Where the new CSS feature comes in handy.

You don’t need JavaScript for that

Some cool examples to challenge your assumptions.

CSS Media Query for scripting support

“A pretty great feature for progressive enhancement.”

Unrot (that) link

A new service counteracts link rot on aging websites.

HTML, the programming language

It’s based on HTML, the markup language.

Let’s learn how modern JavaScript frameworks work

Building one is the path to comprehension.

Baseline’s evolution on MDN

MDN has enhanced its browser support widget.

Enhanced Web of Things connects diverse IoT ecosystems

New W3C recommendations expand the scope of WoT.

Astro 4.0

New APIs, new dev toolbar, faster builds, redesigned docs.

Web performance tools should report carbon emissions

Why we better embrace progress over perfection.

Security headers using the HTML ‘meta’ tag

Benefits and limits of declarative HTML security headers.

Making SVG loading spinners

An interactive guide illustrating how to craft them.

Introducing JetBrains AI and the in-IDE AI assistant

JetBrains has released its long-awaited AI Assistant publicly.

sizes="auto" pretty much requires width and height attributes

What’s odd about the new auto-sizes for lazy-loaded images.