当前位置: 首页 > 网站动态网站动态

网页标准化设计在网站建设中的研究与应用经验分析

来源:沈阳志鼎科技 2018-09-30 访问量:72

1 概述

1.1 定义

Web标准是引导网站建设和实践的主要操作方法,主要由网页设计技术规范、设计原理内容及网站设计各方面定义等组成,给人们提供了网页设计参考。从Web特点上分析,网页标准与内容规范具有一致性,不仅可以指导万维网,还可以将部分内容扩展到互联网,对网络服务器管理与设计等内容均产生了巨大影响。经过分析发现,网页标准主要由网页开发工具、习惯用法、厂商独有技术及非标准、标准发布等因素组成。网络标准化设计的核心就是区分网页与文档。网页一般从美学角度上给人们呈现较强的内容,可以实现文档内容向美学的扩展,满足了广大读者群体的实际需求,由文档结构、行为与表现等内容组成。结构式语言标准主要由HTML和XML组成,表现语言为CSS,行为标准包含了用户模型。

1.2 网页标准化设计使用的优势

第一,从使用者角度分析。网页标准化设计符合使用者的使用习惯,设计出的网站更加方便快捷,而且操作速度较快。简而言之,Web标准设计的网页是标准的原始结构,可以方便用户进行相关信息的搜索,而且可以及时对相关信息进行评估,索引较准确。网页良好的标准就是是否缺少CSS的支持,同时可有序的展示信息,给用户提供较多的便利,能够使用不同设备进行操作。

第二,对使用者而言比较高效。Web标准化实现了内容与样式的分离,可以多次使用一个设计,而且必须要重新代码,减少了不必要代码的冗余,提高了网站开发速度。同时网页标准化还可以实现脚本复用操作,此种操作方式不仅减少了工作量,同时还减轻了维护成本,只需结合网站建设需求,对某处代码进行改变即可得到理想的网站效果。

第三,从服务器角度分析,降低了服务器成本。随着内容、行为与表现的分离,实现了CSS样式多次复用操作,减少了市场固定网站设计编辑器产生的冗余代码问题,尤其是将其应用到大型网站建设中,可以调用CSS样式表。用户首次访问网页时可以单独调用一个CSS样式表,进而将CSS样式保存在本地缓存中,可以利用访问调用方式使用该样式网页,进而方便了本地读取操作。同时节省了大量的带宽,减轻了硬件处理任务量和服务器负荷,实际应用质量较高,延长了服务器使用寿命。

2 网页标准化设计在网站建设中的具体应用

2.1 使用正确的结构化标记

进行网站建设的基础性工作就是从网页本质精确定义HTML。网页就是使用特定结构利用一定内容组成的页面,可以供浏览者浏览,因此只有规范数学,HTML才能建设高质量的网站。第一,合理选择 。添加合理的 ,说明XHTML或使用HTML的版本,然后,浏览器可根据版本定义文档类型及页面代码。经过分析,XHTML1.0主要由框架型、过渡型及严格型组成,一般过渡型较容易被人们接受。 在Web标准网页设计中具有很大作用,只有确定正确的文档类型,才能正常的解析并打开,进而完整详细的呈现网页内容。第二,设定空间名称。在建设网站的时候,需要给文档拟定一个合理的编辑,提醒该文档的所属者,例如代码。第三,合理设置文档元信息。合理设计文档元信息可以精确的描述网页内容,并给其配置name属性,设定描述网页的关键词,进而方便用户的搜索。一般设计时,可以实现文件头http-equov属性与content的结合,然后构建网页语言与编码信息。

2.2 采用CSS设计网页的具体应用

CSS表示层叠样式表单,是一种表现XML或HTML文件样式的计算机语言。第一,CSS语法。CSS规则主要由一条或多条声明及选择器构成,每条声明中均由一个值与属性组成。例如,h2{color:green;font-size:12px;},此例子中,表示将h2单元中的文字颜色定义为绿色,将字体设置为12像素。h2表示选择器,font-size与color均为属性,green和12px表示值。第二,CSS选择器。CSS选择器主要由类选择器、标签选择器等组成,进行实际设计时,可以结合需求合理选择,养成良好的编程习惯。经过分析发现,很多设计人员选用选择器时,要将全部区域划分为若干个Div,然后结合需求,选择ID选择器和Div样式,此种操作不符合编程习惯,而且会出现很多问题。在实际编辑中,必须区分ID选择器与类选择器,为了所有文档XHTML标签均为CSS样式,在操作中不能重复使用ID选择器。如果选择XHTML文档时使用了ID选择器,就会将CSS样式指定给特定的标签。第三,目前在科学技术的带动下,智能手机和平板电脑逐渐普及,给用户提供了多种类别的浏览器。但是由于不同浏览器对web标准的默认值不同,因此,在编辑或创建CSS时,可以使用Adobe Dream weaver中的测试工具,对不同浏览器的兼容性进行测试。同时还要合理使用Css Hsck,根据不同浏览器的特点,书写各种样式的CSS,进而符合不同浏览器的浏览需求,满足用户需求。

2.3 使用DIV+CSS方法进行页面布局

传统HTML代码编写中,主要利用表格完成页面布局。实际设计时,为了营造较强的页面布局效果,会嵌套大量的表格,因此导致HTML文档结构较混乱,这种大量操作不仅让文档中含有较多的表格,而且页面节数不断增加,将页面与表格杂糅在一起。随着Web的出现,将标签原始的语义,让其布局不再局限于页面,可以使用DIV+CSS方法操作。


3 Web标准化设计中容易出现的问题

第一,DIV+CSS为Web标准。此种问题在实际设计中很容易被人们误解,实际上DIV+CSS只是进行网站编写的一种技术手段,但不能涵盖所有Web标准。Web标准不仅可实现HTML到XHTML的转变,而且结构较清晰,实现了内容的分离,但DIV+CSS仅仅可实现此种思想。实际分析可以发现,较多符合标准页面要求的设计均使用DIV+CSS制作。

第二,Web标准不使用表格。实现Web标准并不是不使用

标签,只是实际便捷中提倡使用DIV+CSS替代传统的
,实际上
标签也是XHTML1.0中的标准化标签。使用
布局的主要缺陷是将表格与内容杂糅在一起,不利于内容的充分使用,而且从语义角度分析,W3C制作
时,仅仅将其作为表格定义,文档中如果有表格,可以使用
标签,但定位与排版等操作均由CSS独立完成。


第三,将通过验证作为网页设计的主要目的。为了规范Web标准的推广应用,W3W官方网站中给予了代码效验操作,可以了解设计网页是否符合Web标准。但是,需要注意的是,W3W效验的提供,仅仅可以帮助更多的网站设计者及时对XHTML代码的书写规范程度进行分析,CSS属于CSS2范畴。代码标准只是实现网页标准化的基础,并不能表示实现了标准化。通常设计完成后,还要从网页结构、多种设备及浏览速度等了解网页设计的目的。

客服
客服