基于Web标准的网站前台设计.docxVIP

基于Web标准的网站前台设计 　　摘要：随着社会和网络技术的发展，对网站前台的设计与制作也越来越多。文章论述了符合网站前台制作的Web标准，并从Web标准出发，通过HTML代码实现网站前台的内容和结构，通过CSS代码实现相关内容的样式，通过JavaScript代码实现页面的动态效果，以一个真实案例说明了对网站前台的制作实现过程，体现了Web标准的优势。　　关键词：网站前台；Web标准；HTML；CSS　　中图分类号：TP37 文献标识码：A 文章编号：1009--0191-02　　Abstract：With the development of society and Network， the design and implementation of the front end website is increasing. The paper discusses the Web standard met the design and implementation of the front end website. Proceed from the Web standard，the content and structure of the front end website are realized by means of HTML code； the style of the interrelated content is realized by means of CSS code； the dynamic effect is realized by means of JavaScript code. The implementation process of the front end website is explained using a true case. The advantage on Web standard is showed.　　Key words：front end website； Web standard； HTML； CSS　　1 概述　　而网站前台是指展现给访问者的所有页面，是面向网站访问用户而言，通俗的说也就是给访问网站的人看的内容和页面，用户可以通过对网站前台的访问来浏览公开发布的内容，如企业或公司概况介绍、新闻信息、产品信息、企业联系方式、提交留言等内容。近年来，随着社会和网络的发展，网站前台制作的需求越来越大，所以网站前台的实现问题也越来越重要。　　对于简单的网站前台的制作，网页部分的内容实现可以通过Dreamweaver软件的可视化视图方式来实现，但是这种实现方式存在着很多问题，比如在预览网页时网页元素会出现错位、不能灵活地控制网页元素的样式等方面的问题等。　　2 Web标准　　随着科技的发展，在越来越开放的环境中，各个相互关联的事物要能够协同工作，就必须遵守一些共同的标准来工作。“Web标准”也是互联网领域中的标准，但它并不是一个标准，而是一系列标准的集合。而网页的相关技术走入实用阶段仅短短十几年的时间，就发生了很多重要的变化，其中最重要的一点是“Web标准”这一理念被广泛地接受。　　网页的构成主要由三部分：结构、表现和行为。对应的标准也分三方面：结构化标准语言主要包括XHTML和XML，表现标准语言主要包括CSS，行为标准主要包括JavaScript等。在这三部分中，决定了XHTML和XML来实现网页的结构和内容，CSS实现网页的表现样式，JavaScript来控制网页的行为。而且这三部分被明确后，产生了一个重要的思想，那就是三者的分离，这样会对网页的制作带来很大好处。比如在确定网页内容的情况下，如果只想改变内容的表现形式，那就无需改变HTML代码，只需改变CSS代码即可，这样可以随时在不改变HTML结构的情况下来修改网页的样式。所以在网站前台的实现过程中，借助相关的软件平台，遵循Web标准来书写HTML和CSS代码实现页面的内容和样式，是一种好的选择。　　3 整体设计思路　　在进行网站前台的制作之前，首先要了解客户需求，明确客户做网站的目的，及客户的业务方向，根据客户的要求及其要实现的功能等，确定界面的色调与布局等。其次，根据这些需求，设计网站的首页，用Photoshop先设计大致的首页界面。制作出首页的页面图后，跟客户进行第二次沟通，征求客户对页面效果图的意见，并按沟通结果进行修改，直到客户满意为止。第三，在客户对首页设计效果图满意的情况下，开始切片，完成对图片的整理。第四，按照Web标准，书写代码，包括使用HTML、DIV+CSS、JavaScript等完成前台界面的内容结构及其样式。实现子页时，也要跟客户做简单沟通，如果没有特别要求，要跟首页的风格一