网站建设课件课件(网页设计基础)
合集下载
相关主题
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
3、左右框架：被垂直划分为两个或多个框架 4、上下框架：被水平划分为两个或多个框架的 网页布局结构 5、封面框架：作为个性化网站的首页 小任务：上网任意浏览网页说出是何框架
新课教学
三、任务三
查找网站整体策划
1、市场调查 2、市场分析 3、制定网站技术方案 4、规划网站内容 5、前台设计 6、后台开发 7、网站测试 8、网站发布 9、网站推广 10、网站维护 小任务：让学生举例说明鲜花购物网的整体策划，对学生 的讲解进行点评、指导。
拓展训练
如何更改Photoshop中显示的窗口字体？ Photoshop提供了两种字体基准大小，用于显
示界面中各种面板上的文本。 在默认状态下，Photoshop以12px的尺子显示
各种面板上的文本。如用户需要以10px的尺子显示 这些文本，则可执行编辑首选项界面命令，在用户 界面文本选项的项目下，设置用户界面字体大小 “小”。
新课教学
四、任务四
查找网页色彩基础
1、找出RGB三原色光颜色 红（Red）绿（Green)蓝（Blue） 2、色彩三要素：色相、饱和度、明度三种基本属性 3、6种基本色相：红、橙、黄、绿、蓝、紫 4、饱和度：又称彩度、纯度、色彩的饱和度越高，则色相 越明确，反之，则越弱。 5、明度：色彩的明暗程度，也称光度、深浅度 6、色彩模式：RGB色彩模式，CMYK色彩模式 7、Web216安全色 小任务：让学生记忆以上知识点，然后提问。
第1章 网页设计基础
教学准备
一、熟悉教材，制作PPT 二、督促学生认真听讲，检查学生到位情况
教材内容分析
本章节主要包括网页设计基础 包含：
1、网页界面构成 2、网页板块结构 3、网站整体策划 4、网页色彩基础 5、Dreamweaver CS 简介 6、PhotoShop CS 简介 7、Flash CS 简介 8、网页设计的理念
教学方法
工作过程导向+探究式学习+任务驱动教 学法
教学回顾
本次课属于新授课，回顾之前已经接触 的各种软件，Dreamweaver、Photoshop、 Flash软件
新课导入
从本学期开始我们将在原来学习软件的 基础上，继续新的学习，网站建设。有没有 哪个同学告诉我，网页包含了哪些部分。
新课教学
新课教学
五、任务五 Dreamweaver
熟悉界面，回顾知识点。
六、任务六 Photoshop
熟悉界面，回顾知识点。
Fra Baidu bibliotek七、任务七 Flash
熟悉界面，回顾知识点。
本章小结
本章主要讲述了网页设计基础的相关知识，详细介 绍了网页界面的构成，网页板块结构，网站整体策划， 网页色彩基础，网页设计理念等相关知识。
一、任务一 查找网页界面构成 1、LOGO 2、导航条 3、Banner 4、内部板块 5、版尾 6、版权 小任务：用笔和纸画出你心目中鲜花购物网的 页面，包含以上六个部分。
新课教学
二、任务二 查找网页板块结构
1、“国”字框架：最上方为logo,左右两侧两 小条，最下面版权。
2、拐角框架：同“国”字框架形式上区别，内 容版只有一侧有侧栏，导航侧栏90度直角。
在更改用户界面字体大小的属性后，即可重新 启动Photoshop，此时Photoshop将按照新定义的尺 寸显示各面板中的文本。
作业
1、网页界面的构成
知识回顾 Knowledge Review
重难点分析
掌握网页界面构成、网页板块结构、网页设计
的理念
了解网站整体策划、网页色彩基础、 Dreamweaver CS 简介、Photoshop CS 简介、 Flash CS 简介
主要教学思路
以工作过程为导向，以对应工作岗位的 实际工作任务引入，提出任务，探究式学习， 让学生分析任务，找出解决任务的方法—— 肯定，点评学生的收获——和学生一起分析 任务——明确任务——做必要的指点和讲 解——以学生为主体完成任务——教师重在 引导——教师做必要的点评和引导小结，拓 展提问，布置作业
新课教学
三、任务三
查找网站整体策划
1、市场调查 2、市场分析 3、制定网站技术方案 4、规划网站内容 5、前台设计 6、后台开发 7、网站测试 8、网站发布 9、网站推广 10、网站维护 小任务：让学生举例说明鲜花购物网的整体策划，对学生 的讲解进行点评、指导。
拓展训练
如何更改Photoshop中显示的窗口字体？ Photoshop提供了两种字体基准大小，用于显
示界面中各种面板上的文本。 在默认状态下，Photoshop以12px的尺子显示
各种面板上的文本。如用户需要以10px的尺子显示 这些文本，则可执行编辑首选项界面命令，在用户 界面文本选项的项目下，设置用户界面字体大小 “小”。
新课教学
四、任务四
查找网页色彩基础
1、找出RGB三原色光颜色 红（Red）绿（Green)蓝（Blue） 2、色彩三要素：色相、饱和度、明度三种基本属性 3、6种基本色相：红、橙、黄、绿、蓝、紫 4、饱和度：又称彩度、纯度、色彩的饱和度越高，则色相 越明确，反之，则越弱。 5、明度：色彩的明暗程度，也称光度、深浅度 6、色彩模式：RGB色彩模式，CMYK色彩模式 7、Web216安全色 小任务：让学生记忆以上知识点，然后提问。
第1章 网页设计基础
教学准备
一、熟悉教材，制作PPT 二、督促学生认真听讲，检查学生到位情况
教材内容分析
本章节主要包括网页设计基础 包含：
1、网页界面构成 2、网页板块结构 3、网站整体策划 4、网页色彩基础 5、Dreamweaver CS 简介 6、PhotoShop CS 简介 7、Flash CS 简介 8、网页设计的理念
教学方法
工作过程导向+探究式学习+任务驱动教 学法
教学回顾
本次课属于新授课，回顾之前已经接触 的各种软件，Dreamweaver、Photoshop、 Flash软件
新课导入
从本学期开始我们将在原来学习软件的 基础上，继续新的学习，网站建设。有没有 哪个同学告诉我，网页包含了哪些部分。
新课教学
新课教学
五、任务五 Dreamweaver
熟悉界面，回顾知识点。
六、任务六 Photoshop
熟悉界面，回顾知识点。
Fra Baidu bibliotek七、任务七 Flash
熟悉界面，回顾知识点。
本章小结
本章主要讲述了网页设计基础的相关知识，详细介 绍了网页界面的构成，网页板块结构，网站整体策划， 网页色彩基础，网页设计理念等相关知识。
一、任务一 查找网页界面构成 1、LOGO 2、导航条 3、Banner 4、内部板块 5、版尾 6、版权 小任务：用笔和纸画出你心目中鲜花购物网的 页面，包含以上六个部分。
新课教学
二、任务二 查找网页板块结构
1、“国”字框架：最上方为logo,左右两侧两 小条，最下面版权。
2、拐角框架：同“国”字框架形式上区别，内 容版只有一侧有侧栏，导航侧栏90度直角。
在更改用户界面字体大小的属性后，即可重新 启动Photoshop，此时Photoshop将按照新定义的尺 寸显示各面板中的文本。
作业
1、网页界面的构成
知识回顾 Knowledge Review
重难点分析
掌握网页界面构成、网页板块结构、网页设计
的理念
了解网站整体策划、网页色彩基础、 Dreamweaver CS 简介、Photoshop CS 简介、 Flash CS 简介
主要教学思路
以工作过程为导向，以对应工作岗位的 实际工作任务引入，提出任务，探究式学习， 让学生分析任务，找出解决任务的方法—— 肯定，点评学生的收获——和学生一起分析 任务——明确任务——做必要的指点和讲 解——以学生为主体完成任务——教师重在 引导——教师做必要的点评和引导小结，拓 展提问，布置作业