Head Tag and Title Tag

Not everything you type into your code editor will actually show up on your webpage.

SaY WhaAa?!

This reminds me of how my math teachers would always tell me to show my work.
*rolls eyes*

UH, you’re only gonna see what’s in the LITTLE BOX, Mr. Bennett! I’d complain in my head out loud. Why do I need to show my work?!!

c581f1465e0d29b07441200f8bb98a29.jpgWelp, not surprisingly enough, my math test scores were always better when I wrote out what I was thinking even though nobody else saw it – but tbh my ego is too big to admit I was wrong.

That behind the scenes action is exactly what is going on here in the <head> tag.

< head> Tag

Screen Shot 2018-09-17 at 8.01.47 PM.png
ICYMI: A tag is a label that indicates how anything within that tag will look.

The head tag holds all of the Behind the Scenes(BTS) information of your webpage.

BTS_Meme.png
And most importantly, it holds the title of your webpage – you’ll see it on the tab in your browser!

Screen Shot 2018-09-17 at 9.05.04 PM
Titles
: Netflix – Buzzfeed – Betches

If you were to check out the code for Netflix, the title is located in the <head> tag!

And this is how you can choose which title people will see when they open your webpage!

Let’s see how it’s done.

< title > Tag

The title tag is pretty neat, and you only have to use it once!

The title tag has an opening and closing tag:

<title> + text + </title> = Title Element

Go ahead and put whatever you’d like between the opening and closing tags!

Feeling angsty?

<title>Go Fork Yourself</title>

Screen Shot 2018-09-17 at 9.26.36 PM.png

Will result in:

Screen Shot 2018-09-18 at 2.00.26 PM.png

Pretty sweet, huh?

But because I am a mature 26 year old my mom might read this, I will add a different title to my webpage.

Le Example:

Screen Shot 2018-09-17 at 8.15.26 PM.png

This magical combination of letters and symbols will result in you feeling like the badddest programmer in town.

Screen Shot 2018-09-17 at 9.19.59 PM.png

Look, mom! I did it!

Up Next: How to preview your webpage in your browser

because it took me about two hours to figure out how to do this.

 

Leave a Comment!