➢ 不要将所有文件都存放在根目录下 ➢ 建立子目录（子文件夹）对文件进行分类存放 ➢ 目录名不采用中文命名（切忌），采用具有一定含义的英
文、数字组合进行命名 ➢ 在每个子目录下都建立独立的images目录 ➢ 目录的层次不要太深 ，建议不要超过3层 ➢ 模板（Library）和库(Templates)文件夹一定要位于站
任务一课堂实践
1．浏览以下站点，对所浏览网站首页的特色和不足进行赏析说 明，主要包括页面布局结构、颜色搭配、导航栏、文字效果、 图片效果、动画效果、音频效果等。 （1）狮子林网站：/ （2）清华大学网站：/ （3）太平洋电脑网： 2．通过上述站点中页面的欣赏，请说出网页的基本构成元素有 哪些？
任务一：欣赏优秀网站
虎丘主页
任务一：欣赏优秀网站
虎丘主页特色
各类边框体现了古典的特色 题头的图片和文字的动画效果展示了虎丘景点的级别及 多角度的美景展示 主页的整体布局为“上、中、下”三个版块，中间的主 体内容又分为“左、右”二个版块，布局清晰
任务一：欣赏优秀网站
三、体育类网站欣赏
欣赏“中国大众体育网”的网站： 启动IE浏览器，输入网址：
工作任务列表
任务一：欣赏优秀网站 任务二：规划班级网站，书写网站建设方案
任务一：欣赏优秀网站
一、公司类网站欣赏
欣赏海尔集团的网站： 启动IE浏览器，输入网址：
任务一：欣赏优秀网站
海尔网站首页特色
该首页给人以清体内容又分为“左、右”二个版块。 颜色上主要采用玫瑰红色为主，玫瑰红给人温馨、浪漫的感受， 并与网站的logo标志颜色达到和谐统一的效果。 首页题头的动化效果为Haier公司的产品广告,既达到了产品 宣传的目的，又达到了美化的效果。 导航栏的颜色鲜明，文字仍采用玫瑰红色，文字与背景色对 比强烈，引人注目。二级导航采用横式排列，占据了中间主体 部分。
任务一：欣赏优秀网站
二、旅游类网站欣赏
欣赏“虎丘旅游网”的网站： 启动IE浏览器，输入网址：
网站带有引导页：
任务一：欣赏优秀网站
虎丘引导页特色
将虎丘的名景点以动画的形式显示在页面的右方 苏轼的题词以动画的形式缓慢展示出来 蝴蝶的翩翩起舞与金鱼的自由自在的畅游结合在一起，给人一 种清闲之感 各种语言（简体中文、繁体中文、日本语、英语等）的引导 框显示在右下方 当欣赏完引导页的优美意境后，默认进入简体中文主页面。
四、新闻类网站欣赏
欣赏“新浪网站新闻页” ： 启动IE浏览器，输入网址：/
任务一：欣赏优秀网站
新浪网站新闻页特色
各类新闻用标题栏加以划分，简洁明了、排列整齐， 使得较大的信息量显示有条有理。 颜色的搭配上主要采用蓝色，左右两侧版块的字体大 小相同，字体颜色为蓝色，给人以清新、和谐的视觉美感。 该网页给人的视觉感受是和谐美观，在模块的划分上比 较明显，采用“左、中、右”三个版块，内容充实。
任务一：欣赏优秀网站
中国大众体育网主页特色
背景、字体为红色，给人以阳光、活力向上的感觉。 在字体的运用上有大有小，有长有短，显得有对比， 庄重。 图片的动态效果突出主题，产生运动的视觉感受。 该网站的首页整体视觉感受清晰、和谐。 整体颜色采用红色，既统一又有变化，主体突出。
任务一：欣赏优秀网站
➢ 页面标准在1024*768像素分辨率下，网页宽度保持在 980-1003像素以内，一般按1003像素制作，就不会出现 水平滚动条，高度则视版面和内容决定。
➢ 页面高度原则上不超过3屏，宽度不超过1屏。 ➢ 每个标准页面为A4幅面大小，即8.5*11英寸。
任务二：规划班级网站，书写网站建设方案
（2）网站目录结构规范
3、对自己的班级网站进行规划，并书写网站建设方案
任务二：规划班级网站，书写网站建设方案
表 XXXX网络有限公司《客户需求说明书》
企业（单位）名称
所属 行业
步骤2：环境的搭建与调试 步骤3：网站主页的设计与制作
任务二：规划班级网站，书写网站建设方案
步骤4：分支页面的设计与制作、后台的建设及测试 步骤5：设置链接、测试、发布、推广、维护网站
2、网站建设遵循的规范
（1）尺寸规范
➢ 页面标准在800*600像素分辨率下，网页宽度保持在 760-780像素以内，就不会出现水平滚动条，高度则视版 面和内容决定。
任务二：规划班级网站，书写网站建设方案
1、熟悉网站建设的流程
建立一个网站就像盖一幢大楼一样，它是一个系统工程， 有自己特定的工作流程，你只有遵循这个步骤，按部就班 地一步步来，才能设计出一个满意的网站。
设计与制作网站的五大步骤： 步骤1：规划站点
需求分析－ 总体设计,书写建设方案－确定网站的目录结构－规划 和收集资料 －选择网页制作工具
点根目录之下并不能被更名，否则在使用模板和库就会出 错
任务二：规划班级网站，书写网站建设方案
（3）主页文件命名规范
主页文件的命名，一般用index.htm（index.html index.asp index.jsp index.php等），或 default.htm(html、asp、jsp、php)，放在站点的 根目录下。 用index作为主文件名，index表示“索引”（指首页 放满了去网站其他地方的链接），一般网站发布时服务 器默认识别index，所以采用index作为主页文件主名。
课程主要内容
主要内容
项目一 规划网站 项目二 环境的搭建与调试 项目三 主页的设计与制作 项目四 分支页的设计与制作 项目五 网站的测试、发布与维护
知识技能目标
1、欣赏优秀网页，学习他人之长； 2、分析优秀网页的布局结构、颜色搭配、视觉效果； 3、清楚网页的组成元素及网站的建设流程； 4、会规划网站，会书写网站建设方案；