← Back to All Tags

<html>

Represents document root element

Definition and Usage

The <html> tag represents the root (top-level element) of an HTML document, so it is also referred to as the root element. All other elements must be descendants of this element.

The <html> element is the container for all HTML elements (except for the <!DOCTYPE> declaration) and defines the entire HTML document.

Important: The <html> tag MUST be the root element of every HTML document. There should be exactly one <html> element per page, and it must contain exactly one <head> and one <body> element.
Tip: Always include the lang attribute in the <html> tag to declare the language of the Web page. This is important for search engines and browsers, and helps screen readers pronounce words correctly.

Browser Support

The <html> tag is supported in all major browsers:

Chrome
Chrome
Yes
Firefox
Firefox
Yes
Safari
Safari
Yes
Edge
Edge
Yes
Opera
Opera
Yes

Attributes

The <html> tag supports the following specific attributes:

Attribute Value Description
lang language_code Specifies the language of the document (e.g., "en", "es", "fr")
dir ltr | rtl Specifies the text direction (left-to-right or right-to-left)
xmlns http://www.w3.org/1999/xhtml Specifies the XML namespace (required for XHTML)

The <html> tag also supports all global attributes in HTML.

Examples

Basic HTML Structure

A complete HTML document with the html element:

Example

<!DOCTYPE html>
<html>
<head>
  <title>My Web Page</title>
</head>
<body>
  <h1>Welcome to My Website</h1>
  <p>This is a paragraph of text.</p>
</body>
</html>

HTML with Lang Attribute

Specify the language of the document:

Example

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>English Website</title>
</head>
<body>
  <h1>Hello World</h1>
  <p>This page is in English.</p>
</body>
</html>

HTML with Direction Attribute

Specify text direction for right-to-left languages:

Example

<!DOCTYPE html>
<html lang="ar" dir="rtl">
<head>
  <meta charset="UTF-8">
  <title>موقع عربي</title>
</head>
<body>
  <h1>مرحبا بكم</h1>
  <p>هذه صفحة باللغة العربية.</p>
</body>
</html>

XHTML with Namespace

XHTML document with xmlns attribute:

Example

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
  <title>XHTML Document</title>
</head>
<body>
  <h1>XHTML Page</h1>
  <p>This is an XHTML document.</p>
</body>
</html>

Complete Modern HTML Document

A complete, modern HTML5 document structure:

Example

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="description" content="Page description">
  <title>Modern Web Page</title>
  <link rel="stylesheet" href="styles.css">
</head>
<body>
  <header>
    <h1>Website Header</h1>
    <nav>
      <ul>
        <li><a href="#home">Home</a></li>
        <li><a href="#about">About</a></li>
        <li><a href="#contact">Contact</a></li>
      </ul>
    </nav>
  </header>

  <main>
    <article>
      <h2>Article Title</h2>
      <p>Article content goes here.</p>
    </article>
  </main>

  <footer>
    <p>© 2024 My Website</p>
  </footer>

  <script src="script.js"></script>
</body>
</html>

Document Structure

Every HTML document follows this basic structure:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Page Title</title>
</head>
<body>
</body>
</html>
  • <html>: Root element containing everything except DOCTYPE
  • <head>: Contains metadata, title, links to styles and scripts
  • <body>: Contains all visible page content

Importance of Lang Attribute

The lang attribute is crucial for accessibility and SEO:

  • Screen Readers: Helps screen readers pronounce words correctly in the specified language
  • Search Engines: Assists search engines in understanding content language for better indexing
  • Translation Tools: Enables browsers to offer translation services
  • Text-to-Speech: Ensures proper pronunciation and accent
  • Spell Checkers: Helps browsers select appropriate dictionaries
  • Quotation Marks: Different languages use different quotation marks; lang helps style them correctly

Common Language Codes

Language Code Example
English en <html lang="en">
Spanish es <html lang="es">
French fr <html lang="fr">
German de <html lang="de">
Chinese (Simplified) zh-CN <html lang="zh-CN">
Arabic ar <html lang="ar" dir="rtl">

HTML vs XHTML

HTML5

  • More lenient syntax
  • No xmlns required
  • Self-closing tags optional
  • Attributes can be unquoted
  • Standard for modern web
<html lang="en">

XHTML

  • Strict XML syntax
  • xmlns required
  • All tags must close
  • Attributes must be quoted
  • Rarely used today
<html xmlns="..." lang="en">

Best Practices

DO:
  • Always include the <html> tag as the root element
  • Always specify the lang attribute
  • Use lang="en" for English content (or appropriate language code)
  • Include exactly one <head> and one <body> inside <html>
  • Place <!DOCTYPE html> before the <html> tag
  • Use dir="rtl" for right-to-left languages (Arabic, Hebrew)
  • Keep the <html> tag simple and clean
DON'T:
  • Omit the <html> tag (while technically optional, it's best practice to include it)
  • Forget the lang attribute
  • Use multiple <html> elements
  • Place content directly in <html> outside of <head> or <body>
  • Add styling or classes to the <html> tag unless necessary
  • Use xmlns in HTML5 (only needed for XHTML)

Accessibility Considerations

  • Lang Attribute Required: Always specify language to help screen readers
  • Text Direction: Use dir attribute for RTL languages
  • Consistent Structure: Proper html/head/body structure aids assistive technology
  • Language Changes: Use lang on specific elements when language changes within a page
  • Valid HTML: Proper structure starting with <html> ensures compatibility
Accessibility Tip: The lang attribute on the <html> tag is one of the most important accessibility features. It should be included on every single HTML page.

Related Tags