Imagine that I have this paragraph,
and now I want to tag to let the system know that this is a paragraph.
We can add the tag p,
that is the standard tag for paragraphs in the beginning,
and we can close it at the end.
One important thing to take in consideration is
that the content itself can be another tag.
So, for example, imagine that now this is my content,
and I can add one tag before seeing
section to the final section of a page, and I can close.
So I can create a hierarchy of tags,
and I can add as many tags as I want inside each of those sections.
What is the reason why we want to make sure
that the system understand what is each element?
So, first, because certain genes is going to use
this information to understand your page and then when someone searching on the web,
they can use that to rank you page up and down.
Second, if you have someone that needs accessibility,
for example, a blind person,
to access your page,
the system will be able to understand and read parts of the page to this person as well.
Each tag can also have attributes.
Attributes is how we give information to the tag.
So we have the tag name.
We just add a new attribute,
equal, and the value between quotes.
For example, here I have the tag img that is used to add an image to a page,
and we have the attribute src with the address on which image I want to display there.
So, let's take a look on how an HTML structure is going to look like.
So, we start with what we call DOCTYPE declaration.
So, this is basically telling the system that this is an HTML page,
and it's a special tag.
So that's the reason why we won't close it, is going to keep open.
Then we have the HTML tag that basically define the beginning and the end of my page.
Inside HTML, we can add the body tag
that is basically the content that you see when you access a page.
So, for example, here I have a header and I have a paragraph.
You can see those showing here on my screen,
also I have this in my HTML.
Finally, we have another special type called head.
Head is what add metadata information to your page.
So, for example, here I am adding information that's called title,
and is defining the title that is going to show in
the user browser once the user access my page.
So, keep in mind that HTML defines the structure.
You don't try to define how things look like,
but what they are.
We have different language to define the appearance and the style of the page.
It's important to make sure that you use the most semantic tag for your text.
So, for example, if I have a paragraph,
you want to use a tag for a paragraph,
so the system can know how to read your page better.