Articles and resources in the HTML category. A full list of categories is also available.
XHTML syntax is still worth using
Article posted 11th May 2022 in Development and HTML
A few weeks ago I read an article on CSS-Tricks about writing HTML the HTML way, not the XHTML way, and it has been bothering me a bit.
Sometimes when it’s false, it’s true
Article posted 6th May 2022 in Development and HTML
Boolean attributes in HTML are quirky, and it’s worth knowing how they work in case you end up setting one value and getting the opposite!
Article posted 15th March 2022 in Accessibility, Apple, CSS and HTML
macOS 12.3 and iOS 15.4 landed yesterday, and with them came Safari 15.4 and some exciting new features. Here are the five that stood out to me.
If HTML and ARIA don’t allow it, it’s probably a bad idea
Article posted 25th October 2021 in Accessibility, Design and HTML
I like to use invalid HTML and ARIA as a design constraint; a line I can’t step across. Sounds obvious, but in practice it’s not always that simple!
Links, missing href attributes, and over-engineered code
Article posted 30th September 2021 in Accessibility, Development and HTML
Links without an
The trouble with back links
Article posted 4th June 2021 in Development and HTML
You’d think that adding a back link to a web page would be straightforward. Well, it turn out that it’s not! Let’s have a look at three ways to do it.
Fixing Safari’s HTML-only Dark Mode bug
Article posted 3rd June 2021 in Accessibility, CSS and HTML
A bug with link text colours in Safari’s HTML-only Dark Mode theme means we need a bit of extra code. Here’s how to patch things until it’s fixed.
HTML-only Dark Mode
Article posted 2nd June 2021 in Accessibility, CSS and HTML
When our CSS contains Dark Mode rules and the file fails to load, we’re left with plain old HTML. Luckily we can request Dark Mode in our markup!
Front of the frontend
Article posted 1st June 2021 in CSS, Development and HTML
Accessible responsive tables
Article posted 28th May 2021 in Accessibility, CSS, Development and HTML
Tables can be tricky to make work responsively; they can also be tricky to make accessible. Here’s a step by step guide to making your tables both!
Be careful with strikethrough
Article posted 20th April 2021 in Accessibility, Development and HTML
Struck-through text isn’t read by screen readers. This is true of all text-level semantics, but it’s worth drawing attention to strikethough.
The difference between strikethrough and del
Article posted 14th April 2021 in Development and HTML
<b>, the distinction between
<del>is subtle, but it’s worth knowing.
When and how to use the section element
Article posted 11th February 2021 in Accessibility and HTML
So what on earth is a
<section>element actually for? The answer isn’t as obvious as you might have hoped, but it’s definitely straightforward.
The right way to use break tags in HTML
Article posted 28th July 2020 in Development and HTML
Break tags are often misused. I’ll demo some markup patterns to avoid them, and reveal the one and only legitimate use case I can think of.
Using address in HTML won’t be problematic for much longer
Article posted 22nd July 2020 in Accessibility, Development and HTML
There’s a bug in Safari that adds an implicit role to
<address>which causes problems for screen readers. The good news is, a fix is very close!
Using horizontal rules in HTML
Article posted 20th July 2020 in Development and HTML
The horizontal rule is pretty widely misunderstood and often abused. It’s not an HTML element I reach for very much, but it’s worth writing about.
How to change the first number of an ordered list in HTML
Article posted 15th July 2020 in Development and HTML
What happens when starting an ordered list at 1 doesn’t make sense? HTML has an attribute that lets you start your count at any number!
Reversing an ordered list in HTML
Article posted 14th July 2020 in Development and HTML
When the order of a list matters, you might find yourself in a situation where you need to reverse the order. Fortunately, you can do that with HTML.
Self-closing elements in HTML
Article posted 10th July 2020 in Development and HTML
Some elements don’t look like the others; those are self-closing elements, which are just an opening tag with no content and no closing tag.
An introduction to HTML attributes
Article posted 9th July 2020 in Development and HTML
An HTML attribute lives on the opening tag of an element and gives that element powers it might not otherwise have had.
Using image aspect ratios to avoiding janky page loading
Article posted 6th July 2020 in Development, HTML and Performance
Adding dimensions to images in HTML is useful again! They’re a progressive enhancement to calculate the image’s aspect ratio and prevent jank.
Article posted 3rd July 2020 in Development, HTML and Performance