SEO 百科

href 与 src

本页目录

href 与 src

href 与 src 是两类地址属性：href 声明链接指向哪里，用在 <a>、<link>、<area> 上；src 声明要把哪个资源取进来渲染，用在 <img>、<script>、<iframe>、<video> 上[1][2]。

差别在用途

href 的对象是"关系"，链接目标不会被嵌进当前页面，点了才去。src 的对象是"内容"，浏览器会发起请求并把结果放进当前文档的位置[1]。写反了会静默失效：给 <img> 写 href 图片不显示，给 <a> 写 src 链接不通。

相对与绝对地址

同一份 HTML 里两种写法都合法，解析规则一致[3]。

绝对   https://example.com/a/b.html
协议相对   //example.com/a/b.html
根相对 /a/b.html
文档相对 b.html  ./sub/b.html

协议相对写法在 HTTP 页面里会带出 HTTP 请求，全站转 HTTPS 后这类地址最容易漏[4]。

与抓取的关系

抓取靠 <a href> 发现页面，src 里的地址属于资源请求[3]。图片的文件名与替代文本帮助理解图片主题，src 只是取图路径[5]。iframe 的 src 指向另一份文档，其内部链接是否被当作本页出口，各引擎处理不同[1]。

常见误用

第一种是把链接写进 onclick 脚本，静态 HTML 里没有 href，抓取与键盘用户都拿不到[6]。第二种是相对地址在子目录页面里指错一层。第三种是图片 src 指向临时签名地址，收录后再访问已经是 403[5]。

附录

参见

参考资料

官方（境外）

  1. 《<a> HTML 元素》，MDN Web 文档。
  2. 《<img> HTML 元素》，MDN Web 文档。
  3. 《URL Standard》，WHATWG。
  4. 《Enable HTTPS》，web.dev，Google。
  5. 《Google 图片搜索》，Google 搜索中心。
  6. 《了解 JavaScript SEO 基础知识》，Google 搜索中心。

外部链接