Welcome back to the blog guys! Today we'll be learning about HTML tags, what are they and how they are used, let's jump straight in shall we!
Alright, we are going to start off with the most important tags of a website which are the <html></html> tags, these tags are basically the base of your website, whatever is inside these two tags is considered your webpage, it works a little like this:
<html>
EVERYTHING BETWEEN IS CONSIDERED YOUR WEBPAGE
</html>Another tag is the <head></head> tag, between the head tags, if you put a <tittle></tittle> tag, then it'll give a name to your webpage, like:
<head>
<tittle>yourawesomewebsite</tittle>
</head>An important tag is the <body></body> tag, whatever is in the body is what the users will see and interact with, it works like this:
<body>
write anything you want
</body>Alright! let's head over to Visual Studio Code and put these tags into use.
Important Note: In order to see the changes you make to your code on your live website, you need to save it, to do that, click File on the top-left hand corner, and click save, although you should probably learn the keyboard shortcut (Ctrl+S), in order to save faster.
This is what my code looks like right now:
And this is what my webpage looks like right now:
As you can see, my "Hello World" message, and my title, which is "Webpage" is shown on the website.
I hope you now have a clear understanding of the tags I mentioned, those are the tags you need to write something on your website, but now we will get into some other tags:
<ul></ul>: This tag is used to create an unordered list, as shown here:
You need to put as many <ul>'s as you need for your list, keep that mind.
<div></div>: These are called divider tags, they separate your words from one an other, because even if you hit space bar, your words won't separate so you have to use this tag to do so.
<p></p>: This is called the paragraph tag, it creates a paragraph, now the main difference between this tag and the div tag is that the latter is used to separate words, and while this is used to create actual paragraphs.
<h1><h2><h3><h4><h5><h6> </h1></h2></h3></h4></h5></h6>: These are text size tags, h1 is the largest and h6 is smallest.
Let's see how these tags works on VSC.
Tip: when you type in a tag, put a multiplication symbol (*number) and hit Tab
It works like this:
ul*3Make sure to type your tag in without the <> symbols.
What this will do is multiply your tag to the number you provided, like for example, in the above it will give me the <ul></ul> tag three times, meaning that you don't have to type those tags individually.
Alright, with that done, I think we can call it a day, now there more HTML tags that we'll learn as we go along but for now, try to practise all these tags in your own and have feel of how they work, trust me, you'll get fast really quickly
On the next instalment of this series, we'll be learning CSS and how we can use to design our website, for now thank you, and bye.
Comments