zoukankan      html  css  js  c++  java
  • IMG 的alt和title的区别(转自 百度空间路云的世界)

    图片标签img中alt与title的区别

      图片标签img中alt与title的区别
      可能很多新手在做站内优化的时候,不明白图片标签img中alt与title的区别,今天为大家说一下其中的区别。
      大家可以一起动手来做测试:把以下代码保存的文本中,命名为.html结尾的文件,然后分别用不同浏览器打开。
      代码:
      <blockquote>
      <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”
      “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>[br]
      <html xmlns=”http://www.w3.org/1999/xhtml”>[br]
      <head><title>图片标签img中alt与title的区别</title></head>
      <body>[br]
      <img src=”图像的正确地址” title=”title正确图片” >[br]
      <img src=”图像的正确地址” alt=”alt正确图片” >
      <img src=”图像的错误地址” title=”title错误图片” >[br]
      <img src=”图像的错误地址” alt=”alt错误图片” >
      </body>[br]
      </html>
      </blockquote>


      预览以上代码我们可以看出alt与title的不同:
      1、含义不同
      alt是当图片不存在时的替代文字;title是对图片的描述与进一步说明

      alt:使用alt属性是为了给那些不能看到你文档中图像的浏览者提供文字说明,也就是图片显示不了的时候显示的文字。
      title:图片正常显示时,鼠标悬停在图片上方显示的提示文字。
      title和alt虽然比较相似,但是还是有区别的,这两个属性比较混淆,我们来看一下两者 的区别:
      alt属性:
      使用alt属性是为了给那些不能看到你文档中图像的浏览者提供文字说明。这包括那些使用本来 就不支持图像显示或者图像显示被关闭的浏览器的用户,视觉障碍的用户和使用屏幕阅读器的用户。替换文字是用来替代图像而不是提供额外说明文字的。
      ①为不能显示图像、窗体或applets的用户代理(UA),alt属性用来指定替换文字。 替换文字的语言由lang属性指定。
      ②它只能用在img、area和input元素中
      ③长度必须少于100个英文字符或者用户必须保证替换文字尽可能的短。
      title属性
      使用title属性提供非本质的额外信息。title属性有一个很好的用途,即为链接添加描 述性文字,特别是当连接本身并不是十分清楚的表达了链接的目的。
      ①为设置该属性的元素提供建议性的信息。
      ①可以用在除了 base,basefont,head,html,meta,param,script和title之外的所有标签。
      ③值可以比alt属性值设置的更长。不过要注意的是,有些浏览器会截断过长的文字。比如 Mozilla核心的浏览器只能显示最先的60个字符。
      综上所述,我们可以知道,我们可以给option用title加注释,但是不能用alt加注释

      2、在浏览器中的表现不同
      在firefox和ie8中,当鼠标经过图片时title值会显示,而alt的值不会显示;只有在ie6中,当鼠标经过图片时title和alt的值都会显示。


      对于网站seo优化来说,title与alt还有最重要的一点:
      搜索引擎对图片意思的判断,主要靠alt属性。所以在图片alt属性中以简要文字说明,同时包含关键词,也是页面优化的一部分。条件允许的话,可以在title属性里,进一步对图片说明。

      在许多时候,alt的局限性很大.而title的扩展性很强.我们在互联网上经常会看到,当指针移上去时,有时显示的注释里不光有文字,还有图片,还可以换行,甚至更多!真的很奇妙,这是怎么弄上去的呢?直接将HTML代码写入TITLE标签里当然是不行的了.
      建议大家以后如果只是图片,或者是给按钮等常用的加些文字替换的话,用ATL属性就够了.而是要完成更酷的特效或者是加载图片,给更多的标签加注释时,应选用Title属性.

  • 相关阅读:
    PAT B1045 快速排序 (25 分)
    PAT B1042 字符统计 (20 分)
    PAT B1040 有几个PAT (25 分)
    PAT B1035 插入与归并 (25 分)
    PAT B1034 有理数四则运算 (20 分)
    PAT B1033 旧键盘打字 (20 分)
    HDU 1231 最大连续子序列
    HDU 1166 敌兵布阵
    HDU 1715 大菲波数
    HDU 1016 Prime Ring Problem
  • 原文地址:https://www.cnblogs.com/ouber23/p/3630234.html
Copyright © 2011-2022 走看看