HTML Document

HTML Document is a text file containing hypertext markup language, which is interpreted and rendered on the screen by a browser. Various components and concepts are important to understand and keep in mind as you develop web applications. Both web sites and web applications use web pages, or more formally, HTML documents.

HTML5 document structure

Document Root

Each HTML document has a single root element, <html>, and is divided into two sections: <head> and <body>.

Head Section

The purpose of the <head> section is to describe the document itself. The children of head element include <meta> to describe the document, <link> to include stylesheet files and other assets, <styles> to embed styles, <script> to include scripts, and <title> in window tab.

Body Section

The purpose of the <body> section is to organize content for presentation by marking it up with HTML elements. The body element contains all marked up content that is presented to the user.

Document type declaration

Every HTML document we create should declare its document type (doctype).The doctype must appear at the start of the first line of every HTML5 document to ensure the web browser will "render"(display) the document in "Standards Mode" (following the HTML5 specifications). This identifies which specification of HTML is included so the browser knows how to interpret the code. Keep in mind that code examples you find online may contain older outdated or irrelevant approaches.


<!-- The document type declaration tag for all HTML5 documents -->
<!DOCTYPE html>

<!-- 
  HTML5 is not a case-sensitive language — so the document type declaration tag
  may alternatively be written in any combination of uppercase and lowercase characters.  
-->
<!doctype html>
<!Doctype Html>
<!DOCTYPE HTML>

The choice of capitalization is yours. It is recommended that you follow best practices and adhere consistently to the style used by the project or organization.

Code comments

Comments can be added at any point within both the head and body sections between a pair of <!-- and --> tags. Anything that appears between the comment tags is ignored by the browser.

Fundamental structure

<!DOCTYPE html>
<html>
    <head>
        <!-- Data describing the document -->
    </head>
    </body>
        <!-- Data content to appear in the browser -->
    <body>
</html>

Whitespace

Whitespace is any character or series of characters that represent horizontal or vertical space in typography...does not correspond to a visible mark, but typically does occupy an area on a page.

Entities and symbols

Some elements have attributes that are specific to the element. For example, the <ol> element, by default starts with the natural number 1; you can change the starting value with the attribute start and the kind of marker to use with the attribute type. the code <ol start="3" type="a"> will produce a list with the first item numbered "c. First item", instead of the default "1. First item".

Minimal HTML5 document code

The current standard includes the following nine (9) lines of code. If a project's requirements necessitate a deviation from the standard, proper documentation is included to describe and justify the non-compliance. A part of maintenance of a projects includes reviews of the current standards and plans to update (or modify)the code to keep it up to date.


<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Meaningful title</title>
    <meta charset="UTF-8">
  </head>
  <body>
  </body>
<html>