初学者学习网站制作必须要注意的一些事项

新手学习网页制作，首先学习HTML（超文本标识语言），这是网页设计的基础；然后再学CSS，掌握HTML以后，其实就可以设计一些简单的静态页面了，再接下来就是学习可视化设计软件，比如网页三剑客中的DREAMWEAVER，它是可视化的页面结构设计软件，可视化的意思，就是可以用软件中现成的按钮或选项来帮你快速制作网页，代码由软件代替你自动生成，可以大幅提高效率。

很多新手在网上浏览网页时，一定会看到不少设计独特、创意新颖、页面诱人的个人网页，遇到这些网页你也一定会驻足停留、仔细欣赏一番，同时脑海中大概也会有一丝想要制作一个属于自己的个人主页的念头。

如果你确实有这个想法，那就请你继续看完下面的内容，下面提供的要点都是新手学习网页制作必须要注意的事项，并让你在以后设计自己的主页过程中游刃有余。

1、设计前要有筹划

设计一个网页也许并不是很困难，但这一工作与编制传统的宣传品一样，都需要我们谨慎处理和筹划。

换言之，我们必须首先确定自己需要传达的主要信息，然后细意斟酌、把所有意念合情合理地组织起来；之后是设计一个页面式样，试用于有代表性的用户，接着重复修订，务求尽善尽美（具体可查看马海祥博客《如何创建网站或应用程序的样式指南和标准》的相关介绍）。

2、网站主题不可太多

主题也就是网站所要表示的主要内容，主题要小而精做到，定位小，内容精，如果你想作一个包罗万象的站点，把所有你认为精彩的东西都放在上面，那么往往会事与愿违，给人的感觉是没有主题。 

3、整个页面风格要一致

你网页上所有的图像、文字，包括像背景颜色、区分线、字体、标题、注脚什么的，要统一风格，贯穿全站。这样子读者看起来舒服、顺畅，会对你的网站留下一个“很专业”的印象。

4、选择内容要有新鲜感

万维网上不断有新事物出现、每天都有新花样，如果你的主页从不改变，用户很快会厌倦，因此网页内容的选择要不落俗套，要重点突出一个“新”字，这个原则要求我们在设计网站内容时不能照抄别人的内容，要结合自身的实际情况创作出一个独一无二的网站。

放眼望去，网上的许多个人主页简直就是“杂货店”，内容包罗万象，题材千篇一律，人人都是“软件下载”，个个都有“网络导航”，从头到尾找不出一丝“鲜”意。

所以，我们在设计网页时，要把功夫下在选材上。选材要尽量做到“少”而“精”，又必须突出“新”，如能坚持天天更新的话，我相信这样的网页一定会受到大家的欢迎。

5、内容相对实用性大

一个网页尽管设计得趣味盎然，引人入胜，但这不是吸引用户最好的理由，要想最大限度地留住用户首要的是要让它有用处，这样做的一个很简单的办法是提供相互参与--让读者做一些事情，如报名获取定期发送的通讯，并用某种方式报答他们的参与，如每周抽奖或给予下载一些东西的机会。

6、网站的标准色彩不超过3种

标准色彩是指体现网站形象和延伸内涵的色彩，一般一个网站标准色不超过三种，太多则让人眼花缭乱，标准色彩主要用于网站的标志，标题，主菜单和主色块，给人以整体的感觉，至于其它色彩的使用，只可作为点缀和衬托，绝不能暄宾夺主。

7、不要使用过多的字体

字体太多，则显得杂乱，没有主题，马海祥建议最多使用三种字体，网页中需突出的地方可用不同的字体样式、大小和不同的字体颜色表示。

还应注意的一点就是最好使用windows系统自带的字体，因为最终选用什么字体显示是由浏览者的浏览器来决定的。

8、网站的链接层次结构不要超过三层

网站的链接结构指网页之间相互拓扑结构，简单的说，每一个网页都是一个固定点，链接则是在两固定点之间的连线。

层次不要超出三层，只是针对一些个人站点和小网站而言，这样不但能使网站结构清晰，一目了然，而且更便于你网站的日常维护，如果链接目录结构不能控制在三层以内，马海祥建议你在页面里显示导航条，可以帮助浏览都明确自己所处的位置。

9、网页命名要简洁

由于一个网站不可能就是由一个网页组成，它有许多子页面，为了能使这些页面有效地被连接起来，用户最后能给这些页面起一些有代表性的而且简洁易记的网页名称，这样既会有助于你以后方便管理网页，在向搜索引擎提交你的网页时更容易被别人索引到。

在给网页命名时，最好使用自己常用的或符合页面内容的小写英文字母，这直接关系到页面上的连接。

10、为图片添加文字说明

给每幅图形加上文字的说明，在出现之前就可以看到相关内容，尤其是导航按钮和大图片更应如此。

这样一来，当网络速度很慢不能把图象下载下来时或者用户在使用文本类型的浏览器时，照样能阅读网页的内容，以后用户在访问你的站点时总有一种亲切感觉，认为你心细，比较善解人意，时时刻刻为他人着想，相信你的好心会有好报的（具体可查看马海祥博客《实现网页图片预加载效果的3种技术方法》的相关介绍）。

11、确保页面的导览性好

主页的其中一个很重要的功能就是作为导航工具，指引用户查阅你存储在网址或其他地点的信息，因此在设计主页时，应尽量使导览过程变得很轻松。

基于清晰明确和速度的考虑，主页上的超级联接内容应只限于几个高级的类别，例如公司、产品、服务等等。一般一个A4页面大小的网页用六至八个超级联接比较合适。此外，你还要保证超级联接的层数不能太多，超过4层以上的联接信息将会使人感到厌烦，因此，你必须在广度和深度之间求取平衡。

如果你的网址上有太多信息，你可能要制作较长的页面或使用更多联接层数，甚至可能要建立多个主页、使每个主页载有不同的信息。如果能够让用户在主页上以关键字或词语查找所需的信息，肯定受用户欢迎。

12、善用表格来布局

不要把一个网站的内容象作报告似的一二三四地罗列出来，要注意多用表格把网站内容的层次性和空间性突出显示出来，使人一眼就能看出你的网站重点突出，结构分明。

表格在许多的网页中被用于页面排版，表格的嵌套就是在表格里插入表格，做为文字来处理，这样更易于网页版式的定位，但是如果表格层次过多将严重影响网页的下载速度，所以马海祥建议各位尽量少的使用复杂的，嵌套层次多的表格。

13、网站的目录结构

网站的目录是指你建立网站时创建的目录，目录的结构是一个容易忽略的问题，大多数人在创建站点时都是未经规划，随意创建子目录，目录结构对浏览者并无影响，但对于站点本身的上传和维护，以后内容的扩充和移植有着重要影响。

下面再给各位列出几个注意点，希望对站长们有所帮助：

（1）、不要将所有文件都存放在根目录下。

（2）、目录层次不要太深，建议不要超过3层。

（3）、不要使用过长的目录名。

（4）、不要使用中文目录。

14、排版时要注意细节

别轻易让文字居中和使用粗体或斜体字符，除了视感混乱之外，很多流览器不能很好地显示斜体字，也不能补偿由于字母倾斜引起的空白变化。

利用短的段落，加点列示，适当的整块引用文字，用水平线分节，用影象地图指引主要连接，使你的页面能吸引人和容易阅读。

另外，马海祥提醒大家注意的是，不要把重要的内容排版放到网页的结尾，因为读者的视线可能停留在主页上面较多一点，或者有些读者没有耐心往下看那么远。

15、善用GIF和JPG格式的图象

用户在网上四处遨游，你必须设法吸引和维护他们对你的主页的注意力，万维网的其中一个最重大资源是其多媒体能力，所以我们无论如何要善加利用。

主页上最好有醒目的图像、新颖的画面、美观的字款，使其别具特色，令人过目不忘。图像的内容应有一定的实际作用，切忌虚饰浮夸。

目前因特网上大多数使用GIF和JPG交互格式的图象，因为交互格式的图像是分级显示出来的，首先以很低的分辨率显示，然后逐步提高分辨率，直至最后达到正常显示，这种方式有时候会使较大的图像看起来好象装载得快一些，实际上并非如此，但这是一种有益的错觉，这样也便于读者在图像装载的过程中看到它的模样，如果他们不喜欢或不想看的话就有机会中断传输或转向别的地方。

16、多使用图象缩微图

比如说有一张800×600像素的1600万色扫描图，所占空间约为50K，使用PhotoShop这一类的图象编辑工具对原图进行重新取样，比如说高度为100像素(为确保浏览器能即时以合适的大小显示图像，高度和宽度很重要，也许为了达到你自己的要求你得进行调整才能找到最合适的大小，但可以从高度除以4～6开始)，PhotoShop会自动计算新图象的宽度，保存新图象，它的大小现在应为8K或更小。

然后浏览器在解释执行Lowsrc命令时，将要求浏览器在真正的画面载入以前先装载低分辨率的图像，这样就会让访问者清楚将会出现什么样的图片。

17、不宜使用太多的动画

大家都喜欢用GIF动画来装饰网页，它的确很吸引人，但我们在选择时，是否能确定必须用GIF动画，如果答否，那么就选择静止的图片，因为它的容量要小得多。

同样的尺寸的LOGO，GIF动画的容量有5K，而静止LOGO的只有3K，虽然只有2K之差，但多起来，就会影响下载的速度，所以，如果有些不是必须的，就选择最小的（实在无法避免的话，可查看马海祥博客《提升网站页面打开速度的12个建议》的相关介绍）。

18、闪烁文字不要多用

有的设计者想通过闪烁的文字来引起访问者的注意是可以被人理解的，但一个页面中最多不能有三处闪烁文字，太多了给用户一种眼花缭乱的感觉，反而会影响用户去访问该网站的其他内容，正所谓“物极必反”！

19、页面长度要适中

有的网站主页拉得老长老长，让读者握着鼠标翻半天，别跟读者为难，凡事从人家的角度多想想。一般来说，主页长度应限定在三个整屏以内，一个半屏为最佳。

当一个页面很长时就应该要注意了，因为它的传输时间明显要比较短的页面的传输时间长，太长的页面传输会使访问者在等待中失去耐心，而且为了阅读这些长文本，访问者不得不使用卷滚条，从而也浪费了用户在网上冲浪的时间。

如果你有大量的基于文本的文档，应当以AdobeAcrobat格式的文件形式来放置，以便你的访问者能离线阅读，从而节省宝贵的时间。

20、记数器能不用最好不用

由于计数器也是由程序设计成的，显示计数器的过程其实就是在执行一个程序的过程，它需要占用用户宝贵的上网时间，况且大多数浏览者认为计数器毫无意义，它们很容易被做假，浏览者也不想看广告，因此，马海祥建议不要轻易考虑在你的网站上放置一个醒目的点击记数器。

你设计网站是为了给访问者提供服务，而不是推销你自己认为重要的东西。如果你显示你的网站是多么受欢迎，你最好提供一个链接，显示访问日志。

21、Java程序少用为宜

不要使用大幅面的Java程序，能够用javascript替代效果的则尽量不要使用java，因为目前来讲java的运行速度实在慢的让人无法忍受，往往使浏览者没有耐心等页面全部显示出来，这样你的精心设计便毫无效果啦（具体可查看马海祥博客《网页制作过程中常用的20个功能代码》的相关介绍）！

22、合理设计视觉效果

不必在以页面上填满图像来增加视觉趣味，尽量使用彩色圆点--它们较小并能为列表项增加色彩活力(并能用于彩色列表)，彩色分隔条也能在不扰乱带宽的情况下增强图形感。

另外，网页设计好后，一定要在不同类型的浏览器和不同分辨率的情况下测试主页，例如许多浏览器使用1280×800的分辨率，尽管在1600×900高分辨率下一些Web页面看上去很具吸引力，但在1280×800的模式下可能会黯然失色，作一点小小的努力，设计一个在不同分辨率和不同类型的浏览器下都能正常显示的网页。

23、每个页面都要有导航标志

所有页面从头至尾都要使用导航标志，尤其是要用“返回到首页”连接，可以在每个页面都这样做。比如在每页的顶端(或底部)都有一小串图标，第一个回到首页、第二个回到章、第三个回到节。

如果是图像导航按钮，那么要有清晰的标识，让人看得明白，千万别只顾视觉效果的热闹，而让人家不知东西南北。

而文本导航的链接颜色最好用约定俗成的：未访问的，蓝色；点击过的，紫色或栗色。

总之，文本链接一定要和页面的其他文字有所区分，给读者一个清楚明白的导向。

24、尽量使用相对超级连接

在制作图象或文本超级连接时，尽可能地使用相对超级连接，这是因为这样做网页的可移植性比较强，例如把一组源文件移到另一个地方时，相对路径名仍然有效，而不需要重新修改连接的目标地址。

另外，使用相对超级连接时输入量也较少，在同一页的连接项当然应该使用相对地址，因为使用绝对地址后可能会每选择一个连接都要把该页重新装载一次。

如果是连接到不直接相关的文件时，使用绝对路径比较好，这样以后要是把源文件移到另外的目录下就不需更改连接了。

25、保证超级连接直观有效

页面中的超级连接应当使用户能够很快地找到他们所要的东西，绝大多数好的站点在每一页同样的位置上都有相同的导航条，使浏览者能够很直观地从每一页上访问网站的任何部分（具体可查看马海祥博客《新手制作网页过程中必知的10个要点》的相关介绍）。

另外，特别要避免“请按这里”，任何要“按这里”的人都会慎重考虑，它是不是正好就在“这里”，并且连接无误。不要让连接的名称与连接的URL不同，这样会使读者白白地浪费时间。

马海祥博客点评：

不少新手学习制作网页，建网站，其中最让人困惑的就是不少人压根就没有思路的概念，学的是乱七八糟，因为各种意想不到的问题耗费太多时间，做出来的网页也专业，最后不了了之！所以，对于新手来说，更要多了解一些网页制作要点，提前做好规划方案。