Links
Web Basics — HTML & CSS Lesson 5 2:23 English narration · English + 中文 subtitles burned in
Chapters
Transcript
The link tag is a, short for anchor, and it brings something genuinely new with it.
链接标签是 a,是 anchor(锚)的缩写, 而它带来了一样真正新的东西。
Inside the opening tag there is extra information: href, followed by an address in quotes.
在开始标签的里面,还有额外的信息:href,后面跟着一个用引号括起来的地址。
That is called an attribute.
这叫做“属性”。
And a link needs two separate things, which is why it needs the attribute.
一个链接需要两样不同的东西,这正是它需要属性的原因。
The href is where the click goes.
href 是这一次点击要去的地方。
The words between the tags are what the reader sees and clicks.
标签之间的文字,是读者看到并点击的东西。
Neither one can do the other's job.
这两者谁也替不了谁。
Press play and you see the words, not the address — exactly as with every tag so far, the markup does its job and then gets out of the way.
按下播放,你看到的是那几个字,不是那个地址—— 和目前为止的每一个标签一样,标记做完它的事,然后就退场了。
The link comes out blue and underlined, which is the browser's default look for one, the same in every browser.
链接显示成蓝色带下划线, 这是浏览器给链接的默认样式,每个浏览器都一样。
You can change that later with CSS; for now it is a useful signal that your link actually worked.
以后你可以用 CSS 改掉它; 现在它是个有用的信号,说明你的链接确实生效了。
A link does not have to stand alone.
链接不一定要独自成行。
Wrap it around a few words in the middle of a paragraph, exactly the way you wrapped one word in strong last lesson, and the sentence still reads normally — only those words are clickable.
把它包在段落中间的几个词上, 就像上一课你用 strong 包住一个词那样, 句子读起来依然自然——只有那几个词是可以点的。
One piece of advice while you are here: link the words that describe where you are going.
顺带一条建议: 把描述“要去哪里”的那几个词做成链接。
"Look it up" tells a reader something.
"Look it up" 能告诉读者一些信息。
Click here tells them nothing, and tells a screen reader even less.
"点这里" 什么也没告诉他们, 对屏幕阅读器来说更是如此。
Two slips catch almost everyone.
有两个失误几乎人人都会遇到。
First, an a tag with no href at all: the words appear, but there is nothing to follow, so it is text pretending to be a link.
第一,一个完全没有 href 的 a 标签: 文字是出现了,但没有任何东西可以跳转, 所以它只是伪装成链接的文本。
Second, an address with no h t t p s in front.
第二,地址前面没有写 https。
The browser then reads it as a page on your own site and looks for it there, which is not what you meant.
浏览器会把它当作你自己网站上的一个页面去找, 那不是你的本意。
Use the full address, and both tasks work.
写完整的地址,两道题就都成立了。
Four things to take with you.
带走四点。
One: a link is the a tag, short for anchor.
第一:链接就是 a 标签,是 anchor 的缩写。
Two: href is an attribute — extra information inside the opening tag.
第二:href 是一个属性——写在开始标签里面的额外信息。
Three: the words between the tags are what gets clicked.
第三:标签之间的文字,才是被点击的部分。
Four: use the full address, starting with h t t p s.
第四:写完整的地址,以 https 开头。
Now do both tasks — one link on its own, one inside a sentence.
现在做那两道题——一个独立的链接,一个句子里的链接。