Voiceover: So far, we have placed headings,
paragraphs, and images on our blog post webpage.
Another very important thing in webpages are links,
so let's go back to the little webpage
that we were playing with.
So, links are defined with the a tag,
which stands for anchor.
And we used the href attribute to tell
the browser where the link should take us.
For example, let's link to the Udemy website.
Let's do it right here after this image.
And as I said, we used an a tag,
with href attribute.
So, the link to the Udemy website is an external link,
because that website doesn't make part of our project.
So in that case we have to indicate
the complete path to the website we want to link to,
which means that it has to start with http://.
For Udemy, that would be http
//www.udemy.com.
Alright, and now I close it,
and here goes the text that will appear on the webpage.
So, link to Udemy.
So let's see if this works.
Click right here,
and yeah, it takes us to the Udemy website.
Alright.
Now, back in Brackets,
we see this message right here,
and this happened because we left the webpage
we were working on.
And so, the connection between Brackets
and the browser was lost.
So, let's close this,
and hit it again.
Okay, now the connection is back up.
A solution for this would be
to open the link in a new tab, right.
Sometimes that's actually right thing to do.
So I'll show you how to do that.
It's quite easy,
we just need to define the target attribute.
So target, and then from these four options,
we choose the blank options.
And now let's test it again.
I click here, okay, and so,
the Udemy site opens in a new tab
without leaving our original blog post.
So if we close this,
we are just back to our webpage.
We can also link to any document inside our current project.
For example, other webpages,
which is very important,
or even images, or other documents,
and those will be internal links.
So let's just add a link to the HTML image
we used before.
And I will do it right after this link.
So again, the a
href
and I will choose this logo here.
And again, we want it in a new tab.
I will say HTML logo.
Okay, and this also works.
So you see, we cannot only link to other websites,
but also to other documents such as images.
These were links.
Now you know how to make internal links
and external links to other webpages.
Congratulations,
you made it to the end of the introductory HTML section.
That's awesome!
Remember, that this section was designed
to make you familiar with HTML.
So far, we covered the basic structure of a webpage,
headings, paragraphs, images, and links.
We'll start to really work with HTML
when we're gonna start with our killer website project.
But before we do that,
the next section I'll introduce CSS
to style the HTML we just created.
Now to end this HTML section,
make sure you take the following quiz
to remember some things you learned so far.
So, good luck.