Everything you need to know the <html> element

Everything you need to know the <html> element

ยท

2 min read

The <html> element represents the root element of an HTML document, which is sometimes also referred to as the top-level element. The reason for this is because all other HTML elements must be a descendant of the <html> element.

Let's take a look at the attributes that can be used with this tag.

Attributes

Below are the attributes that can be used on the <html> element. In addition to the below attributes you can also use the global attributes.

Manifest

Specifies the URI of a resource manifest indicating resources that should be cached locally.

Version

Specifies the version of the HTML Document Type Definition that governs the current document.

This attribute is not needed, because it is redundant with the version information in the document type declaration.

xmlns

Specifies the XML Namespace of the document.

The default value is "w3.org/1999/xhtml". This is required in documents parsed with XML parsers, and optional in text/html documents.

Example

Here is an example of the <html> element in use.

<!DOCTYPE html>
<html lang="en">
  <head>...</head>
  <body>...</body>
</html>

Accessibility Concerns

Lang

To help screen reader technology you should provide a lang attribute with a valid IETF identifying language tag on the HTML element. This helps the screen reader determine which language should be used to pronounce the content.

The lang declaration should describe the content used on the majority of the content on the page. For example, if you write in US English you would use the tag: en-us

Without the lang declaration, the screen reader will often default to the OS default which could cause mispronunciations of content.

Including a valid lang declaration on the <html> element ensures that important metadata contained on the page <head> such as the page's <title> is announced properly.

Read More

If you're interested in reading more about this tag, you can check out the MDN Docs on it here.

I hope you found this post helpful, if you did and want to see more content like this please consider following me on Twitter.