HTML5 Elements / HyperText Markup Language

The HTML5 elements are well documented but often without any opinion as to how or if they should be used. This is my take on each. I am covering them in roughly the order that I think they should be learned and how likely you are to need to use them. This also allows me to link to this documentation from other skilstak.io content nodes. For the full specification see https://www.w3.org/TR/html52/, which I also happen to have copied locally for reference offline.

💢 I didn’t want to make this guide. I had to. There is so much rampant misinformation out there — much of which is the first to come up in a search. There is no more definitive source than the specification itself. The second most important resource is https://caniuse.com, both of which I frequently link to directly to save you time searching.

“Should I use quotes with attributes in HTML5?”

I say no. If you can get away with leaving them off then why bother typing them out — and don’t give me the lecture on readability, have you seen modern minified HTML5 documents lately?

By the way, single quotes are 100% okay to use. So save your pinkies. Don’t bother typing double quotes every time.

[Specification]

“What is the difference between an element and a tag?”

An element is made up of one or more tags. Most of the elements have both an opening tag and a closing tag. People frequently mix up these terms. When referring to an html “tag”, for example, you are specifically referring to either the opening tag or the closing tag. Most of the time you should refer to the element instead of the tag.

doctype

All you need to know about <!doctype html> is that you should always add it to the first line of any .html document. This proclaim that the rest of the stuff to come is an HTML5 document.

<!doctype html>
...

🛑 Don’t bother learning any other form of this element.

[Specification]

html

Even though the html element is official “optional” in HTML5 you should really add it anyway, if for no other reason than to declare what language your document is written in. There are lots of attributes but really the only one you should consider adding regularly is lang=en.

<!doctype html>
<html lang=en>
...
</html>

[Specification]