浅谈网页制作的技巧及常见问题的解决

[摘要]二十一世纪是网络的时代，网页制作已成为中专学生必须掌握的一项技能，主要介绍网页制作中的一些技巧以及学生在制作网页过程中常见的一些问题和解决方法。

[关键词]网页制作 技巧 问题 解决方法

中图分类号：TP3文献标识码：A文章编号：1671－7597（2009）0120051－01

在素质教育与终身教育成为必然的今天，人们对信息的需求有了更新、更高的要求，网页由于其所具有的信息量大、传递快速、没有时空限制等特点，恰好满足这种需求而逐渐成为一种新兴的教育资源。这使得制作网页成为学习者必须要掌握的一种技术。通过多年的《网页制作》课程的教学，在此谈几点网页制作的技巧及学生在制作网页时常见的问题和解决方法。

一、网页中颜色的选用

颜色是艺术表现的要素之一，在网页设计中少不了颜色，网站的标准颜色是决定网站视觉效果的重要元素，标准颜色主要用于网站的标志、标题、主菜单和主色块，给人以整体的感觉。颜色搭配要协调一致，避免出现影响整体视觉效果的大面积、高对比度的色块。在整个站点的颜色选择上应尽量使用同一色系的，颜色种类一般不要超过四种。由于很多学习《网页制作》课程的学生没有专门学习过美术，对颜色的选择还很欠缺，所以建议学生在选择背景颜色的时候尽量使用同一种颜色加以渐变处理，比如从深蓝到浅蓝的渐变。另外文本颜色和背景颜色的差别要明显一些，如深色背景配浅色的文本，浅色背景配深色的文本。更要注意的是所选的标准色一定要突出主题，如主题为诗歌散文的网站最好用一些淡雅的颜色，浅蓝、浅粉、浅绿等；主题为天文的网站一般采用黑色以表现天空宇宙的浩瀚；一个影视网站适用于任何颜色，但考虑到人们看电视、电影一般都在黑暗下观看，所以网页上使用深色比较符合人们的习惯。

二、表格的定位功能

表格在网页制作中除了可以起到表格本身的作用外，它最主要的作用是定位页面中的元素。运用表格可以自由控制文本和图像在网页上出现的具体位置，而不用担心不同的对象之间的影响，从而使整个网页看上去紧凑统一。使用表格定位页面元素时要注意以下几点：

1．一个网页要尽量避免用整个一张大表格，所有的内容都嵌套在这个大表格之内。因为浏览器解释HTML页面的顺序是自上而下依次逐行解释和显示，但当碰到表格时，浏览器会读取表格中所有的元素后才将结果在页面中显示出来，在页面内容较多而浏览者浏览的速度又较慢的情况下，浏览器的这种解释次序将明显表露出来，只有等到浏览器解释到了页面的最后，才会将整个页面的内容在浏览者眼前显示出来，而在浏览器解释过程中浏览者将看到一片空白。我们在采用表格进行定位时，可以一行使用一个表格，并且尽量不使用表格的嵌套。

2．有的学生在使用表格定位时，在页面视图下显示没有一点问题，可在浏览器中预览的时候会出现页面元素错位的现象，这个问题就在于表格宽度的设置上，表格宽度的设置有两种，一种是百分比，一种是像素，如采用百分比就会出现在不同分辨率下显示效果不同的现象，而将表格的宽度都更换成像素，就可以解决这个问题了。

三、网页中文字乱码的处理

现在不少学校开设的网页制作相关课程，不仅有“所见即所得”的网页制作工具如Dreamweaver或FrontPage，还开设了HTML语言。学生在制作网页时，喜欢自己编写一些代码。有时，学生编写的网页在浏览器上常出现乱码的情况。解决这个问题的办法是：在HTML语言的和标签之间添加标签来定制语言，语句如下：

＜meta http-equiv="Content-language" Content="zh-CN"＞

＜meta http-equiv="Content-Type" content="text/html;charset=gb2

312"＞

这两条语句可将网页编码设置为简体中文GB码，浏览时就不会出现乱码。

四、文件的命名

在制作网页的过程中，学生经常会遇到这样一些问题：网页中插入的图片在浏览时无法显示、做好的链接不能正常应用等。分析原因，我们常常发现，是因为文件使用了中文名称。学生为了便于记忆和查看明了，总是喜欢给自己网站中的文件起一个中文名称，正是这些中文名称导致了网页浏览中的一些问题，解决的方法就是将文件名改为英文。为了便于记忆可以使用汉语拼音或是中文的英译，如背景图片文件可命名为background.gif或bg.gif。

五、图像的无缝拼接

图像是网页中必不可少的元素，它起到美化页面的作用。图像的格式有很多种，但在网页中常用的只有三种格式：GIF、JPG和PNG。图像的大小在很大程度上影响网页的下载速度，所以在使用图片之前要先用图形处理软件（如PhotoShop）对图片进行优化处理，在不影响显示效果的情况下尽量使用小尺寸的图片。如需使用大图片，我们可以采用图像的无缝拼接技术，所谓图像的无缝拼接就是在图形处理软件中将一个大的图片分割成几个小的图片，然后在网页制作软件中再把几个小图片拼合成一个大的图片，拼合后的图像跟原来的图像显示效果一样，看不出拼接的痕迹。完成拼接主要利用了表格的定位功能，把几个小的图片分别放在表格的各个单元格中，设置表格的边框、单元格的间距和边距均为零，然后再手动调整一下，就可以完成图像的无缝拼接了，这样处理虽然比较麻烦，但却既能使用效果好的大图片又解决了图片下载速度的问题。

六、个人站点中导航按钮的设计

学生学习完网页制作课程后都会动手制作自己的网站，所作的类型基本上属于个人网站。互联网上的个人网站有很多，要想拥有更多的点击率，个人网站除在内容上要吸引浏览者外，在视觉上更要有新意，要突出个性。这就要求要有一个别出心裁的导航按钮。导航按钮通常放在主页上，是浏览者访问你的网站首先看到的部分。可以使用下列方法设计一个新颖的导航按钮：

1．使用现成的大图片。根据站点的主题选用一个与主题相关的图片，利用图片的各部分做成导航，如制作一个文学网站，可以选用一本书作为导航，书的目录就是站点的栏目。

2．使用Photoshop或Flash来制作自己的导航按钮。采用这种方法，要求学生熟练掌握图形处理软件及动画制作软件的使用，并具有创新性，自己动手设计并使用相关软件完成。这样创作出的导航系统就会具有新意，会吸引更多的浏览者。

七、结束语

网页制作中有很多的技巧，只有在不断的实践中才会总结出更多更好的制作网页的方法，所以学生在知道了一些技巧之后一定要付诸于实践，这样才能更好地掌握，把别人的知识变成自己的知识。

参考文献：

[1]王为正、何小翠、应红，《计算机网页制作中几个疑难问题研究》，金华市：金华职业技术学院学报.

[2]张鸣，《关于网页设计与制作方法的探讨》，长春市：长春大学学报.

[3]陈欣，《Dreamweaver Mx教程》，清华大学出版社.

作者简介：

冯雪莲，女，包头铁道职业技术学院，讲师。