论文部分内容阅读
摘要：目前使用的网页制作教科书，没有明确的网页设计规范。学生制作出来的网页存在许多问题，产生大量的冗余代码，增加整个网站的容量，使得网页的下载和上传速度变慢。本文通过对网页设计中的建站、表格及布局、HTML语言编写、Script脚本应用、CSS特效应用以及多媒体应用规范等的分析，探讨网页制作教学中的规范。
关键词：网页设计；教学；规范
前言
网络技术的发展突飞猛进，网页已成为当今生活中必不可少的元素，其可操作性、互动性、艺术性等给人们带来了方便和享受。网页是否被人们所接受，关键在于设计者的设计理念和艺术修养。设计理念又体现在规范上，这决定了网页浏览时的美观、下载以及上传速度。网页制作规范有很多，下面就此和大家进行探讨。
站点建立规范
对一个网站的评价，可以从站点建立规范去考察。建站不规范对网站以后的维护、更新带来困难，造成网站维护成本增加、维护周期延长，需要重新投入大量的人力、资金重编。所以我在教学和实训中严格要求学生按以下规范建立网页站点：①站点存放。站点存放是没有严格指定的，一般不存放在系统盘，统一存放在一个文件夹中。网站中各元素的使用路径全部采用相对路径。②站点命名。可以使用中、英文命名，建议使用英文命名。如果英文水平不高，可以使用汉语拼音来替代，例如：“圣诞网站”可以命名为“ShengDan”或“sdwz”。③站内文件夹和文件的命名。站点根目录下只能存放一个主页文件（index）和三个基本文件夹——images、other、files，其他文件夹可以根据实际设计需要来命名。不管是主页文件还是文件夹，一律使用英文命名。
网页表格布局规范
常用的网页结构主要有T型、∏型、上下型、左右型和不定型等，不论哪种结构，浏览器在解释页面的元素时，都是以表格为单位逐一编译显示的。表格的嵌套层数越多，打开浏览网页的速度就越慢。
经过反复测试，表格嵌套一般在三层内为合理，并且应该尽量避免 ＜colspan＞ ＜rowspan＞两个标记。除非有特别需要或页面不大可以使用整个表格作为一个完整页面外，一般情况下，应该将一个网页分成若干个表格构成。基本可以分为四个表格，第一部分表格用于放置Logo和Banner之类的元素；第二部分表格放置导航按钮；第三部分表格放置正文内容；第四部分表格放置版权说明、联系方式、注册信息等。其中第三个表格根据正文的内容也可以分为多个表格，这样划分使用有以下的好处：①可以方便地将网页中某一部分（以一个表格为单位）转换为库元素或模板；②减少网页编辑中对表格的调整和制作时间，提高制作效率；③方便对某个内容的提取、复制、粘贴和对新增内容的插入。布局表格也是表格，且具有更好的可操作性，但与表格又有着不同的特性，应在实际应用中结合使用，灵活配合，这样制作网页时就能做到快速、效果好、省时。
HTML语言编写规范
网页其实是由HTML语言编写的。HTML语言在教科书里称为“超文本标记语言”。HTML语言熟练者可以在Dreamweaver、FrontPage等软件内在代码视窗下编写网页。一般网页制作者可在常用设计视窗里进行可视化制作，但有些操作是无法在常用编辑视窗里完成的，如添加动态效果、添加脚本语言或后期维护编辑等，必须在代码视窗里操作，这就对代码提出了要求。
1.编写格式规范。要求在编写HTML语言时使用规范的格式，每一个标记之间有层次感，便于查找错误、减少查找时间。
2.Html文件的通用模板。整个网站的开发风格要保持一致，为了便于研发和今后修改及维护，构建一个通用模板是必须的。①为了保证网站能够与下一代的web 语言xml 标准兼容，所有的HTML 标签的属性都要用单引号或者双引号括起，即我们应该写 ＜a href=“url”＞ 而不是 ＜a href=url＞。②允许全文检索的页面，为了使Internet上的搜索引擎能够有效检索，在频道的首页的html的＜head＞＜/head＞之间应该加入Keywords 和Description元标记，例如：＜meta name=“keywords”content= “圣诞 商品”＞、＜meta name=“description”content=“百度，全球中文搜索引擎”＞。③在写 ＜table＞ 互相嵌套时，严格按照规范，对于单独的一个＜table＞来说，＜table＞＜tr＞对齐，＜td＞缩进两个半角空格，＜td＞中如果还有嵌套的表格，＜table＞也缩进两个半角空格，如果＜td＞中没有任何嵌套的表格，＜/td＞结束标记应该与＜td＞处于同一行，不要换行，如我们注意在源代码中不应有这样的代码：＜td＞＜img src=“../images/sample.gif”＞...＜/td＞。而应该是这样的：＜td＞＜img src=“../images/sample.gif”＞＜/td＞。这是因为浏览器认为换行相当于一个半角空格，以上不规范的写法相当于无意中增加一个半角空格，如果确实有必要增加一个半角空格，也应该这样写：＜td＞＜img src=“../images/sample.gif”＞ ＜/td＞属于同一个级别的＜table＞一定是左首对齐的，另外不允许没有任何内容的空的单元格存在。④Width和height的写法也有统一的规范，一般情况下只有一列的表格，width写在＜table＞的标签内，只有一行的表格，height写在＜table＞的标签内，多行多列的表格，width和height写在第一行或者第一列的＜td＞标签内。总之遵循一条原则：不出现多于一个的控制同一个单元格大小的height和width， 保证任何一个width和height都是有效的。
Script脚本语言应用规范
Script脚本语言是一种在互联网上广为传播和使用的特效语言，具体有两种分类：Java Script和VB Script。现在浏览器都能对这两种语言规范进行编译，目前使用最广泛的是Java Script。脚本语言在网页中的应用体现出四大特点：简单性、动态性、跨平台性、节省CGI的交互时间，在网页制作中脚本主要应用的地方有：① ＜head＞和＜／head＞之间，主要应用在对标题、状态栏、页面脚本动态效果等；② ＜body＞中插入，用于定义网页背景颜色、字体定义、函数调用声明等；③＜body＞和＜／body＞之间，正文内容中的动态特效。这三个地方插入脚本和具体用法，要经过一段时间的练习指导，学生才能熟练地应用脚本。
CSS特效应用规范
CSS又称为层叠样表式，网页中使用能够简化网页的格式代码，不仅能加快下载显示速度，还能减少需要上传的代码数量和在网页编写过程中的重复工作，是现代网页制作的一项技术，也为大多数浏览器所支持。CSS的制作可以通过两种方式：一是运用脚本代码编写方式。这需要对语言非常熟练，对于初学者有相当难度，教学中不推荐使用；二是利用网页制作软件所提供的CSS样式编辑器来完成，这一种方法直观、易操作，适用于初学者。在教学过程中必须对CSS规范进行明确：①定义网页中字体的大小规范：一般网络中使用的字体在9～12 px之间较为合理；②确定网页的配色方案，包括超链接、背景、正文文字颜色等。有一点要注意，不能与网页背景或超链接的各种状态所使用的颜色相同，否则文字就看不到了。
多媒体应用规范
多媒体包括了图形、图像、声音、视频等，丰富了网页的内容，使得网页生动活泼、声色俱全，给上网者带来了愉悦。但我在教学中发现，由于使用不规范，出现图形、图像无法显示，或者声音、视频无法播放等现象。具体规范有以下内容：①必须将多媒体文件放在站点内；②必须以英文字母或数字命名多媒体文件，不能使用汉字；③图片太大应用图像处理软件将其分割为多幅独立的图片，这样利于浏览时逐步显示；④声音、视频文件要实现自动循环播放，必须在参数中加入“aout stsrt true”和“loop true”；⑤视频文件格式为AVI，声音文件格式为MIDI、WAV、MP3等格式；⑥Flash背景透明设置，在参数中加入“Wmode transparent”参数；⑦嵌入图形文本的使用较大的字体，建议不要在图形中包括文本。
原则上，我们禁止用＜img width=？height=？＞来人为干预图片显示的尺寸，而且建议＜img＞标签中不要带上width和height两个属性。这是因为在制作过程中，图片往往需要反复的修改，这样做可以避免人为干预图片显示的尺寸，尽可能地发挥浏览器自身的功能。但是这样的副作用是当网页还未加载图片时，不会留出图片的站位大小，可能会造成网页在加载过程中抖动，可以运用表格进行处理。
关键词：网页设计；教学；规范
前言
网络技术的发展突飞猛进，网页已成为当今生活中必不可少的元素，其可操作性、互动性、艺术性等给人们带来了方便和享受。网页是否被人们所接受，关键在于设计者的设计理念和艺术修养。设计理念又体现在规范上，这决定了网页浏览时的美观、下载以及上传速度。网页制作规范有很多，下面就此和大家进行探讨。
站点建立规范
对一个网站的评价，可以从站点建立规范去考察。建站不规范对网站以后的维护、更新带来困难，造成网站维护成本增加、维护周期延长，需要重新投入大量的人力、资金重编。所以我在教学和实训中严格要求学生按以下规范建立网页站点：①站点存放。站点存放是没有严格指定的，一般不存放在系统盘，统一存放在一个文件夹中。网站中各元素的使用路径全部采用相对路径。②站点命名。可以使用中、英文命名，建议使用英文命名。如果英文水平不高，可以使用汉语拼音来替代，例如：“圣诞网站”可以命名为“ShengDan”或“sdwz”。③站内文件夹和文件的命名。站点根目录下只能存放一个主页文件（index）和三个基本文件夹——images、other、files，其他文件夹可以根据实际设计需要来命名。不管是主页文件还是文件夹，一律使用英文命名。
网页表格布局规范
常用的网页结构主要有T型、∏型、上下型、左右型和不定型等，不论哪种结构，浏览器在解释页面的元素时，都是以表格为单位逐一编译显示的。表格的嵌套层数越多，打开浏览网页的速度就越慢。
经过反复测试，表格嵌套一般在三层内为合理，并且应该尽量避免 ＜colspan＞ ＜rowspan＞两个标记。除非有特别需要或页面不大可以使用整个表格作为一个完整页面外，一般情况下，应该将一个网页分成若干个表格构成。基本可以分为四个表格，第一部分表格用于放置Logo和Banner之类的元素；第二部分表格放置导航按钮；第三部分表格放置正文内容；第四部分表格放置版权说明、联系方式、注册信息等。其中第三个表格根据正文的内容也可以分为多个表格，这样划分使用有以下的好处：①可以方便地将网页中某一部分（以一个表格为单位）转换为库元素或模板；②减少网页编辑中对表格的调整和制作时间，提高制作效率；③方便对某个内容的提取、复制、粘贴和对新增内容的插入。布局表格也是表格，且具有更好的可操作性，但与表格又有着不同的特性，应在实际应用中结合使用，灵活配合，这样制作网页时就能做到快速、效果好、省时。
HTML语言编写规范
网页其实是由HTML语言编写的。HTML语言在教科书里称为“超文本标记语言”。HTML语言熟练者可以在Dreamweaver、FrontPage等软件内在代码视窗下编写网页。一般网页制作者可在常用设计视窗里进行可视化制作，但有些操作是无法在常用编辑视窗里完成的，如添加动态效果、添加脚本语言或后期维护编辑等，必须在代码视窗里操作，这就对代码提出了要求。
1.编写格式规范。要求在编写HTML语言时使用规范的格式，每一个标记之间有层次感，便于查找错误、减少查找时间。
2.Html文件的通用模板。整个网站的开发风格要保持一致，为了便于研发和今后修改及维护，构建一个通用模板是必须的。①为了保证网站能够与下一代的web 语言xml 标准兼容，所有的HTML 标签的属性都要用单引号或者双引号括起，即我们应该写 ＜a href=“url”＞ 而不是 ＜a href=url＞。②允许全文检索的页面，为了使Internet上的搜索引擎能够有效检索，在频道的首页的html的＜head＞＜/head＞之间应该加入Keywords 和Description元标记，例如：＜meta name=“keywords”content= “圣诞 商品”＞、＜meta name=“description”content=“百度，全球中文搜索引擎”＞。③在写 ＜table＞ 互相嵌套时，严格按照规范，对于单独的一个＜table＞来说，＜table＞＜tr＞对齐，＜td＞缩进两个半角空格，＜td＞中如果还有嵌套的表格，＜table＞也缩进两个半角空格，如果＜td＞中没有任何嵌套的表格，＜/td＞结束标记应该与＜td＞处于同一行，不要换行，如我们注意在源代码中不应有这样的代码：＜td＞＜img src=“../images/sample.gif”＞...＜/td＞。而应该是这样的：＜td＞＜img src=“../images/sample.gif”＞＜/td＞。这是因为浏览器认为换行相当于一个半角空格，以上不规范的写法相当于无意中增加一个半角空格，如果确实有必要增加一个半角空格，也应该这样写：＜td＞＜img src=“../images/sample.gif”＞ ＜/td＞属于同一个级别的＜table＞一定是左首对齐的，另外不允许没有任何内容的空的单元格存在。④Width和height的写法也有统一的规范，一般情况下只有一列的表格，width写在＜table＞的标签内，只有一行的表格，height写在＜table＞的标签内，多行多列的表格，width和height写在第一行或者第一列的＜td＞标签内。总之遵循一条原则：不出现多于一个的控制同一个单元格大小的height和width， 保证任何一个width和height都是有效的。
Script脚本语言应用规范
Script脚本语言是一种在互联网上广为传播和使用的特效语言，具体有两种分类：Java Script和VB Script。现在浏览器都能对这两种语言规范进行编译，目前使用最广泛的是Java Script。脚本语言在网页中的应用体现出四大特点：简单性、动态性、跨平台性、节省CGI的交互时间，在网页制作中脚本主要应用的地方有：① ＜head＞和＜／head＞之间，主要应用在对标题、状态栏、页面脚本动态效果等；② ＜body＞中插入，用于定义网页背景颜色、字体定义、函数调用声明等；③＜body＞和＜／body＞之间，正文内容中的动态特效。这三个地方插入脚本和具体用法，要经过一段时间的练习指导，学生才能熟练地应用脚本。
CSS特效应用规范
CSS又称为层叠样表式，网页中使用能够简化网页的格式代码，不仅能加快下载显示速度，还能减少需要上传的代码数量和在网页编写过程中的重复工作，是现代网页制作的一项技术，也为大多数浏览器所支持。CSS的制作可以通过两种方式：一是运用脚本代码编写方式。这需要对语言非常熟练，对于初学者有相当难度，教学中不推荐使用；二是利用网页制作软件所提供的CSS样式编辑器来完成，这一种方法直观、易操作，适用于初学者。在教学过程中必须对CSS规范进行明确：①定义网页中字体的大小规范：一般网络中使用的字体在9～12 px之间较为合理；②确定网页的配色方案，包括超链接、背景、正文文字颜色等。有一点要注意，不能与网页背景或超链接的各种状态所使用的颜色相同，否则文字就看不到了。
多媒体应用规范
多媒体包括了图形、图像、声音、视频等，丰富了网页的内容，使得网页生动活泼、声色俱全，给上网者带来了愉悦。但我在教学中发现，由于使用不规范，出现图形、图像无法显示，或者声音、视频无法播放等现象。具体规范有以下内容：①必须将多媒体文件放在站点内；②必须以英文字母或数字命名多媒体文件，不能使用汉字；③图片太大应用图像处理软件将其分割为多幅独立的图片，这样利于浏览时逐步显示；④声音、视频文件要实现自动循环播放，必须在参数中加入“aout stsrt true”和“loop true”；⑤视频文件格式为AVI，声音文件格式为MIDI、WAV、MP3等格式；⑥Flash背景透明设置，在参数中加入“Wmode transparent”参数；⑦嵌入图形文本的使用较大的字体，建议不要在图形中包括文本。
原则上，我们禁止用＜img width=？height=？＞来人为干预图片显示的尺寸，而且建议＜img＞标签中不要带上width和height两个属性。这是因为在制作过程中，图片往往需要反复的修改，这样做可以避免人为干预图片显示的尺寸，尽可能地发挥浏览器自身的功能。但是这样的副作用是当网页还未加载图片时，不会留出图片的站位大小，可能会造成网页在加载过程中抖动，可以运用表格进行处理。