随着互联网技术的不断发展和普及，网络与现实生活的结合越来越紧密，网站代表了企业和个人的形象，网页如同个人的社交名片，不可或缺。越来越多的人开始学习和制作网页，更多的企业和个人把自己的“家”搬到网上。

应该说，设计精美的页面效果，需要用户掌握一定的技术，了解相关的知识，初步积累网页设计素养，同时还应该熟悉网站开发的流程。基于这样的学习背景，本篇文章将展示网页相关技术和概念，并介绍网页设计和网站开发的基本方法。

【学习要点】

　了解网页设计的相关概念

　了解网页学习的目的

　了解网页设计的基本知识

　了解网站开发的一般过程

1.1　熟悉网页设计概念

网站是互联网上一个信息小站，网页是互联网上显示的信息页面，如果说网站是一本书，那么网页就是生活中的一页书，是展示信息的最小单元。在网页中包含文字、图像、多媒体等内容，通过这些内容向浏览者传达一定的信息。

1.1.1　网页和网站

网站就是由网页组成的，网页是构成网站的基本元素，是承载各种应用的平台。一个网站如果没有网页，将是一个空站，如果只有域名和虚拟主机而没有制作任何网页的话，任何人都无法访问网站。

实际上，网页就是一个文件，通常是HTML格式，文件扩展名一般为.html或.htm，也可以是.asp、.aspx、.php或.jsp等。网页存放在世界某个角落的某一台计算机中，而这台计算机必须是与互联网相连的。网页经由网址（URL）来识别和存取，当在浏览器输入网址后，该网页文件会被传送到你的计算机上，然后再通过浏览器解释网页的内容，再展示到面前。

网站是指在互联网上，根据一定的规则，使用HTML等语言制作的，用于展示特定内容的网页集合。简单地说，网站就像布告栏一样，人们可以通过网站来发布自己想要公开的信息，或者利用网站来提供相关的服务。人们可以通过网页浏览器来访问网站，获取自己需要的信息，或者应用网络服务。

在网站中，有一个网页比较特殊，当人们在浏览器地址栏中输入网站的网址后，会首先看到这个页面，通常被称为主页（或称首页），首页类似图书中的目录，具有导航作用

1.1.2　网页类型

网页可以分为多种类型，但是由于分类方法不同，也会有不同的类型，根据是否使用了服务器技术，人们把网页分为静态网页和动态网页。简单说明如下。

1．静态网页

静态网页一般以.html或.htm为文件扩展名，通过网页设计工具一次性设计，只能够通过手工方式更新页面信息，信息更新速度相对比较缓慢。

注意：现在很多网站管理系统，或者大型网站都会提前把动态网页生成静态网页，以便提高网站访问速度，我们称这种静态网页为伪静态。

简单概括来说，静态网页具有下面几个特点：

　静态网页每个网页都有一个固定的URL，且网页URL以.htm、.html、.shtml等常见形式为后缀，而不含有“?”。

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

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

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

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

2．动态网页

动态网页是通过网页脚本语言自动处理、自动更新的页面，例如，论坛中的帖子就是通过网站服务器运行程序，自动处理信息，按照流程更新网页。动态网页一般以.asp、.aspx、.php或.jsp为文件扩展名。

注意：常见网页中包含的动态效果，网页中嵌入了动画，这样的页面不能称为动态网页，可以称为特效网页，或者多媒体页面。

动态网页具有下面几个特点：

　动态网页以数据库技术为基础，可以大大减少网站维护的工作量。

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

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

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

想要学习web前端的小伙伴可以观看B站视频：

2022最新版Web前端零基础入门140集全套视频_web前端基础_web前端实战教学_新手小白必备_哔哩哔哩_bilibili