网页设计与制作子教案.pptVIP

第一单元 网页设计与制作（上）袁小红 主讲 深圳职业技术学院 引言 0.1 任务引入 0.2 整体解决方案 0.3 学习计划与任务分解 学习计划 学习情景一 体验互联网 学习目标 互联网是一切Web（网页）应用的基础。要学习设计网页，建立网站，必要的互联网知识和技能是必须掌握的。本学习情景是本书学习的基础篇，学习和掌握本学习情景的知识和技能，将为后面内容的学习奠定坚实的基础。 重点： ·域名 ·IP地址 ·ISP ·Internet提供的服务 ·网页制作常用技术 难点： ·域名 ·IP地址 学习情景一 体验互联网 任务一：了解Internet基础知识 任务二：了解Internet规范 任务三：了解Internet提供的服务 任务四：了解Internet的发展 任务五：了解网页制作常用技术 任务一：了解Internet基础知识 一、初识Internet 思考：有哪些应用？ 1 Internet的起源 2 Internet在中国的发展 3 Internet与Intranet 任务二：了解Internet规范 1 Internet管理 2 域名、IP地址及ISP 任务三：了解Internet提供的服务 1 信息浏览（WWW） 2 电子邮件（E-mail） 3 远程登录（Telnet） 4 文件传输（FTP） 5 信息搜索 6 视频点播（VOD）与视频会议 7 电子商务（E-Commerce） 思考：还有哪些服务？ 任务四：了解Internet的发展 1 制约Internet发展的因素 2 Ipv6 任务五：了解网页制作常用技术 1 网页制作三剑客 2 HTML标记语言 3 ASP技术 4 ASP.NET技术 5 JSP和PHP技术 学习情景二 设计网页页面——Fireworks 8应用 学习目标 网站的制作，首先要进行网页的设计与制作，如何能够设计出一个美观、易用的网页界面，是这一学习情景的教学目的。 重点： ·图形图像编辑 ·图层与蒙版 ·滤镜 ·切片与热区 ·按钮 难点： ·蒙版 ·切片 学习情景二 设计网页页面——Fireworks 8应用 任务一：安装与了解Firework 8 任务二：制作图形图像与文字 任务三：添加图层与蒙版 任务四：添加特效与动画 任务五：制作交互网页 任务六：综合案例——学苑小居网站首页设计 任务一：安装与了解Firework 8 1 安装与启动Fireworks 8 2 熟悉Fireworks 8工作界面 3 操作文档 4 设置画布与图像属性 5 利用历史记录面板 任务二 制作图形图像与文字 1 编辑矢量图 2 编辑文本 3 编辑位图 4 图层及蒙板 5 滤镜与特效 6 交互网页制作 7 综合实训 绘制矢量图 编辑矢量图 2．选择矢量图对象 三种基本的对象选择工具 ： “指针”工具：选择、拖放对象或路径。 “选择后方对象”工具：在图层或图组中选择被遮盖了的对象。 “次选”工具：选择组合中的某个对象或对象的局部 。 编辑矢量图 3．对象的管理 ·对象的组合的操作 ·要撤销该组合对象的操作 编辑矢量图 4．对象变形 缩放变形工具 自由变形工具 编辑矢量图 5．路径的组合与改变 【修改】→【组合路径】 对多个路径进行合并、联合、相交、打孔和裁切等操作。并可对合并的路径进行拆分 【修改】→【改变路径】 对路径进行简化、扩展笔触、伸缩路径等操作。 矢量图编辑 6．布局工具 ·显示标尺 ·显示网格 ·对齐网格 ·编辑网格 ·显示引导线 编辑文本 1．文本的创建 2．文本属性 3．移动文本 4．调整文本区域的大小 5．文本的缩放、倾斜和旋转 6．文本附加到路径上,；例：校徽 7．将文本路径化 立体字效果 金属字效果 霓虹灯效果 编辑位图 1．查看编辑模式 2．创建位图 3．位图区域的选取与调整 4．位图的编辑 5．重复绘制 魔术棒等工具选择区域 操作：选择一棵树并保存 橡皮图章/红眼消除工具 替换颜色 图层及蒙板 图层的概念 ： 图层可以看成是叠放在一起的透明的胶片，如果层上没有任何东西的话，就可以透过它直接看到下一层。 图层 1．创建图层 2．选取图层 3．复制图层 4．重命名图层 5．改变图层排列顺序 6．删除图层 7．在图层中编辑对象 8．设置图层属性 9．在帧中共享图层 撕裂的照片 文本附加到路径 作业: 绘制我校校徽 要求：透明底，PNG格式 制作阴阳文字 举一反三： 图层及蒙板 蒙版的概念 ： 被蒙对象显示的