HTML5 Cheatsheet

This site is a reference for HTML.

Last updated on 14 June, 2021 at 09:50:16 Optimized for

HTML is a markup language used for webpages; it is the original language for designing webpages and can be (and most often is) assisted by technologies such as CSS (Cascading Style Sheets) and Javascript. It was initially released in 1993.

Website logo
For the full experience we recommend viewing this website on a desktop or tablet.


The most basic tags

These are the most essential tags.

Tag Description

Defines the document type


Defines an HTML document


Contains metadata/information for the document


Defines a title for the document


Defines the document's body


Defines a paragraph

<h1> ... <h6>

Defines hiearchial headings; first heading should always be h1!


Inserts a single line break


Horizontal ruler. Basically a horizontal border

<!--your text-->

This is how you make a comment


Formatting of text.

Semantic tags for defining the text-elements. Good to know.

Tag Description

Defines an abbreviation or an acronym


Defines contact information for the author/owner of a document/article


Defines bold text


Isolates a part of text that might be formatted in a different direction from other text outside it


Overrides the current text direction


Defines a section that is quoted from another source


Defines the title of a work


Defines a piece of computer code


Defines text that has been deleted from a document


Specifies a term that is going to be defined within the content


Defines emphasized text


Defines a part of text in italics


Defines a text that has been inserted into a document


Defines keyboard input


Defines marked/highlighted text


Defines a scalar measurement within a known range (a gauge)


Defines preformatted text


Represents the progress of a task


Defines a short quotation


Defines what to show in browsers that do not support ruby annotations (see ruby tag, for what ruby is)


Defines an explanation/pronunciation of characters (for East Asian typography)


Defines a ruby annotation. Ruby annotations are used for East Asian typography


Defines a strikethrough text; used for marking something that is no longer correct


Defines sample output from a computer program


Defines smaller-sized text for e.g. form-names laid above an input field


Defines important text


Defines subscripted text


Defines superscripted text


Defines a container for content that should be hidden when the page loads


Defines a specific time (or datetime)


Defines some text that is unarticulated and styled differently from normal text


Defines a variable


Defines a possible line-break

Forms and Input

Form and Input tags

These elements are crucial in HTML

Tag Description

Defines an HTML form for user input


Defines an input control


Defines a multiline input control (text area)


Defines a clickable button


Defines a drop-down list


Defines a group of related options in a drop-down list


Defines an option in a drop-down list


Defines a label for an <input> element


Groups related elements in a form


Defines a caption for a <fieldset> element


Specifies a list of pre-defined options for input controls


Defines the result of a calculation


How to Embed iFrame in HTML

Artefact from previous HTML standards. Lets you embed a webpage inside another webpage.

Tag Description

Defines an inline frame


Handling Graphics with HTML

This is more than mere images - some of these tags are very powerful and useful

Tag Description

Defines an image


Defines a client-side image map


Defines an area inside an image map


Used to draw graphics, on the fly, via scripting (usually JavaScript)


Defines a caption for a >figure< element


Specifies self-contained content


Defines a container for multiple image resources


Defines a container for SVG graphics


Media in HTML

Properly very niche

Tag Description

Defines sound content


Defines multiple media resources for media elements (<video>, <audio> and <picture>)


Defines a video or movie


Defines text tracks for media elements (<video> and <audio>)

How to make hyperlinks in HTML

Crucial part of HTML is linking pages

Tag Description

Defines a hyperlink


Defines the relationship between a document and an external resource (most used to link to style sheets)


Defines navigation links


How to use lists in HTML

Very essential aspect of HTML is the use of ordered and unordered lists. In many CSS frameworks lists are used for menus.

Tag Description

Defines an unordered list. You use <li> elements inside


Defines an ordered list. You use <li> elements inside


Defines a list item. Must be encapsulated by <ul> or <ol> tags


Defines a description list


Defines a term/name in a description list


Defines a description of a term/name in a description list


How to make tables in HTML

Tag Description

Defines a table


Defines a table caption


Defines a header cell in a table


Defines a row in a table


Defines a cell in a table


Groups the header content in a table


Groups the body content in a table


Groups the footer content in a table


Specifies column properties for each column within a <colgroup> element


Specifies a group of one or more columns in a table for formatting

Styles and Semantics

Semantics of HTML

Not so important as it used to be; grasping the essential structure however is beneficient.

Tag Description

Defines style information for a document


Defines a section in a document. Used as a de-facto container for any type of content by adding CSS class names to the tag and encapsulating other elements


Defines an inline-section in a document


Defines a header for a document or section


Defines a footer for a document or section


Specifies the main content of a document


Defines a section in a document


Defines an article


Defines content aside from the page content


Defines additional details that the user can view or hide


Defines a dialog box or window


Defines a visible heading for a <details> element


Adds a machine-readable translation of a given content

Meta Info

Meta Tags and Information in HTML

Tag Description

Defines information about the document


Defines metadata about an HTML document


Specifies the base URL/target for all relative URLs in a document


The us of Objects and Scripts for Programming in HTML

Tag Description

Defines a client-side script


Defines an alternate content for users that do not support client-side scripts


Defines a container for an external (non-HTML) application


Defines an embedded object


Defines a parameter for an object

Online Resources & Books