The Angle Bracket was a tournament of HTML tags, conducted via 57 Twitter polls in 7 rounds, conducted over a week. Apart from the final, each round consisted of games of 4 tags (because Twitter polls can only have 4 options) in which the first and second place finishers made it to the next round.
In a proper bracket competition everybody is seeded evenly across the competition by how likely they are to win, and you can draw a cute little tree structure as players are eliminated. Unfortunately I didn't think of this in advance, and also I had no idea which tags would or wouldn't be popular, so every round I randomized the winners of the previous round into new games. So you can't draw a tree. I'm sorry. Next time.
Scroll down to read the story of the tournament as it unfolded. You can click or tap any game to see the exact scores.
This was the wild west round; every tag from the HTML 5 spec (uhhhh except
caption because I accidentally left it out).
Less chaotic than round 1, less brutal than round 3, round 2 was a temporary calm before the storm.
Interesting that related tags often leave in the same round --
ins went in round 1, but
legend both made it to round 2 and then got eliminated at the same time, as did all the
h* tags, and
An oldie and a goodie,
blockquote was up against
head in game 3 and there's no shame losing to those heavyweights.
dd were eliminated in round 1, the writing was on the wall for
dl, but I was glad to see people appreciated its value enough to get past round 1. It lost game 7 to
marquee, both of whom went very far indeed.
Look, nobody gives a shit about
main. I have no idea how it managed to beat
iframe in round 1.
A cute little semantic tag,
menu was never going to be a finalist, and it drew
table in game 11.
It was another tough round for the unloved embed category.
Where would podcasts be without the stalwart
audio tag? We're going to find out, because we just got rid of it.
Complex but powerful, picture lets you load images that look good on any device at the cost of a great deal of tedious markup. Your favorite framework's image-optimization feature probably uses this tag, but actual humans are probably just using
After a tough round 1, the remaining tags in the Forms category were pretty strong in round 2.
Clever but only occasionally useful, if your form is so complicated that you need
fieldset, you're probably doing something wrong. With it goes
legend, which even people who use
fieldset seldom use.
Given that the only tag eliminated in the scripting category was
noscript, I think it's arguable to say that no actual scripting tags were eliminated, presaging the strength of web app voters in later rounds.
Almost no section tags got eliminated in round 1, but round 2 was a real winnower for this category.
Honestly kind of weird that the spec considers this a section rather than a block or a text element, but what do I know? Confidently semantic, address was too pure for this world.
A delightfully semantic tag, game 12 had it up against
title and that's a tough game.
h4 were unlucky in round 1 but round 2 decided none of the header tags were essential, not even
h1, which lost to
div (obviously) and
section (surprisingly) in game 5.
Round 2 saw the exits of
table's remaining child tags, leaving it non-functional but a symbolic standard-bearer for at least one more round.
If nobody's using
tfoot, nobody's using
tbody. It only survived because game 7 in round 1 was a very weak match.
table was the last tag standing in the category.
Text tags were once again the weakest category in round 2, with nearly 4 in 5 tags kicked out this round.
Old, solidly semantic but ultimately somewhat unloved, we say goodbye to
u, the tag formerly known as Bold has been retroactively given a new name and a semantic purpose, it is now the comically try-hard Bring Attention To element which, very luckily, means it renders as bold in most browsers. It lost game 11 to
table, which seems fair.
The line break element is still called the line break element, unlike similar older tags which have been renamed. A convenient, get-it-done tool in any developer's toolset, it lost game 9 to
label, a sign of things to come.
A throwback to the early academic origins of HTML, when Tim expected most people would be writing scientific papers and would need to cite each other all the time, this tag still gets a lot of use because people really do cite papers online all the time, in addition to everything else we now use the web for.
The semantic replacements for
b that never fully replaced either, nobody's too broken up about seeing these go.
An adorable, pure-hearted little semantic tag, it was up against
header in game 13, so it was time to go.
If you've looked at the markup of this site you'll know I'm a big fan of
details, but sadly the public was not swayed.
dialog is not supported in the current version of Firefox and Safari is still working on it. I imagine there's an entertaining debate going on inside Mozilla about why they shouldn't support making modals.
area only survived to round 2 by drawing extremely weak opponents in round 1, and with
map already eliminated there was no chance for it.
In round 2 it was sad to see some tags go, but round 3 was where things got truly brutal.
Only 12 tags exited in round 3, so I'm not comparing by category any more, we'll go tag by tag.
They made it to round 3, but lists are gone. In this new pared-down HTML you're gonna have to add bullets to divs.
Accessibility breathes its last as the final tag that attempts to help non-visual browsers falls in game 2 to
All the remaining meta tags fell out in the same round, each in different games. This version of HTML is not for search engines either.
Continuing the pattern of paired elements exiting simultaneously, these semantic stalwarts exited in games 6 and 7.
It outlasted many of its confusingly-similar peers, but no more sections for you. Only divs!
The second-to-last semantic tag is out of the tournament, losing to
script in game 4, but
code is the MVP of this particular website; every single tag is a
The tags that survived to round 4 showed some clear trends:
tablehaving no child elements, you'd be hard pressed to mark up any kind of document.
navis the last tag standing
labelthe last to go
style, another warning sign for CSS as we continue to strip features from the language.
form lost their games in round 3, but to make it an even 4 tags per round they got promoted to round 4 on the basis of being the highest-scored of the losing tags.
Also clear by this point was the groundswell of fan support for
marquee, with dozens of people drawing attention to the tournament specifically to vote for it.
p barely counts as a semantic tag but it was still too semantic for the brutal, bare-bones HTML of round 5, so away it goes.
form losing to
Another tragedy. Now if you want to style stuff you're going to have to do it using
style attributes. Not coincidentally, adding style via attributes is another React idiom.
How dare you. As everyone points out, the
html tag is superfluous, because it's always implied if you leave it out. But still! It's the spiritual root of the whole thing!
html already gone, it was clear
body, another implied tag, wasn't going to make it through this round.
The very last semantic tag is gone. It's just pure functionality now.
Long rendered useless by the absence of all its child tags, table takes its final bow.
Not only did
span lose to
div, it came dead last in game 1. An ignominous fate.
The version of HTML presented by round 5 reveals some uncomfortable truths about ourselves as developers. We threw out accessibility, semantic markup, discoverability, even style sheets. The remaining tags can build a web app -- you've still got
canvas, so quite a fancy web app -- sure, but at what cost? And why the fuck is
marquee still here?
Throwing away half of these tags is going to be a nightmare.
The grand-daddy of the commercial web, the image tag, has been cruelly dispatched. Sure, you can bring in images using style attributes on a
div, but where's the dignity?
The final form elements bite the dust. Good luck capturing any user input, motherfuckers.
The powerful, flexible canvas, its own weird universe of APIs, has a ton of fans, as evidenced by it sticking it out all the way until now. But it didn't make the final 4.
This version of HTML is a nightmare. To do anything vaguely useful you have to resort to horrible hacks, and of course, because web developers are who we are, that's what people started doing at this point in the competition:
The final 4 had been predicted 3 rounds earlier by Howard, and his reward was a donation in his name to Codebar, which he matched with his own funds, because he's a good sport.
The mighty have fallen! A lot of people were worried (or gleeful) that
div was gonna take the whole tournament, but it was not to be, primarily because of the by-now unstoppable force of meme voters piling on to
marquee, especially Danielle Leong
You'd think the ejection of
It all came down to a choice, emblamatic of the times we live in.
In one corner, the a tag. The H in HTML and HTTP, the basis of web 1.0, the thing that makes the web a web. A semantic tag of unmatched simplicity, purity and power, it says "the words in this tag are related to this URL". That relationship is the web.
In the other corner, marquee, a useless remnant of the browser wars of the 90s, propelled to the final round through a combination of nostalgia for a simpler time and simply for the lulz.
Would reality win over memes? It was a very 2021 question.
And that was it. After 57 polls, 7 rounds, and over 76,000 votes cast, we had our champion. To my enormous relief,
a was our victor. It's just not a web without it.
Thanks to everyone who voted, this competition was enormous fun.
Round 1 exits
As you'd expect from a completely randomized tag set, there were some real surprises in this round, but there are also a lot of tags of dubious value and they mostly exited in round 1. I've grouped the results into the categories defined for each tag in the spec.
Because there are so many tags in round 1, per-tag commentary is hidden; you can click or tap any tag to see it.
Block tags: 50% eliminated
Some old favorites drew tough games and were eliminated early;
dtwas robbed, robbed I say.
Originally Definition List,
dlis now technically a Description List. But what it really is is a key-value map in HTML! It's cruelly under-used and I'm sad to see it go.
Used to show some vaguely-defined content that might need a caption to explain what it is. Very niche. Nobody's sad about these.
Originally meant Horizontal Rule, but since that's not even slightly semantic it now means thematic break which is a phrase that I suppose has an h and an r in it somewhere.
A really tough break to be put up against
tablein game 12.
ulwas much luckier and dominated game 21.
A cruel rejection of a faithful workhorse.
preisn't semantic but it's useful, dammit.
Embeds: 70% eliminated
It was a brutal first round for embeds of all kinds; they were the second most-eliminated category of tags.
embedis how Netscape brought in content that was delivered by plug-ins. Nobody uses Netscape anymore, but more surprising is that the entire concept of plugins has essentially vanished. The final holdout, Flash, was end of lifed in January 2021.
This was a shocking result given
iframe's ubiquity across the web, losing to
mainin game 5.
headis obviously a strong tag, but
main? Despite its ubiquity, devs don't love
embedexcept it wasn't written in a hurry in the middle of the night by an overcaffeinated nerd at Netscape. It is similarly unhelpful in the modern, mostly plugin-free web, although people do use it to embed PDFs.
The Netflix tags! They include a passing glance at accessibility in the
tracktag which is routinely ignored.
Forms: 42% eliminated
In a pattern we're going to see repeated several times, all the newer, accessibility-minded stuff got kicked out early. You bastards.
A select with built-in autocomplete! This is so good! But it was up against
blockquotein game 15, tough to beat.
It... shows a little gauge. Honestly, not crying any tears about losing this mysterious little tag.
Who is grouping options in dropdowns? Nobody, that's who.
This is supposed to make sections of your page that change as a result of user input more accessible by making them aria-live but there are some questions as to how useful that really is.
meterbut it's expected to move and... why do we have this?
How DARE you. One of the foundational tags of web apps, cruelly discarded. But it was up against
htmlin game 11 so it had no chance.
Metadata: 30% eliminated
With only a third of the tags in this category eliminated, it was one of the strongest early categories, although it included early warning signs for CSS fans.
Yeah, okay, it's useful to be able to set the base href, but we can all agree it's pretty niche.
A highly controversial result in game 1, round 1!
section, semantic but hardly fundamental, beat
link, the core tag for (amongst other things) pulling in CSS. As we're going to see, CSS had a rough time in this tournament.
Scripting: 40% eliminated
There aren't a lot of scripting tags to begin with, and it turns out only one we really care about.
Powerful as they are, not a lot of people are authoring web components right now, so it was unsurprising to see these exit early.
Sections: 20% eliminated
This was the strongest category in round 1, with passionate fans and a bunch of surprisingly close games.
Highly useful in a semantic sense but also confusingly similar to
articlealso drew a brutal first game against
img, and there's no coming back from that.
In real usage data
h4are far more popular than
h6, which both survived to round 2, so I'm going to say they were unlucky victims of the entirely random seeding of the first round.
Tables: 66% eliminated
I feel like maybe the backlash against table layouts was learned too well; tables are nifty data structures and it was cruel to eviscerate the category in round 1.
I'll be honest, I didn't know these tags existed until I read the spec. They're certainly nifty semantically, and to make styling columns possible, but they're hardly core to the table experience. They don't even hold data!
Be honest, when was the last time you defined a footer for a table? Headers are a lot more useful but, still, hardly essential.
Unlike the other four eliminated in this round, these are the very core of the table experience! Game 23 was controversial, with
prebeating the arguably more useful
td(and even more surprisingly,
tr's loss in game 23 made more sense as it was up against heavyweights
Text: 73% eliminated
The most-eliminated tag category, round 1 saw the immediate exit of a huge number of marginally useful semantic tags, and also some big surprises.
Unless you regularly develop for languages that read right-to-left, you probably haven't used these tags. Internationalization was an early victim of the winnowing process of the tournament.
The purest of purely semantic tags, it's no surprise to see this exit early.
Essentially an inline equivalent of
dt, a very niche tag.
Originally for italics,
iis one of several early non-semantic tags that have been retconned into a different mean. It's now Idiomatic text, which we can all agree is some bullshit.
The distinction between
codeis pretty fine, so no wonder this exited early.
Who uses this, other than search engines? Do they even use it?
The non-block equivalent of
blockquote; apparently browsers enclose the text in ? Neat. Not very useful.
Another victim of our manifest lack of concern for internationalization, all three of the ruby tags exited in round 1.
rptakes my prize for being the most hacky solution to a markup problem I've ever seen, existing solely to hide the parentheses you need to include for your text to make sense in browsers that don't understand the
rtholds the distinction of having the fewest votes of any tag in round 1, being absolutely crushed by
ulin game 21.
The strikethrough element is not really a semantic tag, but it's so useful that it has survived many generations of HTML. Hoever, not useful enough to save it in game 22 against
I understand why
outputare different but I am not sure how many authors are really going to care enough to think about that.
Absolutely not a semantic tag, it nevertheless remains useful to be able to define "small print" as actually being small, so this tag has survived in the spec. But not in the tournament.
Venerable survivors of HTML's academic origins, superscript and subscript aren't really semantic but they're useful as hell. Both drew tough opponents in round 1:
title. No dishonor in defeat to such opponents.
Previously the underline element, an entirely non-semantic but ancient tag,
uis now technically the Unarticulated Annotation element which, surprise, usually renders as an underline without upsetting semantic purists.
An obscure tag with academic origins, nearly useless except to mathematicians,
varscored the second lowest of any tag in round one. Only the deeply unloved
Random other tags
Who the fuck is using these anyway, Google Docs?
summarydidn't make it, its (still useful) parent
detailssurvived! A lovely little combo, you are reading content in a summary/details element pair right this second. It was also a close game:
optionby just 0.1%.
The oldest of old school, the image map, cruelly cut down. Its child
areasurvived, but mostly as a result of being in an extremely weak game 14.