Navigation:

Putting it together

For your browser to understand what each element of your site is, we need to label them with HTML tags. HTML stands for Hypertext Markup Language. Tags are words surrounded by the symbols <and>. For example, the <img> tag tells your browser “this is an image.” The <button> tag tells it “this is a button.”

alt text

Tags can also be used to organize your webpage! The image below outlines the structure of a basic webpage. The head usually contains the additional libraries used and the page title, while the body contains most of the displayed content.

html tag structure

Most tags need an opening tag and a closing tag. For example, you will see all pages have an <html> opening tag at the top, and a closing </html> tag at the end. This tells the browser where the HTML elements start and where they end. Think of tags like quotation marks; for example, the computer will understand that everything in between the tags <html> and </html> is part of an HTML website.

There are also a few tags, like the image tag <img>, that are self-closing, meaning that they only need an opening tag, and do not need a closing tag.

Here is an example:

See the Pen HTML Basics by Deliana Escobari (@Sunny-Dee) on CodePen.