Answers:
我都去。标题将在所有浏览器中显示一个不错的工具提示,而alt将在没有图像的浏览器中进行描述。
就是说,我很想看看去“商店”浏览商品的“购买者”数量的统计数据实际上是关闭了图像,或者正在使用不支持图像的浏览器。我认为90%的人口正在使用28k调制解调器连接到InterWeb的时代已经过去了。
它们用于不同的事物。使用该alt
属性代替图像。如果无法显示图像,请在屏幕阅读器中显示。
该title
属性与图像一起显示,通常作为悬停工具提示。
一个不应被“代替”另一个使用。每个人都应该使用正确,做他们的目的是做的事情。
<img>
标签-您应改用CSS样式的div;)
我相信alt是严格遵守XHTML所必需的。
正如其他人指出的那样,标题是为工具提示(很不错),而alt是可访问性。两者都没错,但是alt应该一直存在。
的alt
属性是在一组标签(即,定义img
,area
和可选地用于input
和applet
),以允许你提供一个等效的文本为对象。
在以下常见情况下,等效的文本为您的网站及其访问者带来以下好处:
该技术的目的是在用户通过在title
属性中提供帮助信息以形式输入数据时为他们提供上下文相关的帮助。帮助可以包括格式信息或输入示例。
示例1:限制搜索范围的
下拉菜单搜索表单使用下拉菜单限制搜索范围。下拉菜单紧邻用于输入搜索词的文本字段。对于可以看到外观设计的用户来说,搜索字段和下拉菜单之间的关系很清楚,因为外观设计没有空间放置可见标签。该title
属性用于标识select
菜单。该title
属性可以由屏幕阅读器说出或显示为使用屏幕放大镜的人的工具提示。
<label for="searchTerm">Search for:</label>
<input id="searchTerm" type="text" size="30" value="" name="searchTerm">
<select title="Search in" id="scope">
...
</select>
示例2:电话号码的输入字段
网页包含用于在美国输入电话号码的控件,其中三个字段用于区号,交换和最后四位数字。
<fieldset>
<legend>Phone number</legend>
<input id="areaCode" name="areaCode" title="Area Code" type="text" size="3" value="" >
<input id="exchange" name="exchange" title="First three digits of phone number" type="text" size="3" value="" >
<input id="lastDigits" name="lastDigits" title="Last four digits of phone number" type="text" size="4" value="" >
</fieldset>
示例3:搜索功能
网页包含一个文本字段,用户可以在其中输入搜索词以及一个标有“搜索”的按钮以执行搜索。该title
属性用于标识表单控件,并且按钮位于文本字段之后,因此用户可以清楚地看到应在其中输入搜索词的文本字段。
<input type="text" title="Type search term here"/> <input type="submit" value="Search"/>
示例4:表单控件
的数据表表单控件的数据表需要将每个控件与该单元格的列标题和行标题相关联。如果没有标题(或屏幕外的标签),则非可视用户很难在浏览表格时使用其辅助技术来暂停和询问相应的行/列标题值。
例如,调查表的第一行有四个列标题:“问题”,“同意”,“不确定”,“不同意”。接下来的每一行在每个单元格中包含一个问题和一个单选按钮,与三列中的答案选择相对应。每个单选按钮的title属性是答案选项(列标题)和问题文本(行标题)的连接,以连字符或冒号作为分隔符。
在MDN中提到的允许的属性。
alt
crossorigin
decoding
height
importance
(实验性API)intrinsicsize
(实验性API)ismap
referrerpolicy
(实验性API)src
srcset
width
usemap
如您所见,元素title
内部不允许使用属性img
。我会使用alt
属性,如果需要的话,我会使用CSS(例如:伪类:hover
)代替title
属性。
ASP.NET MVC的MVCFutures决定同时做这两项。实际上,如果您提供“ alt”,它将自动为您创建一个具有相同值的“ title”。
我没有要提供的源代码,但是经过快速的Google搜索就找到了一个测试用例!
[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属性的一般建议:
当前不鼓励依赖title属性,因为许多用户代理未按照本规范的要求以可访问的方式公开该属性(例如,要求使用诸如鼠标之类的指示设备来显示工具提示,这不包括纯键盘用户和仅限触摸用户(例如拥有现代手机或平板电脑的用户)。
来源: http : //www.w3.org/html/wg/drafts/html/master/dom.html#the-title-attribute
关于辅助功能和不同的屏幕阅读器:
因此,正如丹尼斯·布德罗(Denis Boudreau)所言:显然不建议这样做。