What exactly is HTML?
We humans can tell the difference between a header and a paragraph by looking at a page; computers lack this intuition. To successfully display a web page, a browser must be explicitly told what each piece of content is.
By looking through the document below, you can tell which is the title, heading, sub-heading, and cover picture right away. Your computer isn’t nearly as intelligent.
So how exactly do we tell the browser what’s what? This is where HyperText Markup Language (or HTML for short) comes in handy.
HTML is a markup language that describes the structure/layout of your web page. We define this structure by wrapping elements.
An HTML element is formed using a tag, which serves as a descriptor for each piece of content on your page. As an example, the <p> tag is used to describe a paragraph HTML element. Some other examples of HTML elements include:
<h1>: Highest-level heading
<h6>: Lowest-level heading
<img>: An image tag
<a>: An anchor which creates a hyperlink to things like other HTML pages, files, email addresses, and more
Most HTML elements have both opening <> and closing </> tags to indicate where an element begins and stops, as seen below:
<p>writing a paragraph in HTML</p> <h6>this is a heading 6 in HTML<h6>
There are a few exceptions, such as the <img> tag, which you will understand even better as we proceed.
<img src="emoji.jpg" alt="the picture of my dog.">
So let me show you how a basic HTML file looks on an IDE.
In the above image, The first line, <!DOCTYPE html>
This parameter is called Doctype declaration as in (Document Type Declaration). It specifies the format our HTML is written into the browsers. Defining HTML for this file indicates that it was written in HTML5.
For the second line, note how the closing
<html> tag is on the last line of the file. One of the properties of HTML elements is their ability to be nested. In other words, HTML elements can exist within other HTML elements.
Let me explain this further
<!DOCTYPE html> — This tag determines the language in which the page will be written. HTML 5 is used in this instance.
<html> — This tag indicates that we will now write in HTML code.
<head> — This section contains all of the page’s metadata — information that is primarily intended for search engines and other computer programs. The code we insert on this page will not be visually displayed to users.
<body> — This section contains the page’s content.
Let’s learn more about basic HTML structure in our next lesson.