网站品质.docx
《网站品质.docx》由会员分享,可在线阅读,更多相关《网站品质.docx(12页珍藏版)》请在冰豆网上搜索。
网站品质
网站品质
在本教程中,您将学到如何将您的网站质量提升至最高。
您将学习使用最新的WEB标准。
您还将学习如何使网站的易用性更强、更易读。
内容目录
网站品质-标准
本章内容:
最重要的质量标准。
网站品质-HTML元素
本章内容:
最重要的HTML元素。
网站品质-样式表
本章内容:
最重要的CSS元素。
网站品质-可读性
本章内容:
如何确保站点内容更易读。
网站品质-易用性
本章内容:
如何确保您的网页对于大多数用户和浏览器具有更强的易用性和适用性。
网站品质-国际化
本章内容:
关于国际化的不同的品质问题。
Web品质-标准
根据web标准编写您的页面有助于改善您的网站品质。
HTML标准
XHTML是最新的HTML标准,是用XML重新表达的HTML4.01。
根据HTML4.01编写页面可使您的站点尽可能地接近XHTML标准。
阅读更多有关XHTML的内容。
CSS标准
对于高品质的站点来说,使用层叠样式表(CSS)是将内容与样式分离的首选方式。
通过使用CSS,您能够在一个单独的文档中存储有关页面样式的所有信息。
所有现代的web浏览器均支持CSS1和CSS2标准。
对于不同的浏览器,使用CSS都可以改进网站的品质,并提高可读性。
同时还可以极大地减少您的网站开发成本。
阅读更多关于CSS的内容。
Web验证
web验证工具是一种软件程序,可根据web标准对您的网站进行检查。
当您使用验证工具检查过HTML,XHTML或CSS文档之后,验证器就会根据您选择的标准返回一系列所发现的错误。
通常,验证器会返回所发现错误的行号。
请确保你在发布页面前进行验证成为一种习惯。
阅读更多关于页面验证的内容。
WAI-WebAccessibilityInitiative
WAI指的是"WebAccessibilityInitiative",是由W3C发起的。
WAI协调全球的组织通过六项主要的工作领域来提升因特网的可用性:
技术、指导方针、工具、教育、研究以及开发。
您能够通过根据WAI的指导方针编写的页面,来改善网站的品质,并使得您的站点可用于更多人群(及浏览器)。
您将在本教程稍后的章节学习更多有关WAI的内容。
Web品质-重要的HTML元素
∙PreviousPage
∙NextPage
对于提升web品质,、以及都是重要的标签。
元素
Doctypemeansa"documenttypedeclaration"(DTD).
所有的HTML和XHTML页面都应当使用元素来定义遵照何种HTML版本。
doctype定义了您正在使用的HTML版本,并为浏览器提供重要的信息以便其更快速一致地呈现您的页面。
文档类型声明同时也使验证软件可以对页面的语法进行检查:
HTML4.01Strict,Transitional,Frameset
DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01//EN"
"http:
//www.w3.org/TR/html4/strict.dtd">
DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN"
"http:
//www.w3.org/TR/html4/loose.dtd">
DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Frameset//EN"
"http:
//www.w3.org/TR/html4/frameset.dtd">
XHTML1.0Strict,Transitional,Frameset
DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Strict//EN"
"http:
//www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN"
"http:
//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Frameset//EN"
"http:
//www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
XHTML1.1DTD
DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.1//EN"
"http:
//www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
参阅:
HTML
DOCTYPE>标签
元素元素是最重要的HTML元素之一。它的主要功能是描述网页的内容。
即使标题不是网页的一个可见的部分,它对于提升网站的品质依然是重要的,这是因为它在以下位置都是可见的:
∙搜索引擎列表
∙窗口的标题栏
∙用户的书签中
标题应当尽可能地短,并具有可描述性。
当某个用户在internet上搜索网站时,大部分搜索引擎都会在搜索结果中显示出网站的标题。
请确保标题与网页的内容是吻合的。
这样的话用户有更多的可能通过点击这些链接来访问到你的网站。
当用户访问您的网站时,在窗口的标题栏中标题是可见的。
请确保即使窗口被最小化,标题同样能起到描述网站内容的作用。
在用户访问你的网站之后,网页的标题会存储于历史文件夹(用户甚至会把网页收藏到他的收藏夹中)。
为了后续的成功访问,同样请确保标题可以清楚地描述您的网站。
优秀的标题:
HTML教程XML简介差劲的标题:
简介章节1W3School拥有一整套组织良好、易于理解的HTML、CSS、JavaScript、DHTML、XML、XHTML、WAP、ASP、SQL教程,并包含非常多实例和源代码。
参阅:
HTML
标签元素
元素用来描述网页中最上层的标题。
由于一些浏览器会默认地把
元素显示为很大的字体,因此会有一些web开发者使用元素代替元素来显示最上层的标题。
这样做不会对读者产生影响,但会使那些试图“理解网页结构”的搜索引擎和其他软件感到迷惑。
请确保把
用于最顶层的标题,和用于较低的层级。
可以试着根据此模版来构造您的网页:
如果您不喜欢默认的标题字体尺寸,可以使用样式或样式表来改变。
参阅:
HTML
-标签
Web品质-样式表
∙PreviousPage
∙NextPage
使用样式表对于提升网页品质至关重要。
请勿使用font标签
应使用CSS来设置显示网页上的字体尺寸。
请不要使用font标签。
使用标签会增加文档的规模,而且使您每次改变标准文字尺寸的工作成为一场梦魇。
请设想一下下面的情况:
一天您决定修改网站中所有标题的颜色和尺寸。
通过CSS,您只需要修改一行就可以做到这一点。
假如您使用了标签,那么您需要把网站中所有页面的所有标题都修改一遍。
使用样式替代标签可使我们更轻松地为网页制作高质量的界面。
请勿使用固定的字体尺寸
不要使用固定的尺寸值。
请始终使用相对的尺寸值。
这项建议最重要的理由是无法通过浏览器重新调整固定尺寸的大小。
您的访问者会使用不同的设备(显示器)、不同的浏览环境(光线)以及可能的残疾(弱视)。
例如,可以把某人的文字尺寸设置为100%(或者medium),主标题设置为140%(或者x-large),而次级的标题设置为120%(或者large),这样用户就可以使用浏览器来重新设定最喜欢的尺寸了。
通过调整网页的文本尺寸的功能,也可以改变打印页面的文字数目。
请勿使用很小的默认字体尺寸
一些网站会使用很小的文字尺寸,这样就可以向每张页面“塞”入更多的内容,或者使页面看上去更“时髦”。
再次重申,使用不同的设备(显示器)、不同的浏览环境(光线)以及可能的残疾(弱视),都可能对用户造成阅读障碍。
请不要逼迫用户每次访问你的站点时都要放大文本的尺寸。
始终使用一致的背景颜色
大部分网页都会为不同的文本元素使用颜色。
标题和链接的颜色通常与正文的文本颜色是不同的。
作为一位web设计者,您应当意识到的事实是,您的访问者能够修改默认的颜色选项。
如果您为web元素定义了颜色,那么同样应当定义背景颜色。
如果不定义背景颜色,那么您的网站可能会被糟糕的颜色组合搞砸(比如红色背景上面的亮红文字,或者深色文本搭配的深色背景)。
如果您不规定背景颜色,可能会使文本很难被识别。
Web品质-可读性
正确使用字体和颜色可使您的网站更易阅读。
留意颜色的对比
对于视力不太好的人或者对于不太好的显示设备来说,黑地白字或者白底黑字是最佳的。
在亮色背景上的灰色文字,对比度是很差的:
在暗色背景上的灰色文字,其对比度同样很差:
某些搭配-比如黑色和红色,黑色和蓝色,黄色和绿色-都会使人产生视觉疲劳:
这些搭配还是不错的:
留意字母的间距
对于视力比较弱的读者,比较近的字母间距会带有不小的阅读困难。
字母间距适中的文本就比较容易阅读了。
留意行间距
适中的行间距易于阅读,反之,行间距太小则难以阅读:
避免奇特的字体
本文中的字体是很适合阅读的。
但是下面的字体就不同了:
尽量少用斜体
普通字体易于阅读。
斜体字往往难以阅读。
Web品质-易用性(WAI)
能够被残障人士使用的网站才能称得上一个易用的(易访问的)网站。
残障人士指的是那些带有残疾或者身体不健康的用户。
WebAccessibilityInitiative-WAI
WAI(由W3C在1997年发起)是一系列计划供web开发者、创作者以及设计者使用的指导方针-关于如何使内容对残障人士更易用。
这些指导方针的目标是易用性(accessibility),但是也有助于使web内容可用于更多的浏览器(语音浏览器、移动电话、手持设备),以及更多工作于困难环境的用户(非手持式的、强光、黑暗、弱视、噪音等)。
WAI对您的网站来说很重要吗?
是的。
每天都有百万计的残障人士在网上冲浪,并且甚至超过百万计的人们正在使用着不良的浏览器设备,或者工作在困难的环境当中。
假如您的网站缺乏诸如可调节字体尺寸、带有文本描述的图形以及便捷的导航,那些人们就无法访问您的信息。
事实上:
您的网站剥夺了这些人的权利。
增强网站易用性的理由还有:
∙可提升网站的美誉度和形象
∙可提升户满意度
∙可增加访问者的数量
∙可增加访问者在站点的停留时间
∙可增加访问者的回访数量
∙可同样为无残疾人士增加可用性
∙可为关闭图形功能的访问者增加可用性
∙可为使用老式设备的人群增加可用性
∙可使您的网站为增长速度最快的人群提供服务:
老年人群
使用可调节的字体尺寸
请使用相对的字体尺寸,这样用户就能够使用浏览器菜单来改变默认的字体尺寸。
使用"alt"属性
alt属性允许你为图像(也可以为其它的元素)提供一条相对应的文字。
实例:
有时候浏览器会无法显示图像。
具体的原因有:
∙用户关闭了图像显示
∙浏览器是不支持图形显示的迷你浏览器
∙浏览器是语音浏览器(供盲人和弱视人群使用)
如果您使用了alt属性,那么浏览器至少可以显示或读出有关图像的描述。
Web品质-国际化
网络无国界。
网络无国界
WiththeInternetfollowsanabsoluterequirementtointerchangedatainamultiplicityoflanguages,whichinturnutilizeabewilderingnumberofcharacters.
---H.Alvestrand,Internet工程工作小组(IETF),1998年1月。
国际字符集
所有的W3C标准(自从1996年),包括HTML、XHTML和XML都定义了一个名为Unicode(ISO10646)内部的内部字符集。
所有现代web浏览器都在原生地使用此字符集。
而大多数在internet上传输的文档并没有使用这个Unicode字符集。
正因如此,Internet客户(浏览器)与Internet服务器之间必须有一种在通信中一致使用字符集的方法。
对每个文档在用的字符集进行标记,对于提升网站的品质来说至关重要。
请始终在
元素内使用下面的的元元素:
把X替换为你所使用的字符集,比如ISO-8859-1、UTF-8或者UTF-16。
国际日期
请不要使用类似"04-03-02"的日期格式。
上面的日期可以表示为2004年3月2日,或者2002年3月4日,亦或者2002年4月3日。
国际标准化(ISO)为日期定义的国际标准格式是"yyyy-mm-dd",yyyy是年,mm是月,dd是日。
如果您使用了ISO的格式,那么大多数访问者都能明白你的日期。