HTML教程:title属性与alt属性

所属分类: HTML/Xhtml / 网页制作 阅读数: 1829
收藏 0 赞 0 分享

XHTML是CSS布局的基础,jb51.net一直强调XHTML知识的学习,重视语义和文档的结构。title 和alt 属性,给我最直观的感受就是,可以提高文档的适应性,并合理提高关键词密度。在XHTML标准里,图片的alt 属性是必须的。
  XHTML是CSS布局的基础,jb51.net一直强调XHTML知识的学习,重视语义和文档的结构。title 和alt 属性,给我最直观的感受就是,可以提高文档的适应性,并合理提高关键词密度。在XHTML标准里,图片的alt 属性是必须的。
alt属性
  为不能显示图像、窗体或applets的用户代理(UA),alt属性用来指定替换文字。替换文字的语言由lang属性指定。Alt属性(注意是“属性”而不是“标签”)包括替换说明,对于图像和图像热点是必须的。它只能用在img、area和input元素中(包括applet元素)。对于input元素,alt属性意在用来替换提交按钮的图片。
  比如:使用alt属性是为了给那些不能看到你文档中图像的浏览者提供文字说明。这包括那些使用本来就不支持图像显示或者图像显示被关闭的浏览器的用户,视觉障碍的用户和使用屏幕阅读器的用户。替换文字是用来替代图像而不是提供额外说明文字的。
  在写替换文字前仔细想想,保证那些文字确实为那些看不到图像的人提供了说明信息,并且在上下文中有意义。对于那些装饰性的图片可以使用空的值(alt="",引号中间没有空格),而不是使用不相关的替换文字比如“blue bullet”或者“spacer.gif”。不要忽略它,如果你忽略了,那么一些屏幕阅读器会直接阅读图像文件的文件名,那些文字浏览器,比如Lynx会显示图像文件的文件名,而那对于你的浏览者就没什么用了。
  包含文字的图像图片设置替换文字是最简单的,图像中包含的文字一般来说就可以作为alt属性值。
title属性
  title属性为设置该属性的元素提供建议性的信息。
  title属性可以用在除了base,basefont,head,html,meta,param,script和title之外的所有标签。但是并不是必须的。可能这正是为什么很多人不明白何时使用它。
  使用title属性提供非本质的额外信息。大部分的可视化浏览器在鼠标悬浮在特定元素上时显示title文字为提示信息(tool tip),然而这又由制造商来决定如何渲染title文字。一些浏览器会将title文字显示在状态栏里。比如早期版本的Safari浏览器。
  title属性有一个很好的用途,即为链接添加描述性文字,特别是当连接本身并不是十分清楚的表达了链接的目的。这样就使得访问者知道那些链接将会带他们到什么地方,他们就不会加载一个可能完全不感兴趣的页面。另外一个潜在的应用就是为图像提供额外的说明信息,比如日期或者其他非本质的信息。
  title属性值可以比alt属性值设置的更长。不过要注意的是,有些浏览器会截断过长的文字(比如工具提示或其他)。比如Mozilla核心的浏览器只能显示最先的60个字符。这被认为是一个Mozilla bug,这是你要注意的。
更多精彩内容其他人还在看

浅析响应式框架中,table表头自动换行的快速解决方法

最近在用bootstrap开发网站,在处理一张table的时候发现,通过PC端查看样式正常,在手机上查看时,因为屏幕小,表格被压缩的厉害,表头和数据变形如下图后来网上找了一下,发现一个好用的CSS属性,加上就可以解决该问题   在此记录一下。以上这篇浅析响应式... 查看详情
收藏 0 赞 0 分享

几个老式播放器的嵌入代码

我们在网页上看到的播放器无外乎WMP/RealPlayer/Flash Player,其他的无非是面板不同,或者添加了其他控件,对于计算机上安装的一些播放器也都是编码和解码器的整合,其最核心的编码和解码技术是相同的。例如:网络上最流行的windows media流(asf,wma... 查看详情
收藏 0 赞 0 分享

深度剖析HTML的语意和与其相关的前端框架

关于语义语义研究的是标志与符号之间的关系,以及它们所代表的意义。在语言学中,它主要是研究这些标志(如单词,短语,或者声音)在语言中的意义。而在前端开发领域,语义主要涉及的是HTML元素、属性和属性值(包括像Microdata这样的扩展)所约定的意义。这些在规范中常用的正式约定语义... 查看详情
收藏 0 赞 0 分享

HTML表格布局实际使用详解

什么时候会用到表格现在,表格<table>一般不再用于网页整体的布局。不过,在面对某些特定的设计,如表单输入、数据呈现时,表格则可能是最恰当的选择。关于表格的直观印象,就是由多个单元格(cell)整齐排列而成的元素,可以明确看出行(row)和列(column)。这可以... 查看详情
收藏 0 赞 0 分享

详解HTML编程的标记与文档结构

    用HTML标记内容的目的是为了赋予网页语义(semantic)。换句话说,就是要给你的网页内容赋予某些用户代理(user agent)能够理解的含义。    HTML 规定了一组标签,用来给内容打上不同的标记。每... 查看详情
收藏 0 赞 0 分享

详解HTML的<input> 标签及其禁用方法

定义和用法<input> 标签用于搜集用户信息。根据不同的 type 属性值,输入字段拥有很多种形式。输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。HTML 与 XHTML 之间的差异在 HTML 中,<input> 标签没有结束标... 查看详情
收藏 0 赞 0 分享

HTML中rel属性分析

由于发现有同学在微博转播和收藏这篇文章,所以回头来再审视下这篇随性翻译的文章,后来发现w3cschools.com.cn已经有了对照的中文译文,所以这里我就继续完善下这篇文章吧,让它显得更有价值点。最初想到翻译这篇文档源于http://vanessa.b3log.org/rese... 查看详情
收藏 0 赞 0 分享

详解HTML的style标签以及相关的CSS引用

 HTML style 标签style 标签 -- 在文档中声明样式时使用此标签style标签是成对出现的,以<style>开始,以</style>结束属性media -- 媒体类型,type -- 包含内容的类型,一般使用type="... 查看详情
收藏 0 赞 0 分享

HTML与XHTML、以及HTML4与HTML5标签之间的区别简介

HTML与XHTML区别1、XHTML元素必须被正确地嵌套2、XHTML 元素必须被关闭,空标签也必须被关闭。如<br/>3、XHTML 元素必须小写4、XHTML 文档必须拥有一个根元素5、XHTML属性名称必须小写,属性值必须加引号,属性不能简写。如:<in... 查看详情
收藏 0 赞 0 分享

Nofollow标签的写法以及nofollow使用介绍

“nofollow” 标签是Google、Yahoo和微软公司前几年一起提出的一个标签,链接加上这个标签后就不会被计算权值,搜索引擎支持nofollow属性,在很大程度上抑制博客或论坛的垃圾留言。对站长来说是一件大好事。 nofollow是HTM... 查看详情
收藏 0 赞 0 分享
查看更多