Modern-day samurai kneeling in traditional armor, sword in hand, against a vibrant wall of multicolored paint splashes — symbolizing the fusion of ancient warrior spirit with contemporary creativity.

Articles tagged with "HTML"

Focusgroup: The Future of Keyboard Navigation

blogA comic-style hero image split in two: on the left, a tired developer, wearing a purple hoodie, is chained by 'JavaScript Logic' and 'Manual Tabbing' logic, struggling with complex code. On the right, a smiling Michaël Vanderheyden with a cap and glasses gives a thumbs-up. Floating beside him, 'focusgroup' automatically handling navigation for 'toolbar', 'tablist', and 'menu' via standard arrow keys.

Chrome and Edge 150 shipped native focusgroup support — an HTML attribute that brings arrow-key navigation to the browser, with automatic ARIA roles and a polyfill available today.

5 min read • 589 words

decoding=async can break multipage view transitions

note

Turns out optimizing for performance can actually harm user experience... Did you know that decoding "async" can break multipage View Transitions? When a view transition is triggered, the browser captures a snapshot of the new page to animate from. If an image is still decoding asynchronously at tha...

href="#" and the Focus Trap

blogA comic-style illustration within a web browser frame shows Michaël Vanderheyden looking confused as a giant diagonal lightning bolt splits the scene. His upper body is shown floating up towards a yellow background box reading "VIEWPORT: SCROLL TO TOP," while his lower body and legs are physically chained to a rusty anchor labeled "keyboard focus trapped in footer" keycap-rubble background

An empty href="#" is valid HTML — but it scrolls the page without moving keyboard focus, silently breaking WCAG 2.4.3. Here's why, and the one-line fix.

7 min read • 791 words

headingoffset Is Coming: How to Prepare Today

blogComic-style illustration of Michaël Vanderheyden giving a thumbs-up while holding the Firefox logo. In the background, a flat screen displays HTML code demonstrating how the new headingoffset attribute dynamically shifts nested heading levels.

With headingoffset starting to land in browsers, learn how to prepare now using polyfills, safe CSS fallbacks, and accessibility-first heading styling.

7 min read • 819 words

Grid Lanes, Subgrid, and No Extra Wrappers

blogComic-style illustration of Michaël Vanderheyden slashing the JavaScript logo with a katana

A narrative walkthrough of how grid lanes, subgrid, and anchor positioning let me remove wrapper-heavy CSS workarounds as a progressive enhancement.

11 min read • 1,321 words

You don’t need JS for that

workshopComic-style illustration of Michaël Vanderheyden slashing the JavaScript logo with a katana

An internal 90-minute Atos workshop where live coding demos showed how modern HTML and CSS can replace heavy JavaScript with better a11y and performance.