HTML Basics: How tags work.

Hello everyone, in this tutorial where we will cover how tags actually work in HTML, this is a very basic tutorial assuming you know nothing of HTML or programming.If you are an more advanced programmer please check out later tutorials. With that said let us begin.

So what is HTML? HTML stands for Hyper Text Markup Language. It is a markup language used to design static websites using an assortment of tags.

So, what is a tag in HTML? Well to put it simply a tag is something that is surrounded by <> an example of this is the universal <html> tag that surrounds all HTML pages.

To put it simply, you have an opening HTML tag and a closing HTML tag, Everything in-between these tags are affected. So what is a closing tag? A closing tag is the exact same as an opening tag except for a / behind the < symbol. For example;

If you have a <p> tag (this is called a paragraph tag) then you would do something some this.

<p>This is a simple paragraph. This is a simple paragraph. This is a simple paragraph. This is a simple paragraph. This is a simple paragraph. </p> This is not part of the paragraph

And it would appear on a page like this:

This is a simple paragraph. This is a simple paragraph. This is a simple paragraph. This is a simple paragraph. This is a simple paragraph.

 This is not part of the paragraph

See how the text outside the paragraph tag isn't part of the paragraph? Simple isn't it?

So now that we have a basic understand of how tags work let's look at a basic HTML page layout.

<html>
<head>
<title></title>
</head>
<body>
</body>
</html>

Okay so I know what you're thinking "Woah James, head tag? title tag? body? what are these?" Don't worry I'm going to explain them all one by one.

Okay so the first thing we see is our <html> tag, this is the tag that as you can see here, surrounds all my other HTML tags.

Now for the <head> tag. This tag surrounds all your special code like javascript and css but we will worry about that a bit later. It also encases out <title> tag.

Our <title> tag is the text for what appears in the top of our browser and in our tabs. For instance my title tag is <title>Philosophers Home</title> and that is what you read when you look at my tab or the top of the page. It is also what appears as the main link in Google search results.

And now for the <body> tag, this is where you put everything that you want to visually show on the website itself. For example, the paragraph tag <p> we used earlier would be inside of the body tag like so.

<body>
<p>This is a simple paragraph. This is a simple paragraph. This is a simple paragraph. This is a simple paragraph. This is a simple paragraph.</p>
</body>

With that hopefully you have the very basic understand of HTML tags and how they work, in later tutorials we will reach out to making the most out of HTML tags to do some cool stuff and combine it with CSS (Cascading Style Sheets) to add that visual appearance that you want.

 If you have any questions or have things you would like tutorials on feel free to leave a comment and I will definitely work to answer any questions and fulfil any request.