HTML

Articles and resources in the HTML category. A full list of categories is also available.

1. The difference between strikethrough and del

   Article posted 14th April 2021 in Development and HTML

   Just like <em> and <i>, and <strong> and <b>, the distinction between <s> and <del> is subtle, but it’s worth knowing.

2. 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.

3. 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.

4. 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!

5. 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.

6. 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!

7. 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.

8. 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.

9. 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.

10. 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.

11. Lazy loading images without JavaScript

    Article posted 3rd July 2020 in Development, HTML and Performance

    Non-JavaScript lazy loading is a great progressive enhancement for image-heavy pages on the web. Just a simple HTML attribute and you’re away!