网页制作综合实训项目六-个人网站建设课件

1、项目六 个人网站建设项目六 个人网站建设项目六 个人网站建设教学内容一、项目分析与网站定位二、网站栏目设计三、制作网站主页设计效果图四、制作个人网站分页效果图五、网站测试服务器（IIS）环境搭建六、按效果图作页面七、制作留言板八、项目展评项目六 个人网站建设教学内容项目六 个人网站建设一、项目分析与网站定位 1、阅读项目情景文件 2、分析项目目的 3、分析项目技术要求 4、分析项目主要工作内容项目六 个人网站建设一、项目分析与网站定位 1、阅读项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结1.网站主题网站的主题应遵循的原则如下：1）、主题要小而

2、精：2）、题材最好是你自己擅长或者喜爱的内容3）、题材不要太滥或者目标太高。项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结2、网站定位2.网站风格在网页设计制作过程中，整个页面设计利用Photoshop设计，体现出个人的创新力和想象力。导航栏放置在页面的上方，并方便访问者浏览信息，并设置有留言板块，便于访客交流。整个页面设计清新爽朗，颜色明快生动，彰显个性。3.技术定位根据网站内容要求，要求具有留言功能，则需要搭建服务器环境，结合数据库和相关脚本程序来完成项目六 个人网站建设一 项目情

3、境二 项目引入三 项目实施四 项目六 个人网站建设二、网站栏目设计一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结1、根据个人网站主题的定位，本网站的栏目主要为：首页 日志 相册 作品集 就业方向 给我留言2、根据栏目要求，本网站的站点结构图如下项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目六 个人网站建设三、制作网站主页设计效果图一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结（一）网站主页效果图设计 项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目六 个人网站建设一 项目情境二 项目引入三 项目实施四

4、 项目修改评价五 项目验收六 项目小结（二）、效果图分析1)页面顶部页面顶部包含的内容有：网站标志LOGO、网站导航。2)页面主体页面主体以一张用于翻页的图片作为背景，所包含的内容有：左部导航（链接个人作品及各科目学习）、个人简介、个人生活照、个人宣言。3)网页左部导航：设置导航，主要用于链接个人各科目学习资料、作品等，有助于访客了解个人能力。4)页面底部页面底部用于放置版权信息项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结（三）、主页绘制1、素材准备、新建文件、图层文件夹建立2、lo

5、go设计3.导航绘制4.左部导航制作5.网页主体设计6.网页底部项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目六 个人网站建设四、制作个人网站分页效果图一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结作品集效果图项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目六 个人网站建设四、制作个人网站分页效果图一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结给我留言效果图项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目六 个人网站建设四、制作个人网站分页效果图一 项目情境二 项目引入三 项目实施四

6、项目修改评价五 项目验收六 项目小结日志效果图项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目六 个人网站建设四、制作个人网站分页效果图一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结就业意向效果图项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目六 个人网站建设四、制作个人网站分页效果图一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结相册效果图项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目六 个人网站建设五、网站测试服务器（IIS）环境搭建一 项目情境二 项目引入三 项目实施四 项目修改评

7、价五 项目验收六 项目小结1.在XP系统中安装IIS（针对XP系统安装）2.安装步骤：打开左下角的开始菜单-控制面板-选择添加/删除程序,打开添加/删除程序窗体-点击窗体左侧添加/删除Windows组件(A)项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目六 个人网站建设五、网站测试服务器（IIS）环境搭建一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结3.在IIS中设置站点4.设置站点属性项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目六 个人网站建设六、按效果图作页面一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收

8、六 项目小结1、创建站点项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目六 个人网站建设六、按效果图作页面一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结2、设置服务器：本地/网络项目六 个人网站建设六、按效果图作页面一 项目情境二 项目引项目六 个人网站建设六、按效果图作页面一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结4、创建文件及目录在站点目录内创建相应的目录和主页文件，如index.asp(主页)、image（图片）、flash(动画)、zpj（作品集）、web（子页）等项目六 个人网站建设六、按效果图作页面一

9、项目情境二 项目引项目六 个人网站建设六、按效果图作页面一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结5、源文件的导出与保存6、进行页面效果图图片切割项目六 个人网站建设六、按效果图作页面一 项目情境二 项目引项目六 个人网站建设六、按效果图作页面一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结7、制作导航项目六 个人网站建设六、按效果图作页面一 项目情境二 项目引项目六 个人网站建设六、按效果图作页面一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结7、横幅广告制作：利用CSS样式设置背景项目六 个人网站建设

10、六、按效果图作页面一 项目情境二 项目引项目六 个人网站建设六、按效果图作页面一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结8、.网页主体内容制作项目六 个人网站建设六、按效果图作页面一 项目情境二 项目引项目六 个人网站建设六、按效果图作页面一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结9、.网页底部制作：利用CSS样式制作背景项目六 个人网站建设六、按效果图作页面一 项目情境二 项目引项目六 个人网站建设六、按效果图作页面一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结10、.网页底部效果项目六 个人网

11、站建设六、按效果图作页面一 项目情境二 项目引项目六 个人网站建设六、按效果图作页面一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结11、.设置网页的链接1）绘制热区2）设置链接项目六 个人网站建设六、按效果图作页面一 项目情境二 项目引项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结七、按分页效果图作页面1、根据各个效果图，结合主页效果图制作出主页2、特殊图形的切割项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小

12、结八、制作留言1、创建数据库2、创建表字段名字段类型备注Name文本长度为10，存储用户名Content备注用于存放留言Shijian日期格式为中日期，默认值为“=now（）”项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目六 个人网站建设八、制作留言3、输入数据3、输入数据NameContentShijian晴晴头痛，不想了，想多了也没用。自动生成秋秋偶尔也可以打几个喷嚏，代表我在想你自动生成兰兰最珍惜，好友的问候，纵然人生聚散无常，念你的心依旧。自动生成连连但愿美好的回忆，不要从岁月里匆匆走过，让它永驻我们心中。自动生成娟娟远方的你可要好好照顾好自己，不要感冒了流鼻涕自动生

13、成项目六 个人网站建设八、制作留言3、输入数据3、输入数据Na项目六 个人网站建设八、制作留言一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结4、在留言页面制作表单5、在表单内插入表格，并编辑项目六 个人网站建设八、制作留言一 项目情境二 项目引入三 项目六 个人网站建设八、制作留言一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结6、检查服务器环境是否具备数据库连接项目六 个人网站建设八、制作留言一 项目情境二 项目引入三 项目六 个人网站建设八、制作留言一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结7、连接

14、数据库项目六 个人网站建设八、制作留言一 项目情境二 项目引入三 项目六 个人网站建设八、制作留言一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结9、保存留言：“插入记录”项目六 个人网站建设八、制作留言一 项目情境二 项目引入三 项目六 个人网站建设八、制作留言一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结10、创建记录集项目六 个人网站建设八、制作留言一 项目情境二 项目引入三 项目六 个人网站建设八、制作留言一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结11、显示留言：插入字段项目六 个人网站建设八、

15、制作留言一 项目情境二 项目引入三 项目六 个人网站建设八、制作留言一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结12、制作重复区域项目六 个人网站建设八、制作留言一 项目情境二 项目引入三 项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结九、项目展评1、班级初评：1）展示并介绍项目作品2）每个小组推荐一个代表在班级上展示2、老师作为评委综合各小组建议给予意见3、填写评价表和学生工作页10、项目总结1、总结本项目过程中各个选手的完成情况2、点评各小组代表作品项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目六 个人网站建设一 项目情境二 项目引入三 项目实施四 项目修改评价五 项目验收六 项目小结项目六 个人网站建设一 项目情