合理的设计Title的可用性


来源:未知 作者: 日期:2009-11-23 Tag: 可用 设计 合理 title 标签 说明 缩写 可以 abb

最早大家都没有给链接加title的习惯,后来因为w3c标准普及,又集体加上了title。从一个极端走到另个极端,于是出现很多怪异现象。两方面,第一a标签内title不是必须使用,第二title可以用在除了base, basefont, head, html, meta, param, script和title之外的所有标签。

抛开标签语义、搜索引擎友好等因素,在纯用户角度找几个场景来分析。

列表内容被截断后通过title显示完整,此时如果没有被截的链接,也会被再显示出来。试想本来已经看清楚的信息,触发又提示一遍,传达是不是感觉很婆妈。如果没有截的链接控制不输出title,效果或许合理很多。或者title在此时根本就不应该?印象中英文好站似乎很少做列表截取。

合理的设计Title的可用性,PS教程,思缘教程网

最典型类似对icon图示的辅助说明,可以最大化平衡界面复杂度与可操作性。并且针对某些群众认知度比较高的操作,如果图形传达到位,完全可以使用icon代替,更多交互场景请参考臭鱼在06年完成文字还是图标的总结。

合理的设计Title的可用性,PS教程,思缘教程网

合理的设计Title的可用性,PS教程,思缘教程网

在导航系统的各条目中,title主要作用是做补充说明。同时也对应可访问性原则中,要求导航传达清晰简洁的建议。用户感兴趣后操作触发,再title提示更多详细,强调信息引导而不是推送。

合理的设计Title的可用性,PS教程,思缘教程网

合理的设计Title的可用性,PS教程,思缘教程网

还有种做目地指引之用的案例,明确告知用户这个链接做什么?到哪里?在某些容易引起误会,或者不是很清晰的地方效果比较好。另外title不在a标签内也有广泛应用,典型如表单。可以为用户提供更精准、得体的操作指引,并且我想一定程度上可以代替明文提示。

合理的设计Title的可用性,PS教程,思缘教程网

合理的设计Title的可用性,PS教程,思缘教程网

合理的设计Title的可用性,PS教程,思缘教程网

学以致用,顺手给评论模板加了条语句。上次改的时候本想写出来,又感觉多余,现在好多了。准备动手评论的用户,自然会看到,并且这么土的语句也没有兼容性问题。

合理的设计Title的可用性,PS教程,思缘教程网

相应的不良应用不再图示举例,互联网上不胜枚举,深入分析语义和用法不仅能纠正错误、开拓思路,而且能贯通很多理论上的困惑。总结起来,title并不像seo从业者鼓吹的那么简单,在用户角度除避免与文字、图形重复传达,主要有三类用途:

描述非文本内容

补充说明文本内容

操作指引

前文主要纠正title用法上的几点误区,其实除链接和表单的常规标签用法。在内容组织方面还有大潜力待发掘,比如写网志经常会有针对词、短语说明的需求,最常见的做法是用括号,或者高级点用title来写。

其实这样也不彻底解决问题,在title做“补充说明文本内容”作用时,用括号的场景可能有解释、简写缩写、前后补充等等,这些人际功能产生的内容模糊机器不懂。如何区分并准确转化为机器语言?在讲究语义化的HTML标准里,有更恰当的标签来做这些工作。

简写缩写说明

HTML4.01中分别有<abbr>与<acronym>两个标签来表示缩写,区别在于<acronym>是英文首字母缩写,<abbr>是名称缩写。应用分别如下:
<acronym title="Portable Document Format">PDF</acronym>
<abbr title="Minimum">Min</abbr>

但在HTML5.0与XHTML2.0中,<acronym>变成不赞成使用的标签,而推荐<abbr>代替。因为<acronym>容易与<abbr>混淆,它们用法之间是互相包含的关系,很多英文名称缩写其实就是首字母缩写,比如CSS的全称是Cascading Style Sheets。“千鸟,是一叶千鸟的简称。”这句话如果用代码来阐述:
<abbr title="一叶千鸟">千鸟</abbr>

专业术语说明

针对不同知识领域读者时,有时会大量用到专业术语或特殊短语,但不属于简写、缩写范畴。这时可以使用HTML提供的<dfn>标签,比如:
<dfn title="Mozilla公司推出的网页浏览器">Firefox</dfn>
<dfn title="Microsoft web browser">Internet Explorer</dfn>

W3C不建议大量使用,当首次出现新术语时,应定义样式与普通文本分开,促进读者理解,而从那以后也不需要再对此术语进行标记了。道理类似不要重复在一篇内容内,做多个同样链接。

按照这个思路,我觉得HTML应该提供个叫做<translate>的标签,用以针对翻译词汇的说明。尤其在专业技术领域,外来词汇特别多。比如,要解释UCD的全称(User-Center Design)可以用<abbr>,但中文翻译(以用户为中心的设计)呢?老用括号太不专业了。#p#分页标题#e#

相关推荐