HTML img标签:标题属性与alt属性?
我在浏览亚马逊网站,注意到当search“1TB”( http://www.amazon.com/s/ref=nb_ss_gw?url=search-alias%3Daps&field-keywords=1TB )时,如果将鼠标移到星级评分的形象,你只能看到使用IE浏览器的分数。 如果您正在使用其他浏览器,则分数将不会显示。
3.8的评分和4.2的评分都显示为4星。 当然,一个3.8星和4.2星(76%对84%的分数)可以有所作为!
这是因为显示“alt”文字的标准方式只有当用户closuresgraphics或浏览器被“读出”(例如,浏览器供视觉受损的用户)时。 然而,IE浏览器显示在hover。
所以我想如果亚马逊不pipe用户的浏览器来显示它,那么除了“alt”之外,还应该使用“标题”。 你同意吗?
我会去的。 标题将在所有浏览器中显示一个很好的工具提示,并且在没有图像的浏览器中浏览时,标题将给出描述。
这就是说,我很想看看有些“冲浪者”出现在“商店”浏览商品的实际上是closures了图片还是正在使用不支持图片的浏览器。 我想90%的人口正在使用一个28K调制解调器连接到InterWeb的时代已经结束了。
他们被用于不同的事情。 使用alt
属性而不是图像。 如果图片不能显示,或(我相信)在屏幕阅读器。
title
属性与图像一起显示,通常作为hover工具提示。
一个不应该被用来代替另一个。 每个人都应该被正确地使用,去做他们devise的事情。
正如已经提到的, alt和title是不同的东西。 虽然标题标签将提供一个工具提示,但也是一个重要的属性,因为它指定的文本显示,如果图像不能显示。 (在一些浏览器中,比如firefox,你也会在图片加载的时候看到这个文本)
另一点我觉得应该做的是, alt标签是需要validation为XHTML文档,而标题标签只是一个“额外的select”,因为它是。
那是因为他们服务于不同的目的,他们不应该只相互使用。
这个“alt”是为了你们已经说过的,所以你可以看到如果图像不能显示(无论什么原因),那么你可以看到图像是什么,它也允许有视觉障碍的人理解图像是什么。
“标题”属性是正确的显示图像标题的工具提示。
在我看来,如果替代文字总是描述图片中可见的东西,那么就不会显示图片。
alt = text [CS]对于无法显示图像,表单或小程序的用户代理,此属性指定替代文本。 替代文本的语言由lang属性指定。
w3.org
我认为,对严格的XHTML合规性来说,这是必需的。
正如其他人所指出的,标题是工具提示(很好有),ALT是为了可访问性。 使用两者都没有错,但应始终在那里。
不,我认为alt
更好,因为该属性的目的是在图像无法查看的情况下(无论图像是否丢失或浏览器本身无法显示)提供“替代”文本。
ASP.NET MVC的MVCFutures决定做这两个。 事实上,如果您提供“alt”,它会自动为您创build一个具有相同值的“标题”。
我没有源代码,但一个快速的谷歌search为它启动了一个testing用例!
[TestMethod] public void ImageWithAltValueInObjectDictionaryRendersImageWithAltAndTitleTag() { HtmlHelper html = TestHelper.GetHtmlHelper(new ViewDataDictionary()); string imageResult = html.Image("/system/web/mvc.jpg", new { alt = "this is an alt value" }); Assert.AreEqual("<img alt=\"this is an alt value\" src=\"/system/web/mvc.jpg\" title=\"this is an alt value\" />", imageResult); }
你不应该使用img元素的title属性。 这背后的原因很简单:
推测字幕信息是默认情况下所有用户都可以使用的重要信息。 如果是这样的内容作为文字旁边的图像。
资料来源: http : //blog.paciellogroup.com/2010/11/using-the-html-title-attribute/
HTML 5.1包括使用title属性的一般build议:
当前不鼓励依赖标题属性,因为许多用户代理不按照本规范的要求以可访问的方式公开属性(例如,需要诸如鼠标之类的指示设备来引起工具提示,从而排除仅键盘用户和只有触摸的用户,比如拥有现代手机或平板电脑的任何人)。
资料来源: http : //www.w3.org/html/wg/drafts/html/master/dom.html#the-title-attribute
当涉及到可访问性和不同的屏幕阅读器时:
- 大白鲨10-11:默认closures
- Window-Eyes 7.02:默认打开
- NVDA:不支持(不支持选项)
- VoiceOver:不支持(不支持选项)
因此,正如丹尼斯·布德罗 ( Denis Boudreau)所说的那样: 显然不是推荐的做法 。