1、情境导入情境导入讨论讨论 1、周末同学们最想干什么? 2、平时经常浏览的网站有哪些？ 新课新课确定主题及名称确定主题及名称 网站的规划是指建立网站前对网站需求分析或市网站的规划是指建立网站前对网站需求分析或市 场分析，确定网站的目的和功能，并根据需要对网站场分析，确定网站的目的和功能，并根据需要对网站 建设中的技术、内容、费用、测试、维护等工作做好建设中的技术、内容、费用、测试、维护等工作做好 充分的考虑，网站的规划对网站建设起到计划和指导充分的考虑，网站的规划对网站建设起到计划和指导 作用，对网站的内容和维护起到定位作用。作用，对网站的内容和维护起到定位作用。 网站的规划从哪里开始？网站的规
2、划从哪里开始？ 给10秒钟时间，大家看以下10个网站的名字， 看谁记得最多: 游戏游戏 一个别具一格、朗朗上口的网站名称能令人印象深刻，不但能一个别具一格、朗朗上口的网站名称能令人印象深刻，不但能 让用户了解网站的主题内容，而且还能吸引更多浏览者让用户了解网站的主题内容，而且还能吸引更多浏览者 。网站网站 的规划从选择网站的主题开始。网站的选题，就是要根据网站的规划从选择网站的主题开始。网站的选题，就是要根据网站 的开发目标和访问网站的用户群，确定网站的主题，并给网站的开发目标和访问网站的用户群，确定网站的主题，并给网站 起一个简练响亮的名字。起一个简练响亮的名字。 淘宝网 蕃薯藤 红袖添香
3、榕树下 硅谷动力 问天网 网行天 音乐极限 京东 百度 北京烤鸭 新课新课确定主题及名称确定主题及名称 总结总结 确定网站主题确定网站主题 主题要小而精： 选择你擅长或喜爱的内容： 贴近生活实际： 网站的网站的主题主题与与名称名称 主题主题 研究校研究校 园生活园生活 地方地方 特色特色 关于关于 音乐音乐 关于关于 书籍书籍 关于关于 运动运动 网站网站 名称名称 网站名称 百度MP3 主题设置 最新音乐资讯 歌曲下载等 新课新课确定主题及名称确定主题及名称 网站名称 主题设置 肯德基官方网站 网上订餐、打 印优惠券等、 新课新课确定主题及名称确定主题及名称 任务一：任务一： 请同学们小组讨
4、论完成网站的规划与设计任务 单中的任务一。 （可以浏览并参考推荐网站） 网站名称网站名称 网站主题网站主题 选择理由选择理由 注意事项：注意事项： （1）主题内容积极向上。）主题内容积极向上。 （2）名称要紧扣主题。）名称要紧扣主题。 （3）可以参考老师提供的网站欣赏）可以参考老师提供的网站欣赏 新课新课确定主题及名称确定主题及名称 我们要把一个优秀的网站由蓝图变为 现实的第一个步骤就是网站设计，那到底 如何进行设计呢？这就好比写一篇文章， 首先要拟好提纲文章才能主题明确，层次 清晰，所以，主题选好后，第一步要设置 栏目。 过过 渡渡 栏目 地理资讯地理资讯 |-考古 |-探奇 |-图片 地理
5、论坛地理论坛 行游天下行游天下 |-路书 |-攻略 |-地图 个人门户个人门户 手机媒体手机媒体 会员活动会员活动 电子杂志电子杂志 地理基金地理基金 新课新课栏目设置栏目设置 栏目栏目 网站首页网站首页 学校概况学校概况 新闻公告新闻公告 教学科研教学科研 师生风采师生风采 德育之窗德育之窗 党政园地党政园地 新课新课栏目设置栏目设置 子栏目子栏目 课改之窗课改之窗 理论研究理论研究 资源中心资源中心 任务二：任务二：各小组交流讨论，确定本小组主题网站的栏目， 完成网站的规划与设计任务单中的任务二 网站名称网站名称 栏目栏目 内容描述内容描述 注意事项：注意事项： （1）要紧扣主题，尽可能删
6、除与主题无关的栏目）要紧扣主题，尽可能删除与主题无关的栏目 （2）尽可能将网站最有吸引力的内容列在栏目上）尽可能将网站最有吸引力的内容列在栏目上 （3）尽可能方便访问者的浏览和查询。）尽可能方便访问者的浏览和查询。 新课新课栏目设置栏目设置 网海茫茫，能够吸引我们眼球的只有那些 有特色的网页，大量的网页引不起网民的兴 趣，究其原因，站点内容是否丰富是其中一 个方面，而网页的版面设计是否精美也是重 要因素之一。 过过 渡渡 常见样式常见样式 “厂厂”字型即偏置型字型即偏置型 页面顶部为主菜单以 及横条网站标志+广 告条，下方左面为主 菜单，右面显示内容 的布局 特点特点 优点优点： 页面结构清晰
7、， 主次分明； 缺点缺点： 呆板，如果细节色彩 上不注意，容易“看 之无味” 网站标志网站标志 广告条广告条 主菜单主菜单 横条等横条等 栏目栏目 菜单菜单 主要内容主要内容 新课新课版面规划布局版面规划布局 常见样式常见样式 “口”字型即对称性 页面一般上下各有 一个广告条，左面 是主菜单，右面放 友情链接等，中间 是主要内容 特点特点 优点优点： 充分利用版面，信 息量大，与其他页 面的链接多，切换 方便； 缺点缺点： 页面拥挤，不过灵 活 网站标志网站标志 广告条广告条 主菜单主菜单 横条等横条等 广告条广告条 栏目栏目 菜单菜单 友情友情 链接链接 主要内容主要内容 二、新课二、新课版
8、面规划布局版面规划布局 常见样式常见样式 自由式： 又称POP布局页面布 局像一张宣传海报， 以一张精美图片作 为页面的设计中心， 菜单栏目自由摆放 特点特点 优点优点： 漂亮、吸引人，适 宜于艺术类网站 缺点缺点： 显示速度慢，文字 信息量少 页面布局像一张宣传海报，以一张精 美图片作为页面的设计中心，菜单栏 目自由摆放。 新课新课版面规划布局版面规划布局 任务三：任务三：请参考常见的版面布局样式，为自己的某一张网 页进行版面布局，有时间的同学可以选择多个样式设计多 张网页。完成网站的规划与设计任务单中的任务二（请标注 好每个版面的用途） 示例示例 主要内容主要内容 标题图片标题图片 栏目栏
9、目 其他其他 新课新课版面规划布局版面规划布局 课堂检测课堂检测 1、网站具有（、网站具有（ ），网站中有（），网站中有（ ）个网页，）个网页， （ ）首页。）首页。 2、网页包含（、网页包含（ ）（）（ ）（）（ ）（）（ ） （ ）等各种信息。）等各种信息。 3、网站的建立过程包括（、网站的建立过程包括（ ）（）（ ） （ ）等过程。）等过程。 4、网站布局主要有（、网站布局主要有（ ）（）（ ） （ ）（）（ ）。）。 整体性整体性 多个多个 只有一个只有一个 文本文本 图像图像 声音声音 视频视频 动画动画 网站规划网站规划 制作网页制作网页 发布维护网站发布维护网站 厂字型厂字型 口
10、字型口字型 标题型标题型 自由型自由型 5、一个网站中的网页是通过（、一个网站中的网页是通过（ ）连在一起的。）连在一起的。 6、网站主页默认的文件名为、网站主页默认的文件名为（ ）。 超链接超链接 index.htm 课堂小结课堂小结 2、本节课我们了解了网站建设的几个主要过程：、本节课我们了解了网站建设的几个主要过程： 3、我们主要学习了网站规划与设计部分的：、我们主要学习了网站规划与设计部分的： （1）确定主题及名称 （2）栏目设置 （3）版面规划布局 1、基本概念、基本概念 课外拓展课外拓展 1、网站标志、网站标志 2、网站的风格及色调、网站的风格及色调 3、围绕主题搜集和处理素材、围绕主题搜集和处理素材 Thank you !
