HTML Tags are the most basic part of HTML coding. Every thing in your website is a tag. Tags consist of a opening e.g. <p>. Tags also have an ending which is just the opening with a slash e.g. </p>. Then it has what is in the tag e.g. "Hello World".
Below there is a textbox where you can type code. This is the most basic introduction to any HTML document; the beginning of the scaffold. The head consists of multiple important pieces of information including the DOCTYPE, language and more. All websites should have a similar head which can be changed according to what's on the webpage. Below the closing head tag (</head>) and in between the <> type 'body' and below that (two lines below) type '/body'. In between these and in the <> type 'p' and after the '...>' type 'Hello World'. After you put it in type '/p' in the second set of brackets.
Everything in the code that you have just typed are very important and have a specific role. The '<!DOCTYPE html>' defines a webpage stating that the document type that will be coded into the rest of the webpage will be in the language HTML (as shown through the '...html>'). The next tag '<html>' represents the roots of the HTML document; the container for all the other HTML elements. The 'head' tag contains machine-readable information (aka metadata) about the HTML document, such as its title and style sheets. The title is defined through the 'title' tag in between the 'head' tags. The 'body' tags shows what will actually be shown on a webpage. As you can see from the textbox above, for every time you use an 'opening' tag (<...>), there will be a 'closing' tag later on in the document (</...>). This is tremendously important as an opening tag begins a section of page content, and a closing tag closes it. For example, to display a heading (for example 'h1'), you would open the text with the opening tag <h1> and close it with the closing tag </h1> (closing tags always proceed the element with a /).
This should produce something that looks like this if it was in an HTML document:
In order to check whether or not your webpage has been made correctly in accordance to W3C's standard, paste ALL of the code in the textbox into this website: W3C Markup Validation
There are 145 Tags in HTML5, however there are only a few that you will use regularly. These include:
Continuing on from the previous activity, we are going to learn how to add more tags to your webpage to display different material. Below in the textbox above the 'p' tag and below the 'body' tag, in the space provided type in an opening 'h1' tag. If you are struggling, refer to 'Activity 1'. *this is a link*. After doing this, Type in 'This is my first website' after the 'h1' tag. Following this, make a closing 'h1' tag. Again, if you are struggling, refer to 'Activity 1'. Below the 'h1' tag, make a subheading saying: 'This website is awesome', by using the 'h2' tag. Remember to close the 'h2' tag that you opened.
Following these instructions to a tee should lead you to a webpage that looks like this:
As you have seen throughout this lesson, we have asked you to validate your webpages through the W3Schools website. XHTML 1.0 Strict Validation refers to the process of checking whether a webpage follows the XHTML 1.0 Strict specification. XHTML (Extensible HyperText Markup Language) is a markup language that combines the syntax of HTML with the stricter rules of XML (Extensible Markup Language).
©{{CodeIt}}School 2023
