Mask-group

Essential Html Syntax

Essential Html Syntax



To understand HTML we must first understand its syntax. HTML is a markup language that has a very well-defined structure and syntax. All HTML documents must follow a formal structure.

The World Wide Web Consortium (W3C) is the primary organization that attempts to standardize HTML. The W3C has defined HTML as an application of the Standard Generalized Markup Language (SGML).

In short, SGML is a language used to define other languages by specifying the allowed document structure in the form of a document type definition (DTD), which indicates the syntax that can be used for the various elements of a language such as HTML.

Let's take a look at how a basic HTML syntax looks like:

<!DOCTYPE html>

<html>

<head>

<title> HTML BASIC SYNTAX</title>

</head>

<body>

<p> This article represents the basic HTML syntax.</p>

</body>

</html>

By using this HTML code the output that we receive is:

Here in the code we can observe that multiple tags are used such as:

  • <!DOCTYPE>
    The DOCTYPE tag must be placed at the beginning of any given HTML document. The DOCTYPE tag ensures that the browser knows what version of HTML is being used in the HTML document. 

  • <html>
    Is the root element and it defines the whole HTML document. It has a start tag <html> and an end tag that must be placed right below the <!DOCTYPE html> tag.

NOTE: Please note that the <!DOCTYPE html> tag is a self closing tag and does not need us to place an ending tag for it. Whereas tags like <html>, <title>, <head> need to be manually closed by placing closing tags like </html>,</title>,</head>.

  • <head>
    The < head > element contains the meta description or the meta information regarding the HTML page.

  • <title>
    The <title> element specifies a title for the HTML page (which is shown in the browser's title bar or in the page's tab)

  • <body>
    The <body> element contains the document's body, and includes all the content that is visible on the web page, such as headings, paragraphs, images, hyperlinks, tables, lists, etc.

  • <h1>
    The <h1> element ensures that the text wrapped between is portrayed in the form of a large heading.

  • <p>
    The <p> element is used to create a paragraph.

All the above tags ensure that the HTML document has a proper structure and is easy to read by both the user as well as the computer. HTML has a wide range of tags that we shall look at in the upcoming articles.