Why semantic HTML beats rebuilding the browser with divs
By
Karl Koch
Summary
A critique of modern web development practices that rebuild native browser functionality poorly using divs and CSS classes instead of leveraging semantic HTML elements like buttons. The article argues that semantic HTML is essential infrastructure that provides behavior, accessibility, keyboard support, and platform adaptation for free, and that treating the visual layer as the source of truth leads to fragile, hard-to-maintain interfaces.
Source
Key quotes
· 4 pulledThe easiest way to make an interface harder to maintain is to rebuild the browser badly.
A div can look like a button... Or it can be a button.
The visual layer is treated as the source of truth, then the behaviour is patched back on afterwards.
Semantic HTML is interface infrastructure: native elements carry behaviour, accessibility, form semantics, keyboard support, and platform adaptation before styling begins.
You might also wanna read
Text-Based Web Browsers: Their Continued Relevance for Accessibility Testing and Semantic HTML
The article discusses the relevance of text-based web browsers in modern web development, emphasizing their importance for testing website a
The Underrated Power of HTML's Description List Element
This article explores the HTML <dl> (description list) element, arguing it is underrated and highly versatile for representing name-value pa
Why an HTML-first approach outperformed heavy SPA frameworks for our website
The article discusses how junior and mid-level developers have become overly reliant on heavy SPA frameworks like React, often defaulting to
The Evolution and Challenges of HTML and the DOM in Modern Web Development
The article discusses the evolving nature of HTML and the DOM, highlighting the increasing complexity and legacy issues within web developme
The Rise of HTML-First Web Development: How htmx and Server-Driven Frameworks Are Changing Front-End Development
The article discusses a significant shift in web development away from heavy Single Page Application (SPA) frameworks like React, Angular, a
Why Using Div Elements Instead of Buttons Harms Web Accessibility
The article argues against using div elements as substitutes for button elements in web development, particularly criticizing developers who

Comments
Sign in to join the conversation.
No comments yet. Be the first.