- [Voiceover] You've already learnt a bunch of HTML tags.
But do you know what HTML actually means?
HTML stands for HyperText Markup Language.
It's a way of using tags to markup content.
But what does hypertext mean?
It's actually a phrase that was invented before the Internet even existed,
in the 1960s, to mean text that is connected to other text
that the reader can immediately jump to.
Tim Berners-Lee invented HTML,
and other ingredients of the Internet, like HTTP,
to be a way to connect text to other text
located anywhere in the world.
How do we connect webpages to other webpages
in HyperText Markup Language?
With a hyperlink, of course!
Which we usually just call a link, now.
How do we make a link in HTML?
This is where it gets weird.
You might think that we'd use a `link` tag...
But actually, that's used for a different sort of link in HTML.
Instead, we use the `a` tag, where the "a" stands for "anchor".
It's anchoring the link in the page at a certain location
and connecting that anchor to a different webpage.
To make a link, you know we have to write the tag,
but we also have to decide on the text of the link,
and then the address that the link goes to.
Let's make this link to a page with more information about the birth of the web.
The text of the link will go inside the start and end tags.
So I'll stick my cursor in here and write,
"Read more about the history of HTML".
So now we can see that text looks like a link.
But it's not going anywhere yet. We need to add an address.
We don't actually want the address to show up on the page,
but we still need the browser to know what it is.
So we put it inside an attribute on the a tag.
That's the href attribute.
What does "href" stand for?
I will give you a hint: You have seen that "h" a lot.
It stands for "hyper"! Hyper-reference.
Now, I'll paste in the address, which we also call a URL.
Do you notice how this URL starts with "http:" ?
Guess what that "h"stands for? Hyper!
HTML is all about the hyper.
This URL specifies everything the browser needs to know to find the webpage:
The protocol used for finding it,
the domain it is on,
and the path that it's located in on the server.
Since it specifies everything, we call this an "absolute URL".
On some webpages, you might see URLs that start with just slash and a path.
That tells the browser to stay on the current domain,
and just look for a different path on that domain.
That's called a "relative URL".
We use them all over Khan Academy when we link between our content.
You should stick to absolute URLs in the webpages that you make here,
to stay on the safe side.
We can also tell the browser where to open the page:
the current window, or a new window.
To tell the browser to open a link in a new window,
we'll add another attribute, target.
`target="_blank"`
Now, I want you to pause this talk-through and try clicking the link.
Go ahead, I'll wait. Clicky-clicky!
What happened?
You probably saw a warning
about the link being from a user-generated webpage.
And then if you clicked "OK", the link opened up.
That's because we treat links a little special
on the webpages made here.
Because we don't want users thinking that links are specially endorsed
by Khan Academy and then landing on a scary, unexpected website.
So, every link that you make here will have that warning,
and every link will pop up in a new window.
That means that I can actually delete this target attribute,
since it's getting set behind the scenes, too.
Or, I could leave it,
in case I want to move this HTML off of Khan Academy one day
and make sure that link still opens in a new window.
When should you use target?
Generally, if a link is going to another page on the same domain,
it should open in the same window.
And if it's going to a page on another domain, it should open in a new window.
Enough of that blabbing,
let me show you something else neat about links.
We can link more than just text.
We can also link images, or text and images!
Here, we have this image, which is which is this picture of Tim Berners-Lee.
I'm going to actually cut it...
and paste it so that it's inside this link here.
Oh! Sweet.
Now, if I mouse-over this image,
I'll see my cursor change to a pointer,
and clicking it will go to the CERN webpage.
In fact, you could link your entire webpage --
and make it a big, blue, underlined blob.
But please don't do that! Link with love, my friends.