Basic Structure of HTML

#beginners #html #webdev #tutorial

Hyper Text Markup Language(HTML) is in my candid opinion a very straightforward markup language. As a beginner programmer, I can not really boast of having encountered a variety of programming languages (though HTML is a markup language meaning it is rendered by the browser), let's take a look at its structure which literally spells out itself.

The structure of HTML begins with a “document type declaration” which is usually specified first. This tag has no closing tag and is not visible on the web page but it helps to define the document to the browser and the developer as an HTML document. This is then followed by the opening html tag which is stated as it may include a language attribute, to specify language preference, hence it will look like this .

Next up on the basic structure, we will have the Head tag which is stated

. It is within this head tag that the title tag is found, which specifies the name which the developer chooses to attach to the document in the browser, thus it will be in this format page title after which the head tag closes thus . Also found within the head tag is the meta tag which gives information about the HTML document. Not to be outdone in importance, we have the body tag which is the visible part of the HTML document. It includes tags and any visible element that appears on the browser.

The HTML document is then ended by the Html closing tag, to complement the opening html tag which comes after the document declaration.

 <!DOCTYPE html>
    <html lang="en">
      <head>
            <meta charset="UTF-8">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <title>Document</title>
      </head>
      <body>
          <header>
              <img src="gechi.jpg">
              <h1 id="harold">free pik</h1>
              <ul>
                  <li>vectors</li>
                  <li>photos</li>
                  <li>Ai images</li>
                  <li>Icons</li>
                  <li>Videos</li>
                  <li>PSD</li>
                  <li>3D</li>
                  <li>Fonts</li>
                  <li>Categories</li>
              </ul>
          </header>
      </body>
    </html>