思维导图:
网页设计基础知识
---
**导言:** 随着互联网的迅速蔓延,世界各地的数亿人群均可以通过网络实现聊天、购物、阅读新闻、查询天气等功能。而在幕后,是成千上万的网页支撑这一切。但这些网页是如何制作的?我们是如何通过各种设备访问它们的?
**学习目标:**
- 探究网页与网站的基础理念。
- 学习网页设计的关键技术。
- 了解静态网页的运行机制。
- 熟悉市面上常用的网页设计工具。
- 探讨网页的设计与开发流程。
- 学会如何建立网页制作的环境。
---
1.1 网页的基本概念
随着互联网的持续进化,网页已经成为我们日常生活中不可或缺的一部分。但是,你真的了解什么是网页吗?它们是如何构建和展现给我们的?
**1.1.1 Web与网页**
- **Internet(互联网)**:是一个全球化的计算机网络,由多台计算机通过公共协议连接在一起。当你的设备连接到其中一个节点时,你便能访问整个互联网。如今,全球有数十亿的用户在使用互联网,而这个数字还在持续增长中。
- **Web(万维网)**:是互联网上的一个超文本信息系统。它将文本信息从传统的线性模式转变为一个可以任意跳转、获取更多信息的非线性模式。
1.1.2 网页设计的三大要素
- **HTML**:超文本标记语言,用于定义网页的内容结构。
- **CSS**:层叠样式表,用于描述网页的布局和外观。
- **JavaScript**:一种编程语言,使网页具有交互性。
---
**小结:** 网页的设计和开发是一个结合了艺术与技术的过程。通过掌握基础知识和工具,你可以创建独特、高效、用户友好的网站和网页。
1.1.2 网站
---
### 1. Web
**网站 (Web Site)**: 指的是与特定主题或内容相关的一系列网页的集合。
**Web (World Wide Web or 万维网)**: 是一个全球性、动态、交互式、跨平台的分布式图形信息系统,建立在Internet上。Web为用户提供了一个图形化、直观的方式来浏览和查找Internet上的信息,通过超文本和超媒体的结构连接不同的信息节点。
- **超文本 (HyperText)**: 超文本是一种用户接口,用于显示文本和与其相关的内容。我们日常浏览的网页链接都是基于超文本的。最常用的超文本格式为HTML。
- **超媒体 (HyperMedia)**: 超媒体是超文本与多媒体结合的产物。它不仅允许文本跳转,还可以播放声音、显示图形或动画。
- **超文本传输协议 (HTTP)**: 是互联网上应用最广泛的网络协议。
### 2. 网页
当我们使用设备浏览新闻或搜索关键词时,看到的便是网页。网页是包含HTML标签的文件,存放在世界各地的服务器上,呈现给用户的是一个“页”。
- **元素**:
- 文字与图片是网页的基础元素。
- 除此外,还有动画、音乐、程序等其他元素。
- **静态网页**:
- 预定义的内容。
- 内容更新相对麻烦。
- 适用于内容更新少的展示型网站。
- 可以展示动态效果,如GIF动画、Flash、滚动字幕等。
- **动态网页**:
- 能与用户交互。
- 基于数据库技术,内容根据用户请求动态生成。
- 可实现多种功能,如用户注册、登录等。
- 技术包括JSP、ASP/ASP.NET、PHP等。
不论是静态还是动态网页,用户都可以看到基本的文字和图片。但对于开发者和管理者,两者在开发、管理和维护上有很大的区别。简而言之,网站是由多个网页组成,没有网页的网站是无法访问的。
---
**小结**: 网站是由一系列相关内容的网页组成,为用户提供信息和功能。网页是网站的基本单位,可以是静态或动态的。理解这些基础概念对于进一步深入学习网页设计至关重要。
1.1.2 网站
---
### 定义:
**网站 (Web Site)** 是集合在Internet上的一系列相关网页,用于展示特定内容。它是一种沟通工具,允许用户公开信息或提供网络服务。人们通过网页浏览器访问并获取所需的信息。
### 网站的三大组成部分:
1. **域名 (Domain Name)**:
- 识别特定计算机或计算机组的名称。
- 域名就像是一个地址或门牌号码,例如: www.baidu.com。
- 其中,“baidu”是主域名。
- “com”是顶级域名后缀。
- “www”是网络名。
- 域名由英文字母、数字和连字符组成,每部分的字符不能超过63个,不区分大小写。
2. **网站空间 (Web Hosting)**:
- 用于存放网站内容的空间,也称为虚拟主机空间。
- 定义空间的大小,存储网站文件和资料。
3. **程序 (Program)**:
- 使用特定编程语言创建和修改网站。
- 以源代码形式出现,按照特定格式书写的文字和符号组成。
### 网站结构简介:
网站本质上是一个文件夹,该文件夹内存有所有相关的网页文件和资源文件。设计网站就是设计各个网页并按分类保存。
- **根目录**:
- 也称为网站文件夹或网站的起始点。
- **index.html**: 网站的主页文件,是网站的核心。名字可更改,可以是静态或动态的页面。
- 子文件夹: 可根据需求定制,不固定。
```
网站名称 (Root Directory)
│
├── 系统文件
│
├── index.html (主页文件)
│
├── Images (图片文件夹)
│
├── style (样式文件夹)
│
├── script (脚本文件夹)
│
└── 其他子目录 (如分类子目录)
```
**小结**: 网站是Internet上的一系列网页集合,用于展示信息或服务。其由域名、空间和程序组成,具有特定的目录结构。对于初学者,理解这些基础结构是设计和管理网站的关键。