This is where we left in the previous video by talking about some of the new semantic elements in a
HTML five.
In this video, I'm going to use some diagrams to show you how we are going to use some of these elements.
So here we go.
We are going to compare a time for website to a HTML five, and that way you're going to see the importance
of the HTML five.
So here we go.
Let's take it that we are going to create a website in a HTML four.
And for our site, this is the container, and we are about to fill out the layout of this application.
And for every website, when it depends on the client's needs, how they layout are going to be used.
In that way, you can decide which element that you are going to use.
But for this one, definitely we are going to have the header.
As you can see for this header we use div and inside you're going to have the content inside.
So this is our header and also we want a section for a side bar.
And as you can see, we also use Dave and inside you're going to have the side bar and after that you're
going to have the main content.
Let's take it that we are creating a website for blogging and this is the main container that is a dark
background.
It means that we are going to fill up the individual post here.
Then you also have the footer down here and inside the container.
This is where we are going to place the individual blog post and we are going to put individual posts
inside Div.
As you can see, this is our first post and then the second post and then the third post.
So this is the school or way for structuring website.
By using this.
As you can see, this website does not convey much information because when I see this on layers, I
look at the content inside or with some comment before I consider oh, this one is for header.
Likewise, the sidebar, unless I look at the content inside.
So it means that this is not very structured.
So let's look at the top five.
We are going to create or recreate this website using a HTML five.
So here we go.
We're going to have the main content, the main page, and you're going to fill out the same content
as you can see for 18.5.
Instead of using DIV, we are going to use new element core header as we spoke about.
And for the sidebar we are going to use what is called navigation, right, instead of using this.
All right.
And also for the main content, instead of using this, we are going to use a tag called Main.
Then inside the main we are going to have individual posts and we're going to group them inside a tag
called article for a term of four.
You can see we are using this all around when I have multiple articles and for the footer we are going
to use this.
So based on this guys, which one is the best way to go?
And that is a HTML five.
This one conveys much information.
It looks more descriptive.
And one cool thing is that search engines can help us to improve the as you because it knows the purpose
for these tasks.
Unlike the school old way.
All right, guys, we have a lot of this HTML five semantic elements, but these are the common ones.
Let's continue on in the next video.