网页设计与制作（一）——网页的基本认识

相信所有要来学习的伙伴，都有一定的基础了，大神可以跳过这一章。

这一章主要目录

1，网页的概念

2，网页基本常识介绍

3，网页基本组成元素

4，网页色彩搭配

好的，那么第一个问题，什么是网页？

我们平时上网浏览的所有页面，就是网页，而一个网站是由网页组成，小到一个网页，大到50个网页，而某些大型的网站可能包含了上千万个网页，打开网站的第一个页面叫做首页。

专有名词：网页，网站，主页就简单介绍到这里。

网页基本常识介绍

网页（web page）是网站中的一个页面，通常为html格式（文件扩展名为html，htm，asp，aspx，php，jsp等）。网页通常用图像文件来提供图画。网页要使用浏览器来进行阅读。

网页是使用标识语言通过一系列设计，建模和执行的过程将电子格式的信息通过互联网传输，最终以图形用户界面的形式被用户所浏览。在使用网页时，经常会碰到一些专业术语，下面来简单介绍一下：

Banner（横幅广告）

Browser（浏览器）

Click（点击次数）

Cookie（用户行为信息标识）

Database（数据库）

HTML（超文本标记语言）

HTTP（超文本传输协议）

Key Work（关键词）

URL（网页链接）

WebSite（站点）

网页是一个文件，可以存放在任何一台链接到互联网的计算机中。网页一般由网址（URL）来识别与存取，当用户在浏览器输入网址后，经过一段复杂而又快速的程序，网页文件会传送到用户的计算机，然后通过浏览器解释网页内容，再展示到用户的眼前。在设计网页时，还会遇到一些专业名词，如域名，URL，站点，超链接，导航条，表单以及发布等。按照网页表现形式，可以分为动态网页，静态页面。

主页也叫首页是一个网页集合的初始网页，也是一个网站的起点站或者说主目录。

当用户打开浏览器，输入域名网站地址后打开的网页就是我们常说的首页。

网页分类：

静态网页

静态网页每个网页都有一个固定URL，且网页URL以htm，html和shtml等常见形式为后缀，而不含有？号。

网页内容一经发布到网上，无论是否有用户访问，每个静态网页的内容都是存在服务器上的。也就是说，静态网页是实实在在保存在服务器上的文件，每个网页都是一个独立的文件。

* 静态网页的内容相对稳定，因此容易被搜索引擎检索。

* 静态网页没有数据库的支持，在网站制作和维护方面需要的工作量较大，因此当网站信息量很大时完全依靠静态网页制作方式比较困难。

* 静态网页交互性较差，在功能方面有较大的限制。

动态网页

动态网页是与静态网页对应的，也就是说网页URL的后缀不止有html，htm，shtml等静态文件的常见形式，通常动态网页地址后会有？号。

动态网页与网上的动画，滚动文字，滚动动画等视觉效果没有直接关系，动态网页也可以是纯文本的表现形式，动态网页是指使用动态网站技术生成的网页，是指与后台进行交互的有数据流动的网页。

* 动态网页以数据库技术为基础，可以大大降低网站维护的工作量

* 采用动态技术的网页可以实现更多的功能，例如用户注册，登录，在线调查，用户管理等等。

* 动态网页实际上并不是独立存在于服务器上的网页文件，只有当用户请求时服务器才返回一个完整的页面。

动态网页中的？号对搜索引擎检索存在一定的问题，搜索引擎一般不可能从一个网站的数据库中访问全部网页，或者出于技术方面的考虑，搜索之中不去获取网址中？号后边的内容，因此采用动态网页的网站在进行搜索引擎推广时需要做一定的技术处理才能适应搜索引擎的要求。

静态网页与动态网页的区别

程序是否在服务器端运行，是区分动态网页和静态网页的重要标志。

在服务器端运行的程序，网页和组件，属于动态网页，他们会随不同客户以及不同时间，返回不同的网页，例如ASP，JSP，PHP等。属于客户端的程序，网页，插件和组件，属于静态网页，例如html页面，flash，js以及VBS等，它们是永远不变的。

静态网页和动态网页各有特点，网站采用动态网页还是静态网页主要取决于网站的功能需求和网站内容的多少，如果网站功能比较简单，内容更新量不是很大，采用静态网页的方式会更简单，反之一般要采用动态技术来实现。

静态网页是网站建设的基础，静态网页和动态网页之间也并不矛盾，为了网站适应搜索引擎检索的需要，即使采用动态网站技术，也可以将网页内容转化为静态网页发布。动态网站也可以采用动静结合的原则，适合采用动态网页的地方用动态网页，适合用静态网页的地方用静态网页实现，在同一个网站上，动态网页内容和静态网页内容同时存在也是很常见的事情。

在讲网页基本组成元素前先讲一个设计网页的基本原则设计网页有几个重要的原则第一条就是

用户优先，因为没有用户光顾，任何自认为再好的网页都是没有意义的。必须要考虑用户使用的机器的网络问题，无论是电脑还是手机，总会有线路卡顿的情况，对于一些较大的flash，图片要尽可能的少放或从技术上使其分割。最后完成之前最好通过远程连接上网的方式亲自测试一下。考虑到浏览器的版本问题，最好使用所有浏览器都可以阅读的格式，不要只使用可以支持HTML格式或程序的使用技巧。

主页很重要，主页是用户认识这个网站的第一印象。如果是新开幕的网站，最好在第一页就对这个网站的性质与所提供的内容作个简要说明和引导，让用户判断要不要继续深入进去了解。最后第一页就有很清晰的类别选项，而且尽量符合人性化，让用户可以很快找到需要的主题。在设计上，最好成持干净而清爽的原则。首先，若无需要，尽量不要放置大型图片文件或加上不必当的程序，因为它会增加下载时间，导致用户失去耐心；其次，画面不要设置的杂乱无序，因为用户会找不到东西。

内容要有特色，内容可以是任何东西，包括文字，图片，视频以及声音等，但一定要跟这个网站所要提供给用户的信息有关系。建设网站一定要进行规划，规划时必须确定自己网站的性质，提供内容以及目标观众，然后根据本身的软硬件条件来设置范围。网络的特色是及时，新鲜，丰富，热闹，这是吸引用户上网的条件，如果本身条件足够，可以根据上述原则使网站成为一个全方位的信息提供者，如果不足，就成为单方面的提供者。此外，还可以在特殊议题或主题上加以突出，进一步锁定目标观众。

将栏目归类，内容的分类很重要，可以按照主题分类，按性质分类，按机关组织分类或按人类思考直觉式的分类等，一般而言，按人类的思考直觉分类会比较亲切。但无论哪一种分类方法，都要让用户可以很容易找到目标。而且分类方法最好尽量保持一致，若要混用多种分类方法也要掌握不让用户搞混的原则。此外，在每个分类选项的旁边或下一行，最好也加上这个选项内容的简要说明。

互动性，网页的另一个特色就是互动。好的网站必须与用户有良好的互动性，包括在整个设计呈现，使用接口导引上等等，都应该掌握互动的原则，让用户感觉每一步都确实得到适当的响应，这部分需要一些设计上的技巧与软硬件支持。事实上，好的网页设计必须加上个人技巧，经验累计以及软硬件技术的配合运用等。为了增加与用户的互动，网页中最好也加上可供用户表达意见的评论栏。

注意格式的正确性，很多设计者在写文档时，会简略一些命令格式，但为了日后维护方便，撰写html时最好架构完整，而且初学者也可以借此对HTML语法有正确认识。此外，如果网站本身想让用户可以通过搜寻站来找到，那么千万不要忘了在title标签中加上可供搜寻的关键字串。

背景底色，不少人喜欢在网页中加上背景图案，认为如此可以增加美观，但却不知这样会耗费传输时间，而且影响阅读，反而给予用户不好的音响。因此，若没有绝对必要，最好避免使用背景图案，保持干净清爽的本文。

网页基本组成元素

组成元素比较简单就不做详细介绍了，网页中的文字，图片，动画，表格，超链接，表单都是网页的组成元素

网页的色彩搭配

 

网页配色基础

在网页中合理运用色彩是非常关键的，不同的色彩会产生不同的效果，并能影响用户情绪。色彩在人类的生活中都是具有丰富的感情和含义的，常见的颜色代表的情绪有：

红色可以使人联想到玫瑰，喜庆，兴奋，亮眼等。

白色可以使人联想到纯洁，干净和简洁。

紫色象征着女性化，浪漫，高雅。

蓝色象征着未来，高科技，理智，稳重。

橙色代表了欢快，甜美，收获。

绿色代表青春活力，舒适，希望。

当然不全是我上边描述的那些，同种色彩也可以代表不同的含义。在网页中更要合理的使用色彩，一个网站不可能单一的运用一种颜色，这样容易让用户感觉单调，乏味。但是也不可能全都是用上，会让用户感觉轻浮，花哨。一个网站必须有一种或者两种主题色，一个页面尽量不要超过4种色彩，用太多的色彩让用户感到没有方向，没有侧重。当主题色确定好以后， 考虑其他配色时，一定要考虑其他配色与主题色的关系，要体现什么样的效果。

 

这是第一篇，感谢大家，后边我会以每天一篇的速度更新，感谢关注！！我是正在创业的小张，请关注我们的公众号

大神养成计划，我会坚持，同时也希望我们的城市可以越来越好，希望我们也能帮主更多创业者，学习者，种植业从业者。