扫一扫加微信

Img标签属性之alt与title的区别与作用

在编辑HTML代码的时候,我们经常使用到图片代码img,该div元素有两个属性值较为相似,一直有网友将其混淆。那具体他们有哪些相似与区别呢?对于SEO又有什么影响呢?

alt属性

alt属性是为不能显示图像、窗体或applets的用户代理,用来指定替换文字。简单的说alt主要是用在图片无法显示时候的代替文字,比如你的logo图片无法显示的时候就会用alt的文字代替。

在编辑代码时使用alt属性是为了给那些不能看到你文档中图像的浏览者提供文字说明。这包括那些使用本来就不支持图像显示或者图像显示被关闭的浏览器的用户,视觉障碍的用户和使用屏幕阅读器的用户。替换文字是用来替代图像而不是提供额外说明文字的。

title属性

title属性为设置该属性的元素提供建议性的信息。它除了可以用在base,basefont,head,html,meta,param,script和title之外的所有标签。但是并不是必须的。可能这正是为什么很多人不明白何时使用它。

使用title属性提供非本质的额外信息。大部分的可视化浏览器在鼠标悬浮在特定元素上时显示title文字为提示信息。一些浏览器会将title文字显示在状态栏里。比如早期版本的Safari浏览器。

title属性有一个很好的用途,即为链接(即A标签)添加描述性文字,特别是当连接本身并不是十分清楚的表达了链接的目的(如图片链接等)。这样就使得访问者知道那些链接将会带他们到什么地方,他们就不会加载一个可能完全不感兴趣的页面。另外一个潜在的应用就是为图像(img标签)提供额外的说明信息,比如日期或者其他非本质的信息。

总结,img标签的alt属性是在图片因浏览器兼容、加载失败或地址出错等原因而不显示时为浏览用户所做的代替语言,其性质为该图片的代替;而img标签的title属性,是表达该图片的一些额外信息,其性质为一种备注或者注释,鼠标过去时显示该段文字。

10 评论

8+2=

  1. 丰禾棋牌

    这个对优化网站很在帮助

    回复
  2. 双色花盆

    博主辛苦了!观点太精辟了!

    回复
  3. www.seokz.com

    你站里的文章都很不错

    回复
  4. http://www.wgprice.com

    说的很好来转转了。。。

    回复
  5. injection molding

    很好,我已经转载了,哈哈哈。

    回复
  6. 微型逆变器

    真是个好说法,收藏一下,博主辛苦了。

    回复
  7. 冷库

    关注一下,

    回复
    • Antoine

      This is just the perfect answer for all forum meembrs

      回复
  8. cipiai

    学习了

    网络水军http://shuijunseo.com/

    回复
  9. 代考

    关注一下,

    回复