What is HTML?

HTML stands for Hyper Text Markup Language, and it's the language that makes up every single webpage. From YouTube to Google, and yes, neocities too.

Here's some fairly simple HTML code.


                <!DOCTYPE html>

                <html>
                    <head>
                        <meta charset="utf-8">
                        <title>Project2 Tutorials</title>
                    </head>
                    <body>
                        <h1>Welcome!</h1>
                    </body>
                </html>

Does it look scary? Trust me. It won't by the end of this tutorial. Let's break it down line by line.

<!DOCTYPE html>

This is what every website should start with. This line basically tells your browser (the thing you use to browse the web) that the website is using the latest version of HTML, HTML5.

<html>

This is the starting html tag.

You now may be wondering what 'tags' are. In their simplest form, tags tell the browser what to do with the stuff inside of them.

If you take a took at the last line of code, you'll see the ending html tag. You can tell it's the ending tag because it has a forward slash before the name of the tag.

Everything between the starting and ending tags is affected by them. In this case, html tags tell the browser that whatever is inside of them should be part of the website.

So, let's take a look at what's inside!

<head>

More tags! Yes, you can have tags inside of tags.

The head tag can contain a lot of stuff like styles and scripts, but in this example it contains two things. Let's take a look at them! Sidenote: you can't see anything in the head tags.

<meta charset="utf-8">

All this scary looking line does is tell the browser which character set you want to use. Basically, by adding this line, you get more characters. Hooray! Sidenote: meta tags don't need to be ended.

<title>Project2 Tutorials</title>

Yes, you can have the starting and ending tags on the same line, which is very useful if you don't have much stuff in them, like here!

The title tag tells the browser what to put in the tabs at the top, or the title of the browser window. In this case, it would put Project2 Tutorials in the tab.

<body>

The body tag contains all the stuff that you can see on the website, such as text, images, and links. In this example, we only have one thing inside the body tags.

<h1>Welcome!</h1>

The h1 tag makes all the text inside of it big and bold! In this case, the word 'welcome' is that text.

And that's it! Hopefully, you now understand what tags are, and the basic layout of a HTML page!

If you didn't understand something, leave a comment on the Neocities page, and I'll try to improve how I explain it.