Hi welcome back my student and this lecture we we're going to be learning something really awesome is
about that document about the amount document structure how everything works from top to bottom.
So this is really great for a foundation.
This is something that you should know.
So I want you to leave all the distractions that you have from your phone from your maybe your wife
is calling you to tell her that you'll be there in five minutes.
Or maybe your husband is calling you.
Tell him you'll be there in 10 minutes.
So put all the distractions away and let's get it going.
So let's open up your coeditor and let's open up a browser window.
I was working the last Fall here.
So while we are going to be doing is we are going to be creating a new file.
And we are going to be naming these file underscore blank dot the.
Now why underscore because this court puts this on top of all the files and we're going to be using
this blank page mail for like a template used.
We're going to use this to do a Save As a law that lectures that we are going to be doing.
Because this is going to have this structure right here right so I just build this structure I'm going
to do a Save As.
You are welcome to copy all these down.
Or you can just go to your exercise files and find the blank direction mail there.
All right now.
Let me start from the top to bottom because this is how the browser sees all the information in this
It starts from the top and then goes all the way to the bottom.
So on the top here it has something called the doctype and is very descriptive.
If you read it carefully document type right.
And the same is an HMO document but he's also saying that he's in the mail 5 document.
I know he doesn't have the five but this is the way they made it.
So we have a left angle bracket with an exclamation with a key word doc type following a space in the
key word H.T. a male and following that right angle bracket.
And that's all it is.
It doesn't have any closing tango anything is just one tag.
Now following that we have older tags we have an HMO tag on an opening tag and a closing tag right here.
Now you've probably seen something really strange right.
You're seeing this keyword right here these words.
Well this is called and naturally you the one you're seeing green and this is the value of the attribute.
The one you see orange.
So he's always like this.
The key word equal sign in quotes around the word de-value right.
So why in the world were you were we have attributes.
Well not only are we telling the browser that this is on the male document we're also telling in the
language that it should be format in this document too.
So right now we're telling it format is document the language English.
All right and there are many other different languages that you can put here.
But right now we're doing English right so that's all we're saying to the browser you're going to have
some H.M.S. attacks where and that's where you needed to do something else.
All right attributes are super powerful so keep that in mind.
So we have everything on this document wrapped around this H.T. a mail tag.
Basically we're saying these are in the mail document right.
And this is actually code from the doctype to the head right here.
This is the non-visual part of the document that actually does some type of work in the browser.
There is a lot of things going on here in the head.
So this this is the head section we have an open Italian a closing tag and then in between that we have
all their tags and we can do other tasks there and we will include all the tags later on we're telling
the browser to do things here.
We're telling the browser right now to do a character set.
All right equal to the value of UTF hyphenate.
And this is the encoding for this UTF Haiphong a encoding right.
You're welcome to look it up online if you want.
I think Wikipedia has a good knowledge base on on the UTF But this is just the encoding of the character
And now every page has to have a title right now that page the full page name for this we just named
it document but we can name it whatever we want.
So I'm just going to save this file and then from here we're going to be doing a Save as well right
so I'm going to be doing the same as and I'm going to be calling this document actually structure I'm
So now the visual part of the actual document is going to be in between the body tags.
So we have the opening body tag and the closing one.
Now here we can type something like Livengood bracket H-1 and we've already seen this one and we can
call this page structure structure home.
This is going to be the heading and then we can also say paragraph left angle bracket and the end and
the the left and the opening and closing tag right.
And we can say this is my first complete page.
There we go Dot.
And then we save it command as a control as we go to the browser and refresh and this blue line here
is just because I'm selecting this here right.
So I'll refresh.
There we go.
All right so as you can see is super easy.
The HMO document is nothing out of this world.
It's super simple to learn.
And I think you're right.
Really good to know.
A really good start right now.
You're really off.
You're really good.
How you say that.
Off to a good start something like that.
But anyway you get my point right.
You're doing very good if you're following me.
Thank you so much for watching this lecture was a pleasure.
And I see you in the next one my dear student Bebai.