LPR - Learn HTML

"HTML (HyperText Markup Language) is the most basic building block of the Web. It defines the meaning and structure of web content."
MDN web docs

Think of HTML as the internal structure, like the iron girders in a building or the skeletal structure of the human body. It not only holds and shapes the entire structure, but without it the thing itself would not exist or just be a formless mass.

It was invented by Tim Berners-Lee in 1993 based on using metatags to describe data, and with it a set of internal rules that will effect how it will be displayed in a browser. <p>This would describe a paragraph.</p> The line above would describe a paragraph, or body of text, with an opening and closing pair 'p' tags.

Topics

Basic Structure

All HTML pages have a basic structure which consists of delcarative item as the very first line called DOCTYPE declaration followed by an all encompassing html tag which contains the two main tags of head and body which in turn hold everything else on a webpage.

<!DOCTYPE html>             
<html>
   <head>
     <title>...</title>
   </head>
   <body>
      ... generic webpage structure
   </body>
</html>

DOCTYPE

The doctype declaration is the very first line of any HTML document to ensure that established standards are adhered to - known as Standards Mode. This provide a certain level of conformity across the various interpretations and display of elements across browsers and even versions of browsers. It is a very succinct version of all the previous iterations.

Common Tags

As you may have noticed, html consists of tags that surround areas, and items. The following is the basic HTML construct <opening tag>Inner Content</closing tag> This represents the majority of HTML tags, except for the handful of tags which are self closing:

<br /> --adds a new line break 
<input /> --creates a user input field 
<img /> --adds an image on the page

HTML It is a Markup Language (ML part) which describes how content will be rendered by virtue of the tags that contain it

Try it out

Here is a an area where you can enter some content within HTML tags and see the result: