Attributes and links
HTML stands for HyperText Markup Language. We have discussed what markup does—adds structure and meaning to content—but what is hypertext?
HyperText is a system for linking one bit of text to another. Each end is an “anchor” of the link. Originally, it was intended to mark each end of the link so links worked both directions. As you may have noticed, that didn’t quite work out.
So now we mark the “from” end, but not the receiving end.
Content that is so linked is called a “hyperlink”. We can hyperlink to text in the same document, to another document or part thereof on the same website, or even to another website.
The element we use for this is the “anchor” element. We use
the a tag for it.
Between the opening and closing a tags we put the link label.
Typically, you will see this as underlined blue text, but thatk’ not
the a element, which has no style. That’s
the default stylesheet at work.
Typically the pointer (or cursor) changes to a hand with one raised finger (not the middle one) when you hover the pointer over a link. That’s a nice affordance.
OK, so we can mark up the link label. Now, how do we tell it what to link to? That’s next.
HTML attributes
Sometimes we want to add more information to an element than just its
content. The anchor tag (a) is one example. We need to
tell it what to link to. Put another way, we need to give it a hypertext reference.
So HTML includes the ability to add “attributes” to HTML
elements. These take the form of name-value pairs separated by an
equal sign and with the value in double quotation marks: name="value".
We only need to define these once for each element, so we add the
attributes to the opening tag only. For our a element, we need a hypertext reference, abbreviated href:
a (anchor) element linking to Google. <a href="https://google.com/">Google</>
Done! That is almost all there is to HTML. Now it is simply a matter of learning the most common HTML elements and attributes.
Next: Element nesting
Previous: Headings