『自我の感悟』alt or title?
img标签中alt和title属性的正确使用:
在的img标签有两个属性分别为alt和title,对于很多初学者而言对这两个属性的正确使用都还抱有迷惑,当然这其中一部分原因也是ie浏览器所导致的。正确的使用这两个属性除了可以提高图片的搜索能力外,在用户体验上也是很有帮助,下面就来说说alt和title的概念与正确使用。
alt
此属性的实质作用是图片在无法正确显示的时候起到文本替代的作用,不过在IE6下还起到了title的作用(鼠标放上去后的文字提示),IE的实现方法实际上是错误的。如果想在鼠标滑过时显示提示,应该用title属性。由于错误的引导,很多初学者就在img标签内只加了alt属性。所以这里再次表扬一记FF!
title
鼠标滑过时显示的文字提示,用户体验上很重要。当然不必要所有的img标签都加此属性,比方说logo这样比较重要或者说用户会体验到的图片内容建议一定要加此属性。
W3C:
/title/
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本(tooltip text)。
提示:title 属性常与 form 以及 a 元素一同使用,以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
/alt/
定义和用法
alt 属性是一个必需的属性,它规定在图像无法显示时的替代文本。
假设由于下列原因用户无法查看图像,alt 属性可以为图像提供替代的信息:
1.网速太慢
2.src 属性中的错误
3.浏览器禁用图像
4.用户使用的是屏幕阅读器
<img> 标签的 alt 属性指定了替代文本,用于在图像无法显示或者用户禁用图像显示时,代替图像显示在浏览器中的内容。
我们强烈推荐您在文档的每个图像中都使用这个属性。这样即使图像无法显示,用户还是可以看到关于丢失了什么东西的一些信息。而且对于残疾人来说,alt 属性通常是他们了解图像内容的唯一方式。
提示和注释:
注释:alt 属性的值是一个最多可以包含 1024 个字符的字符串,其中包括空格和标点。这个字符串必须包含在引号中。这段 alt 文本中可以包含对特殊字符的实体引用,但它不允许包含其他类别的标记,尤其是不允许有任何样式标签。
注释:当用户把鼠标移动到 img 元素上时,Internet Explorer 会显示出 alt 属性的值。这种行为并不正确。所有其他的浏览器正在向规范靠拢,只要当图像无法显示时,才会显示出替代文本。
提示:如果需要为图像创建工具提示,请使用 title 属性。
img标签中alt属性与title属性在seo的作用
『自我の感悟』alt or title?的更多相关文章
- 关于『进击的Markdown』:第三弹
关于『进击的Markdown』:第三弹 建议缩放90%食用 我与神明画押,赌这弹markdown又双叒叕拖稿了 %%%Markdown!我的CSDN编辑器崩了呜呜呜 各路英雄豪杰,大家好! 我们要开 ...
- 2017-2018-2 165X 『Java程序设计』课程 助教总结
2017-2018-2 165X 『Java程序设计』课程 助教总结 本学期完成的助教工作主要包括: 编写300道左右测试题,用于蓝墨云课下测试: 发布博客三篇:<2017-2018-2 165 ...
- 2017-2018-20172309 『Java程序设计』课程 结对编程练习_四则运算——第一周
2017-2018-20172309 『Java程序设计』课程 结对编程练习_四则运算 组队成员: 仇夏 学号: 20172310 博客地址:点击这里 1. 需求分析: 可生成题目: - 输入要想生成 ...
- 20172325『Java程序设计』课程 结对编程练习_四则运算第三周阶段总结
20172325『Java程序设计』课程 结对编程练习_四则运算第三周阶段总结 结对伙伴 学号:20172306 姓名:刘辰 在这次项目的完成过程中刘辰同学付出了很多,在代码的实践上完成的很出色,在技 ...
- 20172311『Java程序设计』课程 结对编程练习_四则运算第一周阶段总结
20172311『Java程序设计』课程 结对编程练习_四则运算第一周阶段总结 结对伙伴 学号 :20172307 姓名 :黄宇瑭 伙伴第一周博客地址: http://www.cnblogs.com/ ...
- 20172313『Java程序设计』课程结对编程练习_四则运算第二周阶段总结
20172313『Java程序设计』课程结对编程练习_四则运算第二周阶段总结 结对伙伴 20172326康皓越 博客地址(http://www.cnblogs.com/326477465-a/p/90 ...
- 2017-2018-2 1723 『Java程序设计』课程 结对编程练习-四则运算-准备阶段
2017-2018-2 1723 『Java程序设计』课程 结对编程练习-四则运算-准备阶段 在一个人孤身奋斗了将近半个学期以后,终于迎来的我们的第一次团队协作共同编码,也就是,我们的第一个结对编程练 ...
- 2017-2018-2 20172323 『Java程序设计』课程 结对编程练习_四则运算
结对编程的好丽友 - 20172323 王禹涵:中缀转后缀 - 20172314 方艺雯:后缀表达式的计算 - 20172305 谭鑫:中缀表达式的输出 需求分析 能随机生成由使用者确定的任意多道四则 ...
- 关于『进击的Markdown』:第五弹
关于『进击的Markdown』:第五弹 建议缩放90%食用 路漫漫其修远兮,吾将上下而求索. 我们要接受Mermaid的考验了呢 Markdown 语法真香(一如既往地安利) ( 进击吧!Mark ...
随机推荐
- VS2005工程的Device右边内容为空问题
VS2005工程的Device右边内容为空问题 可能是刚刚在删除C盘一些文件或是这些文件因为某些原因丢失了,在打开WINCE6.0系统工程的时候,发现无法编译,才注意到VS2005工程的Device右 ...
- 苹果新的编程语言 Swift 语言进阶(十一)--实例的初始化与类的析构
一 .实例的初始化 实例的初始化是准备一个类.结构或枚举的实例以便使用的过程.初始化包括设置一个实例的每一个存储属性为一个初始值,以及执行任何其它新的实例能够使用之前需要的设置或初始 ...
- OpenCV stereo matching 代码 matlab实现视差显示
转载请注明出处:http://blog.csdn.net/wangyaninglm/article/details/44151213, 来自:shiter编写程序的艺术 基础知识 计算机视觉是一门研究 ...
- 图像分割之(四)OpenCV的GrabCut函数使用和源码解读
图像分割之(四)OpenCV的GrabCut函数使用和源码解读 分类: 图像处理 计算机视觉 2013-01-23 ...
- LeetCode(33)-Pascal's Triangle II
题目: Given an index k, return the kth row of the Pascal's triangle. For example, given k = 3, Return ...
- WebService学习--(一)webservice相关概念
一.序言 大家或多或少都听过 WebService(Web服务),有一段时间很多计算机期刊.书籍和网站都大肆的提及和宣传WebService技术,其中不乏很多吹嘘和做广告的成 分.但是不得不承认的是W ...
- ssh三大框架集成后,jsp中采用forword标签提交时会报错的解决方案
最近这两天心烦,所以没事就做做三大框架,对于今天遇到了一个烦心的事!或许有很多开发人员对于web.xml拦截器的认识不清,出现了这样的情况 <filter> <filter-name ...
- 发布开源库到JCenter所遇到的一些问题记录
这周末自己瞎折磨了下,如何发布开源库到 JCenter,然后这过程中碰到了一些问题,在此记录分享一下 本篇是基于上一篇:教你一步步发布一个开源库到 JCenter 介绍的流程.步骤中所遇到的问题,所以 ...
- JS基础:闭包和作用域链
简介 一个定义在函数内部的函数与包含它的外部函数构成了闭包,内部函数可以访问外部函数的变量,这些变量将一直保存在内存中,直到无法再引用这个内部函数. 例如: var a = 0; function o ...
- 【转】学习FFmpeg API – 解码视频
ffmpeg是编解码的利器,用了很久,以前看过dranger 的教程,非常精彩,受益颇多,是学习ffmpeg api很好的材料.可惜的是其针对的ffmpeg版本已经比较老了,而ffmpeg的更新又很快 ...