The Only Basics You Need To Know - Rachel.ie

HTML, or HyperText Markup Language, is the language that web pages use to display their content. It’s made up of different elements which tell the web browser how to show it’s information. In today’s online world, understanding how websites work is crucial. Here are the only basics you need to know in HTML!

Table of Contents hide

Tags Theory

HTML is built of individual elements, with each element telling the web browser a different thing. Elements are made up of a starting tag and an ending tag, with the content you want to display in the middle. Nearly every tag requires an opening and closing tag, with very few exceptions.

<start_tag> CONTENT <end_tag>

The most commonly used tags are the HTML tag, head tag, title tag, body tag, header tag, and paragraph tag. Continue reading to find out more!

HTML Tag

<!DOCTYPE html>

<html>
    CONTENT
</html>

The DOCTYPE tag is necessary to include at the very beginning of every page to let the browser know that it’s an HTML document. The HTML element follows immediately after and is also included at the very end of the document. It acts as a container or box that holds the rest of the elements.

Heading Tag

<head>
    CONTENT
</head>

The heading element acts as a container for the web pages metadata. This is information about the website, such as the title of the page, the style, such font colour, and link tags, which connect to style sheets. Nothing inside the heading tag is displayed on the web page.

Title Tag

<title> CONTENT </title>

The title tag is always stored inside the heading tag. It defines the title of your web site and is a requirement for all pages. It’s not displayed to the user, instead, it’s used by search engines to determine where the website will display in search results.

Body Tag

<body>
    CONTENT
</body>

The body tag is where the web page’s content is stored. It defines the body of the document and contains everything from headings to images to lists. There is only one body element in every HTML page, with both an opening tag and a closing tag.

Header Tag

<h1> CONTENT </h1>
<h2> CONTENT </h2>
<h3> CONTENT </h3>
<h4> CONTENT </h4>
<h5> CONTENT </h5>
<h6> CONTENT </h6>

The header tag, not to be confused with the heading tag, is used to create headers within the web page. They are stored inside the body tags and you can include as many headers as you wish. There are six possible headers to choose from, each of which becoming progressively smaller. “h1” being the largest text and “h6” being the smallest.

Paragraph Tag

<p> CONTENT </p>

The paragraph tag is used for the main content of the web page. The web browser automatically adds a blank line between sets of paragraph elements. If you wish to change the formatting of text within paragraph tags, then you must use HTML elements, as the browser will otherwise ignore it. For example, if you want to include extra spaces between individual words, you cannot manually add spaces, you must use the “&nbsp” element.

Summary

<!DOCTYPE html>
<html>    
              
           
    <head>
        <title>Web Page Title</title>
    </head>


    <body>                    
        <h1>Place your heading here</h1>
        <p>This is your body of text</p>
    </body>


</html>

-Tells the browser that everything after this 
is in HTML format.


    -The heading of the web page.
        -The web page’s title.
    -The headings closing tag.


    -This is where the content is written.
        -The header tag, ranging from h1 to h6.
        -A new paragraph.
    -The body’s closing tag.


-Tells the browser that the HTML section has
ended.

Read more about programming here!