第一章 网页制作的基础知识

1.1 网页, 网站

     1.1.1 网站和网页的区别：

1. 含义不同：

   • 网站：网站是指根据一定的规则和规范，使用HTML、CSS、JavaScript等技术构建的，用于展示特定内容的一系列相关网页的集合。它是一个包含多个页面的完整信息系统。
   • 网页：网页是网站的基本组成单元，通常由HTML代码构成，通过浏览器展示给用户的一个单独的界面。

2. 关系不同：

   • 网站包含网页：一个网站由多个网页组成，每个网页都是网站的一部分，承载着网站的一部分内容或功能。
   • 网页是独立的界面：每个网页都可以独立存在，展示特定的信息或功能。

3. 组成不同：

   • 网站的组成：网站通常包括域名、服务器、网站空间（虚拟主机或云服务器）、网站程序（如CMS系统）、数据库等。
   • 网页的组成：网页主要由HTML、CSS、JavaScript等代码构成，可能还包括图片、视频、音频等多媒体内容。

4. 功能不同：

   • 网站的功能：网站通常具有较为复杂的功能，如用户注册、登录、在线购物、信息发布、数据管理等。
   • 网页的功能：网页通常实现较为简单的功能，如展示信息、提供表单提交、展示广告等。

5. 访问方式不同：

   • 网站的访问：网站需要部署到服务器上，通过域名或IP地址进行访问。
   • 网页的访问：网页可以直接在浏览器中通过URL访问，也可以作为网站的一部分被访问。

1. HTTP (超文本传输协议)：HTTP 是用于传输超文本文件的应用层协议。它定义了客户端（如浏览器）和服务器之间进行通信的规则。HTTP 协议基于请求-响应模型，客户端向服务器发送一个请求，服务器返回一个响应。HTTP 协议使用 TCP 连接进行数据传输，是构建 Web 页面的基础。

2. URL (统一资源定位符)：URL 是用于在互联网上唯一标识一个资源的地址。它包含了协议类型、服务器地址、路径、文件名等信息，用于告诉浏览器或者任何其他应用如何访问特定的资源。URL 的基本格式是：协议://域名或IP地址/路径/文件名。

3. FTP (文件传输协议)：FTP 是一种用于在计算机之间传输文件的协议。它允许用户从远程服务器下载文件或者将文件上传到远程服务器。FTP 使用两个 TCP 连接进行工作：控制连接用于发送命令和接收响应，数据连接用于传输文件数据。FTP 协议支持匿名登录和使用用户名/密码登录两种方式。

4. FTP 的作用：FTP 协议的主要作用是实现文件的上传和下载。它允许用户通过客户端软件（如 FileZilla、WinSCP 等）连接到远程服务器，执行文件操作，如复制、移动、删除文件或文件夹，以及浏览服务器上的目录结构。FTP 协议还支持文件的断点续传，即在传输过程中如果连接中断，可以重新开始传输而不需要从头开始。

   1.1.2  静态网页和动态网页：

静态网页

1. 定义：静态网页是指网页内容在服务器上预先编写好的，不随用户请求而改变。
2. 文件格式：通常使用 HTML、CSS 和 JavaScript 编写，文件扩展名通常是 .html、.htm 等。
3. 更新方式：需要手动编辑 HTML 文件并上传到服务器来更新内容。
4. 特点：
   • 加载速度快，因为不需要服务器处理。
   • 适合内容不经常变化的网站。
   • 交互性有限，无法根据用户行为实时改变内容。

动态网页

1. 定义：动态网页是指网页内容在服务器上根据请求动态生成的，通常与数据库结合使用。
2. 技术：使用服务器端脚本语言（如 PHP、Python、Ruby、Java 等）以及数据库技术（如 MySQL、Oracle 等）生成内容。
3. 更新方式：内容通常由后端程序自动生成，不需要手动编辑 HTML 文件。
4. 特点：
   • 交互性强，可以实时响应用户操作。
   • 更新灵活，可以快速更改内容。
   • 可以根据用户需求、登录状态等因素展示不同的内容。
   • 加载速度可能较慢，因为需要服务器处理请求并生成内容。

对比

• 生成方式：静态网页是预先编写好的，动态网页是实时生成的。
• 更新频率：静态网页更新频率低，动态网页更新频率高。
• 交互性：静态网页交互性弱，动态网页交互性强。
• 适用场景：静态网页适合内容不常变动的个人博客、企业宣传页面等；动态网页适合内容更新频繁、需要用户交互的电子商务网站、内容管理系统等。 

1.2 网页的基本构成要素 ：

1.2.1 ：文本 ，图片和动画 ，超链接 ， 音频和视频 ， 交互功能等等，，，

1.3 网页布局结构：

1.3.1 网站的内型：

 

01 国字型：

02厂字型：

03海报型

04Flash型：交互性强

1.3.2 网页色彩搭配：

色彩搭配原则

1. 鲜明性：网页色彩要鲜明，容易引人注目，给用户留下深刻的第一印象。
2. 独特性：色彩要有自己的风格，与众不同，增强网站的个性化和识别度。
3. 艺术性：网页设计是一种艺术活动，色彩搭配要符合艺术规律，大胆创新。
4. 合理性：色彩搭配要根据网页的主题和内容来选择，与网站的性质相符合。
5. 合适性：色彩要和网页要表达的氛围和情绪相适应。
6. 联想性：选择色彩时，要考虑到用户的色彩联想，如蓝色联想到科技、红色联想到热情等。

色彩搭配方法

1. 同种色彩搭配：选择一种主色调，通过调整透明度和饱和度来产生新的色彩，形成层次感。
2. 邻近色彩搭配：在色环上选择相邻的颜色进行搭配，如蓝色和绿色、红色和橙色等。
3. 对比色彩搭配：选择色环上相对位置的颜色进行搭配，如蓝色和橙色、红色和绿色等，可以形成强烈的视觉冲击。
4. 互补色彩搭配：选择色环上完全相对的颜色进行搭配，如红色和绿色、蓝色和橙色等。

色彩搭配实践

1. 主色：网页的主色通常用于主要的组件、背景和色块，是网页色彩搭配的基础。
2. 衬托色：用于辅助主色，突出某些元素或内容。
3. 背景色：网页的背景色要和主色协调，不要过于突兀。
4. 强调色：用于强调某些特定的元素或信息，通常使用比较鲜艳的颜色。