The Absolute Dead Basics of HTML

This is based primarily on the first few things I learned, back when I first learned to code.

I'm not going to get into CSS, or doctypes, or anything like that, because, really, this is just how to get people to write a webpage from scratch.

We're talking blank-page-nothing-there from scratch.

So here we go:

<html>

</html>

These are the first tags you put in. That tells your browser that, yes, everything between these two tags is an HTML file and you better read it as such.

<head>

</head>

These are the HEAD tags. They are filled with the things that you don't want to display on the page, but are needed for the page to work right. If you wanted to link in a CSS file, it goes here. If you are SEOing the place up, it also goes here. If there's JavaScript or whatever, again, it goes here.

<title> </title>

And, importantly, the TITLE tags go into your HEAD tags. That's where you put the text that shows up at the top of your browser window when you look at a page. Usually, you keep it kinda short, but make it clear exactly what they're looking at. Like how this page says:

<title>The Absolutely Dead Basics of HTML</title>

And that's the HEAD tags done.

<body>

</body>

The body is where all the stuff you want to show up in the browser goes. The whole page. Right between those two tiny tags.

<h1> </h1>

The H1 tag is a header. Or a headline. Whatever way works for you to remember that you add H1s at the top of the page to tell everyone what this is about.

You can go down further too, into H2, H3, H4, H5, and H6. Sadly, it stops there. But if you're building a page that has it nested down to six-deep headlines, you have an organisation problem, I think.

<p> </p>

Are you writing text? Is it a paragraph? Congratulations, you need a P tag. It doesn't matter how long they are, it doesn't matter what's in them, you got your paragraph, you need your P tag.

<strong> </strong>
<b> </b>

Want to make it bold? Then use STRONG or B. STRONG is preferred for XHTML and accessibility, because it means that text-to-speech readers know to make it loud, but if you're just experimenting, you can use B as long as you don't make a habit of it.

<em> </em>
<i> </i>

And if you want to make it emphasised, that's where EM and I come in. And the same rules apply.

<img src="FILENAME" alt=" ">

The IMG tag is where you put an image. So, for example, say you have a picture of your fish out on the Internet. Like this one:

Chegwin The Goldfish

You would link to the file where it says FILENAME, then add a description between the quote marks in the alt section. So that picture of that fish is:

<img src="http://i.imgur.com/2I2u1nTs.jpg" alt="Chegwin The Goldfish">

But you should probably get your own goldfish. Or other pet.

Here is a sample page

Because you might need one.

<html>
<head>
<title>The Sample Page</title>
</head>
<body>
<h1>The Sample Page</h1>
<p>I have learned how to make a webpage!</p>
<p><strong>Yay!</strong></p>
<p>Love,</p>
<p><em>Me</em></p>
</body>
</html>

So there you go - make a web page!