checkmark

HTML

Introduction to Web and HTML

How the Web Works What is HTML Why Learn HTML

HTML Basics

HTML Structure and Syntax HTML Tags HTML Elements HTML Attributes Anatomy of an HTML Document Creating Your First HTML Page

HTML Document Structure

Document Type Declaration (<!DOCTYPE>) The `<html>` Element The `<head>` Section The `<meta>` Element The `<title>` Element The `<body>` Element HTML Comments

Text Formatting

Headings (<h1> to <h6>) Paragraphs (`<p>`) Line Breaks (`<br>`) Text Formatting Tags Preformatted Text (`<pre>`)

Lists

Unordered Lists (<ul> and <li>) Ordered Lists (<ol> and <li>) Definition Lists (<dl>, <dt>, and <dd>)

Links

Anchor Tags (<a>) Internal Links in html External Links in html Links to Email Addresses Linking to Other Resources Link Target Attributes Image Links

Images

Inserting Images (<img>) Image Attributes Image Formats (JPEG, PNG, GIF) Image Size and Alignment Image Maps

HTML Forms

HTML Form Structure Text Fields and Textareas Radio Buttons and Checkboxes Dropdowns / Select Box Text, Password, and Email Inputs in HTML Forms Date and Time Inputs in HTML Forms Submit and Reset Buttons Form Elements Attributes Form Validation Grouping Form Elements File Uploads Creating a Contact Form

Tables

Table Structure Table Rows and Columns Table Headers Table Data Table Captions Table Borders and Styling Spanning Rows and Columns

Multimedia

Embedding Audio (<audio>) Embedding Video (<video>) Video Formats (MP4, WebM, Ogg) Multimedia Attributes

HTML5 Sematic Elements

HTML5 Structural Elements Role of Semantic Elements Accessibility and SEO

HTML Entities

Special Characters and Symbols Common HTML Entities
menu Back to Edkool

Document Type Declaration (<!DOCTYPE>)

Document Type Declaration (<!DOCTYPE>)

The Document Type Declaration, commonly referred to as <!DOCTYPE>, is an essential declaration at the beginning of every HTML document. It serves a critical role in specifying the type and version of HTML being used in your document. Understanding and correctly using <!DOCTYPE> is fundamental for ensuring your web pages render correctly across different web browsers. Let's explore its importance:

Defining Document Type

<!DOCTYPE> informs the web browser about the version of HTML in use. With the introduction of HTML5, the declaration is quite simple:

<!DOCTYPE html>

This declaration specifies that the document is written in HTML5. HTML5 is the latest and widely supported version of HTML as of my knowledge cutoff date in September 2021.

Backward and Forward Compatibility

One of the primary purposes of <!DOCTYPE> is to ensure backward compatibility. In other words, it ensures that older web browsers can still interpret and render your web page, even if they don't fully support the latest HTML features. This is achieved by specifying a Document Type Definition (DTD) that defines the rules for parsing the HTML document.

Additionally, <!DOCTYPE> allows for forward compatibility. This means that newer versions of HTML should remain compatible with the specified version. This ensures that your web pages will continue to work as new versions of HTML are released.

Rendering Modes

<!DOCTYPE> also triggers different rendering modes in web browsers. Most modern browsers use a "standards mode" to interpret and display web pages, ensuring consistency with web standards. Without a valid <!DOCTYPE>, browsers may fall back to "quirks mode," which can result in inconsistent rendering.

HTML Validation

Validating your HTML document against the specified <!DOCTYPE> can help identify errors and ensure that your document adheres to the rules of the specified HTML version. Various online HTML validators can assist in checking the validity of your code.

The HTML5 <DOCTYPE>

With the widespread adoption of HTML5, the simple <!DOCTYPE html> declaration is commonly used. This declaration signifies the use of HTML5 and is recognized by modern browsers.

<!DOCTYPE html>
<html>
  <!-- Your HTML content goes here -->
</html>

Remember to place <!DOCTYPE html> at the very beginning of your HTML document, even before the <html> element.

In summary, the <!DOCTYPE> declaration is a fundamental component of an HTML document. It ensures compatibility, specifies the HTML version in use, triggers the appropriate rendering mode, and facilitates validation. By including the correct <!DOCTYPE> in your HTML documents, you lay the foundation for consistent and reliable web page rendering.

Previous Creating Your First HTML Page
Next The `<html>` Element