网页设计基础与概述
网页设计基础知识
网页设计基础知识网页设计基础知识网页是我们经常接触到的东西，并且随着互联的快速发展，越来越多的人开始学习制作网站，对于网站制作的初学者来说，需要具备哪些知识才能制作出一个简单的网站呢？网页设计基础知识1、我们需要了解什么是网页网页是构成网站的基本元素，是承载各种网站应用的平台。
通俗地说，您的网站就是由网页组成的，如果您只有域名和虚拟主机而没有制作任何网页的话，您的客户仍旧无法访问您的网站。
网页是一个包含HTML标签的纯文本文件，它可以存放在世界某个角落的某一台计算机中，是万维网中的一“页”，是超文本标记语言格式（标准通用标记语言的一个应用，文件扩展名为.html或.htm）。
网页通常用图像档来提供图画。
网页要通过网页浏览器来阅读。
通俗的来讲，网页就是相当于刊物当中发表的一篇篇文章，但与纸上的文章相比，它增加了多媒体信息和网上交互能力。
网页的实质=表格+文本+图片+动画+声音+视频+超链接+......网页2、网页的基础 HTML标签超文本标记语言（简称：HTML）标记标签通常被称为HTML标签，HTML标签是HTML语言中最基本的单位，HTML标签是HTML （标准通用标记语言下的一个应用）最重要的组成部分。
HTML标签的大小写无关的，例如“主体”跟表示的意思是一样的，但是推荐使用小写。
3、网页的基础属性装饰 CSS层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。
CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。
CSS 能够对网页中元素位置的排版进行像素级精确控制，支持几乎所有的字体字号样式，拥有对网页对象和模型样式编辑的能力。
CSS为HTML标记语言提供了一种样式描述，定义了其中元素的显示方式。
CSS在Web设计领域是一个突破。
利用它可以实现修改一个小的样式更新与之相关的所有页面元素。
网页设计排版知识点汇总
网页设计排版知识点汇总一、网页设计排版概述在网页设计中，排版是至关重要的一环。
良好的排版可以提升网页的可读性，增强信息的传递效果，使用户更加舒适地浏览网页内容。
本文将对网页设计排版中的重要知识点进行汇总，包括字体选择、行高与字距、对齐方式、布局等方面。
二、字体选择1. 字体类型在网页设计中，选择适合的字体类型对于页面的整体风格与氛围非常重要。
常用的字体类型包括无衬线字体（如Arial、Helvetica）、衬线字体（如Times New Roman、Georgia）和等宽字体（如Courier New、Monaco）。
根据网页的主题和风格，选择相应字体类型以增加页面的可读性和美感。
2. 字体大小字体大小的合理选择可以使文字内容更加易读，一般来说，标题需要使用大号字体（如24px），正文部分则选用中号字体（如14px），较小的字体适用于注释、引用等次要内容。
3. 粗体和斜体粗体和斜体是在网页设计中常用的强调手段，可以突出某些重要信息或者强调关键词汇。
但是需要注意，过多地使用粗体和斜体会导致排版混乱，建议谨慎使用。
三、行高与字距1. 行高行高是指行与行之间的竖直间距，合理设置行高可以使文字更易读。
一般来说，行高设置为字体大小的1.5倍到2倍之间，具体的行高选择可以根据页面的风格和排版效果进行微调。
2. 字距字距是指字母与字母之间的水平间距，过于紧密或过于宽松的字距都会影响阅读体验。
一般来说，正常的字距设置可以使文字看起来更加紧凑、整齐。
但是需要根据字体的具体形态和页面的需要进行适当调整。
四、对齐方式1. 左对齐左对齐是最常见的对齐方式，文字以页面左边缘对齐，行的末尾可能会产生不对齐的情况。
左对齐适用于大多数情况，能够保持内容的整齐和易读性。
2. 居中对齐居中对齐使文字相对于页面居中显示，可以给人以美观和稳定的感觉。
适用于标题、短句或者需要强调的文字。
3. 右对齐右对齐是文字相对于页面右边缘对齐，与左对齐相反。
网页设计的知识点和难点
网页设计的知识点和难点近年来，随着互联网的快速发展，网页设计成为了一个备受关注的领域。
在进行网页设计时，不仅需要具备一定的技术和设计能力，还需要理解网页设计的知识点和难点。
本文将探讨网页设计的核心知识点和常见难点，帮助读者更好地理解和应对网页设计的挑战。
一、网页设计的知识点1. 布局与排版网页的布局和排版是网页设计中最基础也是最重要的知识点之一。
良好的布局能够增强网页的可读性和易用性，使用户更容易理解网站的结构和导航方式。
合理的排版则能够提高网页的美观性和信息传达效果。
2. 色彩和配色色彩在网页设计中起到了至关重要的作用。
正确的配色方案可以有效地传达网站的品牌形象和情感氛围。
此外，合理运用色彩还可以提高网页的可读性和用户体验。
3. 图片和图形设计图像和图形是网页设计中必不可少的元素，能够吸引用户的注意力并传达信息。
网页设计师需要了解图片和图形的处理方法，掌握图像的优化和压缩技术，以提高网页的加载速度和用户体验。
4. 字体和排版字体选择和排版是网页设计中的关键环节。
通过选择适合的字体和合理的排版方式，可以增强网页的可读性和视觉效果。
同时，合理运用字体和排版也能够突出网页的重点内容，提高信息传达效果。
5. 响应式设计与移动优先如今，移动设备的普及和流行使得响应式设计和移动优先成为了网页设计的重要趋势。
网页设计师需要了解不同设备的特点和用户习惯，设计出适应不同屏幕尺寸和分辨率的网页，以提升用户体验和网站的可访问性。
二、网页设计的难点1. 兼容性由于不同浏览器和操作系统对网页的渲染方式存在差异，网页设计师需要考虑兼容性问题。
在设计过程中，需要进行跨浏览器测试，并对不同情况进行适配和调整，以确保网页在不同环境下的正常显示。
2. 用户体验网页设计的核心目标之一是提供良好的用户体验。
网页设计师需要从用户的角度出发，考虑用户的需求和行为习惯，设计简洁明了的界面和易用的交互方式。
此外，还需要关注页面加载速度和响应时间，以提升用户的满意度和使用体验。
网页设计制作知识点
网页设计制作知识点1. 基础知识1.1 HTML（Hypertext Markup Language）HTML是用于构建网页的标记语言，通过使用各种标签和属性，可以定义网页的结构和内容。
常见的HTML标签包括<head>、<body>、<div>、<p>等。
1.2 CSS（Cascading Style Sheets）CSS用于控制网页的样式和布局，通过将样式属性应用于HTML元素，可以改变它们的颜色、字体、大小等外观特性。
常见的CSS属性包括color、font-family、margin、padding等。
1.3 JavaScriptJavaScript是一种用于增加网页交互性的脚本语言，可以通过在网页中嵌入JavaScript代码来实现动态效果、表单验证等功能。
2. 响应式设计响应式设计是指根据设备的屏幕尺寸和分辨率，自动调整网页的布局和内容，以确保在不同设备上都能正常显示和使用。
常见的响应式设计技术包括媒体查询（Media Queries）、流体布局（Fluid Layout）和弹性图片（Flexible Images）等。
3. 网页导航3.1 导航栏导航栏用于展示网站的主要导航链接，通常位于页面的顶部或侧边。
可以使用HTML和CSS创建导航栏，并为每个链接添加交互效果。
3.2 面包屑导航面包屑导航用于显示当前页面在网站结构中的位置，让用户可以方便地进行导航和返回。
可以使用HTML和CSS创建面包屑导航，并为每个链接添加合适的指向。
4. 网页布局4.1 盒子模型盒子模型是用于布局和定位网页元素的基础概念，每个HTML 元素都可以看作是一个矩形的盒子。
通过设置盒子的宽度、高度、内边距（padding）和外边距（margin），可以精确控制元素在网页中的位置和间距。
4.2 栅格系统栅格系统是一种用于创建响应式网页布局的技术，将页面划分为多个均等的列。
网页设计与制作- 第01章_网页设计概述
网页设计与制作
1.1 网页基本概念
– 7．导航栏：导航栏的作用是引导浏览者准确、 方便地查看当前网站的不同内容并在相关页面之 间自由跳转。实际上，导航栏就是一组相对固定 的超链接，链接的目标就是站点中的主要网页。
– 8．表单：网页中的表单类似于Windows程序的 窗体，主要用来将浏览者输入的信息提交给服务 器端程序进行处理。表单是提供交互功能的基本 元素，例如问卷调查、信息查询、用户注册、网 上订购等，都需要通过表单进行客户端信息的收 集工作。
7
网页设计与制作
1.1 网页基本概念
• 例1.1 打开记事本（notepad.exe），输入如
下内容，将文件保存为ep1_1.html，然后双击
ep1_1.html在浏览器中打开并预览。效果如图
所示。
<html> </html>
<head> </head> <body>
</body>
<title>我的HTML网页</title>
– 9．其他常见元素：网页中除了以上几种最基本 的元素之外，还有一些其他的常见元素，包括悬 停按钮、Java特效和ActiveX特效等。这些元素 使网页更加丰富多彩和生动有趣。
15
网页设计与制作
1.2 网页浏览的基本原理
• 1.2.1 WWW服务器工作模式 • 1．客户机和服务器
– Web服务是建立在客户机/应用服务器/数据 库服务器（Client/ Server/ Database Server，C/S/DS）三层结构模型之上的， 在网络环境中，客户机向服务器发出服务请 求，服务器接收并处理客户的请求，最后将 结果返回到客户机。
网页设计基础知识1
2.使用老师提供的Adobe_CS3_LJF_3in1.iso 虚拟光驱加载ISO文件进行安装，序列号任意填写
3.确保“FLEXnet Licensing Service”服务开启 （即确保“FNPLicensingService”这一服eaver CS3
➢ Dreamweaver操作界面 1.菜单栏 2.文档窗口 3.属性面板:PS、office属性在上方，DW在下方 4.插入栏：对象面板，快速插入各种网页元素 可以设定该工具条界面为制表符模式或者菜单模式 5.文档工具栏 6.面板组：浮动面板，实现特定的功能 设计面板、代码面板、应用程序面板、文件面板等
（插件）支持。
－－动态效果
常见的客户端动态技术：Javascript、JavaApplet、 DHTML、ActiveX、Flash、VRML
多媒体网页，但并不是真正的动态网页
a
6
1.网页设计概述
➢ 服务器端动态技术需要服务器和客户端的共同参 与，客户通过浏览器发出页面请求后，服务器根 据请求的参数运行服务器端程序产生结果页面再 返回给客户端。一般涉及到数据库。 典型的服务器端动态技术：ASP、、PHP、 JSP、CGI
DW和Frontpage为“所见即所得”工具，不懂HTML语言也 可以制作专业的网页,图形化界面操作，自动生成相应代码。
a
12
2.网页制作相关工具
➢ 本课程主要讲解使用Adobe Dreamweaver CS3 制作静态网站。
➢ DW最新版本为Dreamweaver CS4，其基本功能 跟Dreamweaver 8/CS3类似，CS3/CS4跟8的最 大区别主要为：界面“色调”不一样、多了Ajax 框架、CS3/4和Photoshop的整合、CSS样式表 的增强。
网页设计有哪些知识点
网页设计有哪些知识点网页设计是指通过使用图形、文字、颜色、排版等元素来设计网页的过程。
在进行网页设计时，需要掌握一些基础的知识点，包括颜色搭配、排版设计、用户体验等。
本文将介绍网页设计的一些主要知识点。
一、颜色搭配颜色在网页设计中起着至关重要的作用，可以影响用户的情绪和对网页的印象。
在选择颜色时，需要考虑品牌形象、网站类型以及目标受众。
一般来说，可以通过以下方法来搭配颜色：1. 色彩搭配方案：选择主色调和辅助色调，确保颜色的搭配和谐统一。
2. 色彩意义：了解不同颜色的意义，例如红色代表热情和激情，蓝色代表稳重和冷静，灰色代表中立和专业等，根据网站需要选择适合的颜色。
3. 对比度：确保网页上文字和背景颜色之间有足够的对比度，以提高可读性。
二、排版设计排版设计是指在网页中文字、图片等元素的布局方式。
合理的排版设计可以提高阅读体验和页面的可视性。
1. 统一的字体：选择适合网页设计的字体，一般选择简洁易读的无衬线字体。
2. 行距和字间距：正确设置行距和字间距，以便更好地阅读文字内容。
3. 布局结构：根据网页内容的重要性和关联性进行布局，使用网格系统或栅格布局辅助排版。
三、用户体验用户体验是指用户在使用网页时的主观感受和满意度，良好的用户体验可以提高用户对网站的留存率和转化率。
1. 导航设计：设计易于理解和使用的导航栏，确保用户可以方便地找到所需的内容。
2. 响应式设计：考虑不同设备的屏幕大小和分辨率，提供适配不同终端的网页。
3. 可交互性：设计易于操作的界面元素，如按钮、链接等，让用户可以方便地与网页进行交互。
4. 快速加载：优化网页的加载速度，减少加载时间，提高用户体验。
四、视觉设计视觉设计是指网页设计中的图形元素、图片、动画等的设计。
合理运用视觉设计可以提升网页的吸引力和美感。
1. 图片优化：选择合适的图片格式、大小和分辨率，以减少加载时间。
2. 图标设计：使用简洁明了的图标来增强页面的可读性和可视性。
第1章网页设计基础
1.2 Web设计基础
3. 网页设计一致性 一致性的网页设计原则使得访问者容易理解站点的结构，否则可能导致访问者陷入困惑。对优秀的 Web站点分析可以发现，优秀的网页虽然各有特色，但都遵守最基本的原则，即保持站点内部页 面之间的一致性。 要保持一致性，可以从页面的结构排版入手：
通过定义一致的页面模板，各个页面使用相同的页边距。 文本和图形之间保持相同的间距。 主要图形、标题或符号旁边留下相同的空白。 如果在第一页的顶部放置了公司标志，那么在其他各页面都放上这一标志，如果使用图标导航，
1.3 网页布局
1.3.2 布局设计类型 网页布局大致可分为“国”字型、“匡”字形型、标题正文型、框架型、封面型、Flash型、变化型等。
思考：1. 网易网站的布局设计属于哪种类型？ 2. 网络传播学院的网站首页布局设计属于哪种类型？
1.3 网页布局
1.3.3 布局设计元素 在网页文件中，会涉及很多的页面元素。如何将这些页面元素有机地组合起来，达到满意的视觉效
随着浏览器版本的标准化和制作工具的完善，该布局技术原来的缺点已经逐渐被克服，建议使用。
1.3 网页布局
3. 框架布局 框架由于不能进行精确的元素定位，因此不能独立完成页面的布局，它常常和表格配合使用。先用
框架将页面划分为几个区域，然后再用表格实现各区域的精确局部。常用在网站系统的后台页面设计 中。由于在HTML 5标准中已经不被推荐，所以该布局不建议使用。
1.3 网页布局
1.3.1 布局设计原则 通常可以从以下几个大的方面考虑布局的基本设计原则。 （1）网页布局的内容应来源于需求，栏目的重要程度决定了网页布局的形式。网页中要展示的内容必 须是依据站点的主要栏目进行规划的。同时可以将所要表达的相近的栏目集中在一个区域显现，构成 一种群体效应。 （2）网页布局应区分栏目模块的重要程度。分开栏目的主次性，重要栏目以顶部、左侧排列，次要的 栏目以底部、右侧排列。即重要信息、重要功能模块“靠上靠左”原则。 （3）网页布局必须尊重用户习惯。不仅要考虑不同类型用户的使用习惯差异，还要考虑中、英文等不 同语种用户的浏览习惯。
网页设计与制作知识点梳理
网页设计与制作知识点梳理一、概述在当今信息化时代，网页设计与制作成为了一个热门的职业选择。
网页设计与制作是指通过使用HTML、CSS、JavaScript等技术，设计并制作出具有良好用户体验的适应各种设备和浏览器的网页。
本文将从网页设计与制作的基础知识、前端开发技术、用户体验等方面，对相关知识点进行梳理。
二、网页设计与制作基础知识1. HTML基础HTML是网页的核心语言，了解HTML的基本标签、元素和属性是进行网页设计与制作的基础。
常用的HTML标签有`<html>`、`<head>`、`<body>`、`<div>`、`<p>`等，这些标签用于描述网页的结构和内容。
2. CSS基础CSS是用于网页样式设计的语言，通过CSS可以为网页添加背景、颜色、字体等样式。
熟悉CSS的选择器、样式属性和值的设置是进行网页美化的基础。
常见的CSS样式属性包括`color`、`font-size`、`background-color`、`margin`等。
3. JavaScript基础JavaScript是一种用于实现网页交互效果的脚本语言，掌握JavaScript的语法和常用的DOM操作可以实现对网页元素的动态修改和事件响应。
了解JavaScript的基础语法、变量、函数和常用的DOM 操作方法有助于提升网页的交互性和动态效果。
4. 响应式设计响应式设计是指根据不同设备和屏幕尺寸，为网页提供适配的布局和样式。
通过媒体查询、弹性布局等技术，可以使网页在不同设备上获得较好的展示效果。
响应式设计是现代网页设计与制作的常见要求。
三、前端开发技术1. jQueryjQuery是一个快速、简洁的JavaScript库，具有强大的DOM操作和事件处理能力。
掌握jQuery的使用可以简化网页开发过程，并提供丰富的插件和特效。
2. BootstrapBootstrap是一个用于设计和开发响应式网站的前端框架，提供了许多CSS和JavaScript组件，用于实现页面的布局和样式。
《网页设计》完整课件网页设计
目录
• 网页设计概述 • 网页设计基础 • 网页设计技巧 • 网页设计实战 • 网页设计工具 • 网页设计发展趋势
01
网页设计概述
定义与特点
定义
网页设计是使用HTML、CSS和 JavaScript等技术，对网页进行布局 、配色、排版和交互设计的艺术。
特点
网页设计具有跨平台、跨设备的特性 ，能够通过互联网快速传播信息，提 供良好的用户体验。
色彩搭配
色彩理论
掌握基本的色彩理论，了解颜色搭配的原则和技巧，如对比、调 和等。
品牌色彩
根据品牌形象和定位，选择合适的色彩搭配，以传达品牌价值和特 点。
色彩心理学
了解不同颜色给人的心理感受，根据目标用户的需求和喜好进行色 彩搭配。
排版与布局
字体选择
01
根据内容和风格，选择合适的字体，以提升页面可读性和视觉
3
丰富的符号库
提供各种符号库，方便设计师快速创建重复元素 。
Sketch
矢量设计
Sketch是一款专注于网页设计的矢量图形软件，支持多种 平台。
插件生态
Sketch拥有丰富的插件生态，可扩展其功能，满ch支持实时预览功能，方便设计师在多种设备上查看 设计效果。
可访问性
确保网站对所有用户都易于访问和使用，满 足不同用户的需求。
一致性
保持设计风格的一致性，有助于提高网站的 辨识度和专业度。
响应式设计
根据不同设备和屏幕大小自适应布局，提供 良好的跨平台体验。
02
网页设计基础
HTML基础
HTML标签
标题、段落、列表、链接、图片等常用标签的用法。
HTML语义化标签
Figma
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
实验一网页设计基础与概述
1实验目的
1)了解《网页设计基础》的基本内容；
2)了解Web 2.0时代的相关技术与服务；
3)掌握域名与URL的相关知识。
2实验内容
1)检索并下载和网页设计相关的不同类型文件，了解它们的大概结构；
2)搜索并列举著名的Web 2.0网站，了解它们使用的技术或提供的服务；
3)搜索并访问不同类别域名的网站。
3实验仪器、设备
1)PC机最低配置：2G Hz以上CPU；1G以上内存；1G自由硬盘空间；
2)Internet Explorer、Firefox、Chrome、Opera、Safari任意浏览器；
3)Macromedia Dreamweaver 8或Macromedia Dreamweaver CS3。
4实验要求
1)熟练使用搜索引擎；
2)准确把握Web 2.0网站的技术特点；
3)初步了解和网页相关的不同类型的文件内容；
4)熟悉域名的概念，熟练掌握URL的概念与结构。
5实验步骤
5.1检索并下载网页
检索并下载和网页设计相关的不同类型文件，了解它们的大概内容：
本实验的具体内容是从因特网下载扩展名分别为.htm(l)、.css和.js的文件，了解如何将它们保存到本地磁盘以及如何在保存后打开、查看它们的方法。
1)启动浏览器，进入自己平时习惯使用的搜索引擎界面，输入自己感兴趣的
主题作为关键词搜索相关网站或页面；
2)单击搜索结果返回的网站链接进入不同的网站或页面；
3)将鼠标移动到页面上的超级链接上，观察浏览器状态栏的显示的地址信
息，如果链接的地址以“.htm”或“.html”结尾，则单击该链接进入新页
面；如果页面上的所有链接均不以“.htm”或“.html”结尾，则返回步骤
（2）重新选择网站或页面进入并重复步骤（3），直到找到以“.htm”或
“.html”结尾的页面为止。
提示：如果使用的搜索引擎是Google，可以
直接在搜索框中填入“你感兴趣的话题filetype:htm”或“你感兴趣的话
题filetype:html”（注意把引号中的“你感兴趣的话题”换成自己的搜索
关键词），这样搜索出来的页面都将以.htm或.html结尾，这种方法可以替
代步骤（2）和（3）直接快速找到一个扩展名为.htm或.html的页面。
查
看Google的帮助，看看还有什么参数可以提高你的搜索的准确性。
4)在（3）中的.htm或.html页面上的空白区域处，单击右键，在右键菜单中
选择“查看源文件”命令，在弹出的记事本中会显示该网页的HTML源
代码；
5)在（4）中弹出的记事本中，使用菜单“编辑”→“查找”（或使用快捷键
Ctrl + F），在“查找内容”对话框中输入“.css”，单击“查找下一个”按
钮，确认在该HTML源代码中是否存在字符串“.css”，如果存在，请确
认字符串“.css”所在的行是否存在字符串“<link ”；同样地，查找字符
串“.js”，确认在该HTML源代码中是否存在字符串“.js”，如果存在，
确认字符串“.js”所在的行是否存在字符串“<script ”；
6)如果（5）中的任一字符串不存在，请返回（2），并重做步骤（3）、（4）、
（5）；否则，进入步骤（7）；
7)返回浏览器窗口，使用菜单“文件”→“另存为”菜单，在弹出窗口中，
选择保存目录，单击“保存”按钮；再次重复这个步骤，改变弹出窗口的
“保存类型”项为“Web 档案，单一文件(*.mht)”，使用相同的文件名，单击“保存”按钮保存文件；
8)切换到显示该页面HTML源代码的记事本窗口，将滚动条定位到包含字
符串“<link ”和“.css”的位置，观察该行“href=”后面的CSS文件路
径，如果该路径是一个包含域名的完整路径，则将该路径直接复制到浏览
器窗口的地址栏中，按回车键，在弹出的“文件下载”对话框中，单击“保
存”按钮将该.css文件保存到实验文件夹中；如果该路径不是一个包含域
名的完整路径，则复制该路径，切换到浏览器窗口，将地址栏中的文件名
（指最后一个“/”后面的带有“.htm”或“.html”的部分）去掉，将刚
才复制的路径粘贴到地址栏的最后，按回车键，在弹出窗口中单击“保存”
按钮保存文件到实验文件夹中；
9)在显示页面HTML源代码的记事本窗口中，定位滚动条到包含字符串
“<script ”和“.js”的位置，观察该行“src=”后面的JS文件路径，同
步骤8，下载该.js文件；
10)打开文件夹，双击每个保存的文件，记录默认打开它们的应用程序名；
11)在文件夹中，在保存的文件上单击右键，选择打开方式为“记事本”，观
察记事本中的内容，大致了解每个文件的内容，记录本实验的体会。
5.2搜索并列举著名的Web 2.0网站
1)启动浏览器，进入自己平时习惯使用的搜索引擎界面；
2)对于和Web 2.0相关的技术，使用类似于“使用AJAX的网站”作为关键
词；对于和Web 2.0相关的服务，直接使用服务名（如“播客”）作为关
键词，进行搜索；
3)通过搜索结果中的链接进入相关网站，记录网站的域名或页面的地址，并
总结网站的特点；
4)本实验要求完成的和Web 2.0相关的技术和服务包括：AJAX、RSS、Tag、
Wiki、Blog、SNS等，对它们重复步骤（1）、（2）和（3）。
对于不清楚
这些概念的同学，具体的概念可以通过搜索引擎进行搜索。
5.3搜索并访问不同类别域名的网站
1)启动浏览器，进入自己平时习惯使用的搜索引擎界面；
2)以.com为例，使用关键词“电子商务”进行搜索，在搜索结果中查找域
名以.com结束的网站或页面，单击进入该网站或页面，记录网站的域名或页面的地址，总结网站的内容；
3)对类别顶级域名后缀.net、.org、.int、.gov、.edu、.mil重复步骤（2）。
提
示：尽量使用和该种类型网站相符的关键字进行搜索；如果使用的搜索引擎是Google，可以使用这样的关键字“思科site:.net”直接限定只搜索顶级类别域名为.net的网站或网页；
4)可以访问/网站了解，域名的相关内容，并记录常用域
名后缀的含义。
6实验报告要求
1)详细写出需要自己动手做的实验内容的步骤；
2)给出程序运行过程中各个页面的截屏；
3)注意记录步骤中红色标注部分；
4)提交文件名格式：班级号-学号-姓名-实验一.doc；
7实验注意事项
1)看清实验指导书后再动手；
2)按实验指导书动手做实验的过程中要勤于思考；
3)实验中充分利用搜索引擎学习相关知识和解决问题，同时要掌握如何利
用高级搜索功能快速找到相关网页。
8思考题
除了我们常见的html或htm页面，还有那些常见的文件格式？
9扩展阅读
查看一些网站首页源代码，可以看到第一行就是：
打开一些符合标准的站点，例如著名web设计软件开发商Macromedia，设计大师Zeldman的个人网站，会发现同样的代码。
那么这些代码有什么含义？一定要放置吗？
9.1什么是DOCTYPE？
上面这些代码我们称做DOCTYPE声明。
DOCTYPE是document type(文档类型)的简写，用来说明你用的XHTML或者HTML是什么版本。
其中的DTD(例如上例中的xhtml1-transitional.dtd)叫文档类型定义，里面包含了文档的规则，浏览器就根据你定义的DTD来解释你页面的标识，并展现出来。
DOCTYPE声明必须放在每一个XHTML文档最顶部，在所有代码和标识之上。
要建立符合标准的网页，DOCTYPE声明是必不可少的关键组成部分；除非你的XHTML确定了一个正确的DOCTYPE，否则你的标识和CSS都不会生效。
XHTML 1.0 提供了三种DTD声明可供选择：
过渡的(Transitional)：要求非常宽松的DTD，它允许你继续使用HTML4.01的标识(但是要符合xhtml的写法)。
完整代码如下：
严格的(Strict):要求严格的DTD，你不能使用任何表现层的标识和属性，例如<br>。
完整代码如下：
框架的(Frameset):专门针对框架页面设计使用的DTD，如果你的页面中包含有框架，需要采用这种DTD。
完整代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "/TR/xhtml1/DTD/xhtml1-frameset.dtd">
9.2我们选择什么样的DOCTYPE
理想情况当然是严格的DTD，但对于我们大多数刚接触web标准的设计师来说，过渡的DTD(XHTML 1.0 Transitional)是目前理想选择。
因为这种DTD还允许我们使用表现层的标识、元素和属性，也比较容易通过W3C的代码校验。
注：上面说的“表现层的标识、属性”是指那些纯粹用来控制表现的tag，例如用于排版的表格、背景颜色标识等。
在XHTML中标识是用来表示结构的，而不是用来实现表现形式，我们过渡的目的是最终实现数据和表现相分离。
打个比方：人体模特换衣服。
模特就好比数据，衣服则是表现形式，模特和衣服是分离的，这样你就可以随意换衣服。
而原来HTML4中，数据和表现是混杂在一起的，要一次性换个表现形式非常困难。
呵呵，有点抽象了，这个概念需要我们在应用过程中逐步领会。