HTML (Hypertext Markup Language)
How Often Should We Speak About HTML Conformance?
Our field ships erroneous and fantasy HTML, all the time. When we analyze how often we talk about valid HTML, we obtain varying data. Let’s review what’s going on.
#122 · · development, conformance
5 Ways to Reduce HTML File Size on Your Website, Step 0
The journey begins with an unpopular step.
#121 · · development, performance, minimalism, optimization
DeepSeek and HTML
“What is the most minimal valid HTML document?”, DeepSeek-R1 edition.
#120 · · development, minimalism, conformance
Order Force in HTML?
Do you, too, find certain ways of ordering attributes to be more natural than others?
#119 · · development
Testing 10 JavaScript Frameworks on Their HTML Defaults
When you validate the demo and starter projects of popular frameworks like React, Vue, Angular, Svelte, Astro, &c., what do you find? On challenging the idea that JavaScript frameworks could fuel the HTML crisis.
#118 · · development, javascript, frameworks, conformance
HTML Conformance: A Comparison of 6.5 npm Validator Packages (With 1.5 Recommendations)
What do you do if you want to make sure you’re not writing and shipping fantasy HTML, but choose to or have to avoid the web-based W3C HTML validator?
#117 · · development, conformance
What Is HTML Optimization? What Is It Not?
Is HTML optimization as well-defined as we need it to be? A look at what’s out there and an attempt to be clearer.
#116 · · development, quality, optimization
Where Has All the Valid HTML Gone
When we look at the state of HTML… how much of it actually is HTML?
#115 · · development, conformance
HTML/CSS Frameworks, in Their Own Words (by Word Cloud)
Checking in on Bootstrap, Tailwind, Foundation, Bulma, Milligram, Pure, and UIkit.
#114 · · development, css, frameworks
2024: 0.5% of the Global Top 200 Websites Use Valid HTML
The annual HTML conformance analysis, validating 200 home pages of the most popular websites. Despite improvements, there is no signal of commitment to valid output as a quality baseline to benefit end users as well as web development as a profession.
#113 · · development, conformance
The HTML History and Optimization Cheat Sheet
Compare elements and specifications, check on void elements and optional tags.
#112 · · development, optimization
Now Available: “Rote Learning HTML & CSS,” the Most Boring Free Ebook Ever
The book you never thought you wanted. The rough and raw skeleton of HTML and CSS. Elements, attributes, selectors, properties. No explanations, no examples, no context. Not a New York Times bestseller (it’s free).
#111 · · books, development, css, semantics
A Node and Command Line Tool to Find Obsolete HTML
Ever wondered if and where you have obsolete HTML in your code base? Of course, there’s a tool for that.
#110 · · development, conformance
Know the “search” Element
Let’s talk about element #112.
#109 · · development
We Need to Talk More About Conformance, if We Want to Stop Fantasy HTML
Conformant and valid HTML is the exception on websites and in apps, even though valid output is a sign of professional web development. Given how rarely the topic is being discussed these days, we benefit from raising more awareness for HTML conformance and validation.
#108 · · development, conformance
Now Available: Upgrade Your HTML V!
The newest part of the ebook series for HTML craftspeople and minimalists, touching on past, present, and future of the greatest document language ever specified.
#107 · · books, development, minimalism, optimization
Stop Closing Void Elements
Some developers believe in closing all HTML elements. Some have to close all HTML elements. Others don’t believe in doing so, or aren’t forced either way. In Upgrade Your HTML IV, I wrote a little about closing void elements.
#106 · · development
“HTML First” Is Not HTML First
On what is and what isn’t “HTML First.” (It’s not just a hunch: It should start with HTML.)
#105 · · development, conformance, semantics, accessibility
The 9 HTML Elements That Have an Attribute of the Same Name, or: The 9 Attributes That Have an Element of the Same Name
There are nine HTML elements that have an attribute of the same name. You’ll never guess what follows next.
#104 · · development
2023: 0 of the Global Top 100 Websites Use Valid HTML
The latest analysis of HTML and CSS conformance of the most popular websites. The situation is only going to get better once we set higher expectations for the code we ship.
#103 · · development, css, conformance
On the Uniting Power of a Commitment to HTML Conformance
HTML is the language of the Web, there’s a quality standard—expectation—for HTML, but we don’t make use of it, yet if we would, it would come with several advantages, one of them being that it could unite and propel us to master more important challenges, which would be good again for our field and the Web.
#102 · · development, conformance
What Happened to Separation of Concerns in Frontend Development
On a story that began around 2010, and in which web standards make separation of concerns easier—and frameworks make it harder.
#101 · · development, css
The Most Minimal Valid HTML Document
—isn’t that exciting, isn’t even new, but can use repeating in times of conformance neglect and AI-assisted coding.
#100 · · development, minimalism, conformance
HTML Concepts: Kinds of Elements
There are six kinds of elements in HTML: void elements, raw text elements, escapable raw text elements, the template element, foreign elements, and normal elements.
#99 · · development
HTML Concepts: Customized Built-In Elements
HTML allows to define custom elements, elements which enable authors to “build their own fully-featured DOM elements.” One special type of custom element is the customized built-in element—a custom element built on an existing HTML element.
#98 · · development
Conformance and Accessibility
The Web Content Accessibility Guidelines 2.2 are going to obsolete Success Criterion 4.1.1, which had been WCAG’s nod towards conformant HTML output. This is understandable, and it may even be good—to strengthen accessibility as well as conformance.
#97 · · development, conformance, accessibility
Challenge Yourself, Even When It’s Art
The paradox of CSS art may suggest an artist had a free pass for the quality of their code. Or does it? I believe there are three possible answers to this.
#96 · · development, quality, design, art
A Problem With Link Relationships
It’s easy to get excited about link relationships and similar types of metadata. But link relationships are invisible information, and some invisible information is notoriously hard to maintain—especially on things that decay, describing attributes that change.
#95 · · development
Upgrade Your HTML IV
HTML forms the heart of the Web. The beautiful thing is, HTML is easy to learn. Unfortunately, it’s difficult to master. In the Upgrade Your HTML series, I’m taking examples of HTML, discuss these examples, and make them a little better. I’m excited to announce the fourth book of the series.
#94 · · books, development, minimalism, optimization
HTML Concepts: Unstyled Documents
There’s unstyled and there’s fully unstyled. And then there’s also styled “in a manner that is useful for a developer.”
#93 · · development, css
HTML 2022: 20 Additional Observations From Analyzing the Web Almanac Data
After the initial analysis for the HTTP Archive’s 2022 Web Almanac, here are 20 more observations about HTML as it’s being used today. From (no) doctypes to conditional comment zombies to verbose form markup to viewports to javascript: links.
#92 · · development
HTML Concepts: Browsing Contexts
Welcome to another episode of HTML Concepts! Today, browsing contexts—what is that?
#91 · · development
2022: 0 of the Global Top 100 Websites Use Valid HTML
When you looked at the top websites in 2021, you learned that 98% of them included invalid HTML. When you do the same for the Top 100 globally, this year, would things have improved? Updated data, with a look at our field’s inability to produce valid HTML output.
#90 · · development, css, conformance
Minimal Social Markup
Every website and app these days relies on so-called “social markup,” metadata for a richer and prettier display in social media and messaging tools. On the absolute minimum you may need.
#89 · · development, minimalism
HTML Concepts: Focusable Areas
When you hear “focusable area,” what comes to your mind? Anchors and form elements that receive focus when being “tabbed through,” i.e., that are highlighted and that can be interacted with? That’s not a bad description!—but also not a complete one.
#88 · · development
Write HTML, the HTML Way (Not the XHTML Way)
You may not use XHTML (anymore), but when you write HTML, you may be more influenced by XHTML than you think. You are very likely writing HTML, the XHTML way.
#87 · · development, minimalism
The CSS Art Paradox
The fanciest CSS, standing on the shoulders of bloated HTML.
#86 · · development, css, maintainability, design, art
HTML Concepts: Commands and Facets
On what you think they are, and something that what you think they are has.
#85 · · development
On the Peculiarities of Counting the Number of HTML Elements
How many HTML elements are there? What looks like a fairly simple question, isn’t one, because there isn’t one number of HTML elements.
#84 · · development
HTML Concepts: Form Owners
Today in “HTML Concepts”: form owners. It’s not what you are when you put a form on a page. What are form owners? In essence, form elements that so-called form-associated elements are tied to.
#83 · · development
The 6 Ways of Writing HTML (and Their Combinations)
There are 6 general ways of writing HTML: unsystematic, valid, semantic, accessible, required-only, and hyper-optimized. These types make for 19 combinations—the ways we write HTML.
#82 · · development, conformance, semantics, accessibility, minimalism
HTML Concepts: Common Idioms
Welcome to another brief post in the “HTML Concepts” series. Today we’re going to look at common idioms: popular design patterns for which HTML doesn’t have dedicated elements, but makes suggestions.
#81 · · development, semantics
The Little Book of Little Books
The consolidated and updated version of The Little Book of HTML/CSS Frameworks, The Little Book of HTML/CSS Coding Guidelines, and The Little Book of Website Quality Control!
#80 · · books, development, css, frameworks, quality
Making the Web Developer’s Pilgrimage
Have you read the HTML specification? Have you marked highlights, taken notes, and reviewed what you learned? Have you reported issues and made suggestions to the HTML working group, giving back and improving the standard? On our field’s “pilgrimage.”
#79 · · development
Declaring Page Language—and Declaring Changes in Language
Popular screen readers don’t seem to pick up changes in language automatically. We may need a push on screen readers to improve detection of changes in language, and a shift of attention from declaration of page language to marking up changes in language.
#78 · · development, accessibility
Comparing Page Language Declaration Setups in Screen Readers
One best practice in web development is to declare the document language via the lang attribute, on the html start tag. That is useful, but also not the only option. How well are different setups supported in screen readers? A few data points.
#77 · · development, accessibility
HTML Concepts: Indicators for Layout Tables
You use tables for data, and therefore not for layout purposes (as was popular in the past). But how would you recognize a layout table? That’s what we’re looking at today in “HTML Concepts.”
#76 · · development
HTML Concepts: Constraint Validation
When a form element has attributes that define requirements for the element’s value, then these requirements—constraints—are being validated by the user agent. On the validation of constraints, validity states, and a link to CSS.
#75 · · development
CSS: “:has()” and the Lost Paradigm
On the :has() pseudo-class and the forgotten school of ID- and class-less development.
#74 · · development, css, minimalism
The 3-Second Frontend Developer Test
“Do you validate?” Be a frontend developer who ships valid HTML and CSS; hire frontend developers who ship valid HTML and CSS. End the time of unconditionally accepted sloppiness in professional frontend development.
#73 · · development, css, conformance, quality