Here is a very small webpage. Almost as small as you can get, and still call it a webpage.
<html> <head> <title>A Webpage!</title> </head> <body> I like fishsticks! </body> </html>
That’s not so bad, right? Code is like a crocodile, it’s not so scary when it’s small. So you just need to break it down into smaller and smaller chunks until you get it. Let’s take a look at each piece of our webpage. The <html> tag says “start the webpage”. The </html> tag at the end says “end the webpage”. (Remember, a tag with a “/” at the beginning means to end the tag.)
So look inside the <html> tag and the </html> tags in the code above. You’ll see two major chunks: The head, and the body. The head contains information about the webpage like the title (which you can see up in the title bar of the window), style information, and external resources to name a few. The body contains what we see on the page.
Since the <title> tags belongs inside the head tags, they’re said to be nested.
<head> <title>A Webpage!</title> </head>
Our <body> tags don’t contain much. Just one sentence reflecting my fondness for fish in stick form. Then the body ends. Then webpage ends. So now you know what tags are, you know what they do, and how they function. Do you feel like you just found out magic trick works? Turns out it wasn’t so amazing after all.
This is coding. All the rules are insanely simple, it’s just how we put them together that makes them interesting. Next, we’ll talk tags.