网页艺术设计课件(第七章).ppt

高等教育电子音像出版社 第七章网页设计艺术实战 内容提要 使用DreamWeaver软件和Photoshop软件综合完成一个网络课程教学网站 关键词 前期策划网站制作 第一节网页设计的前期策划 一 设计色彩 网站项目的简要分析网络课程是当今远程教育和终生教育发展下的必然产物 设计色彩 课程是一门普通高校艺术类网络课程 主要应用于在校本科学生课余辅助教学及非在校成人教育学生远程学习 它有助于充分利用学生的课余时间 提高学生的研究性学习能力和学习效率 二 网站的接受对象分析 设计色彩 网络课程面向的对象主要是艺术设计专业和美术学专业的低年级学生 从年龄段来看主要以分布在18 22岁之间 他们普遍具有爱好广泛 求知欲望强 能够接受新鲜事物的特点 但也存在学习注意力容易分散的问题 因此 设计色彩 网络课程需要在界面风格设计上符合年轻人的特点 在栏目设置及内容安排上更贴近他们的学习实际 以产生足够的吸引力 三 申请网站空间和域名网站只有上传到服务器上才能被别人访问 所谓网站空间是指网站在服务器中拥有的存储空间 而域名则是网络中网站的名称 二者都需要向网络服务商申请或购买才能得到 要注意在申请服务器空间过程中填写的FTP帐号及FTP密码一定要记牢 这是我们今后使用服务器空间的 钥匙 没有它 我们将无法向服务器上传网站文件 四 确定网站的内容以及栏目结构 设计色彩 具体的栏目结构设计如图 五 制定网站开发进度表 设计色彩 网站建设有明确的时间规定 所以我们制定了一个进度时间表 确保网站的如期完成 六 收集 整理和制作网站的内容素材需要收集和整理的内容和素材包括 教学文档 教学图片 学生作业 教师资料等 需要制作的网站素材有 网站界面设计 网站标志 Logo 部分图片等 主要使用Photoshop制作 第二节Dreamweaver8 0软件简介 一 Dreamweaver8 0运行环境Dreamweaver8 0在Windows平台和Macintosh平台都可使用 二 Dreamweaver8 0软件窗口布局介绍首次启动Dreamweaver时 会出现一个工作区设置对话框 作为网页设计人员 我们一般选择 设计器 布局 进入Dreamweaver软件操作界面 该软件工作区分布如图 1 插入 栏 插入 栏包含用于将各种类型的 对象 如图像 表格和层 插入到文档中的按钮 每个对象都是一段HTML代码 允许您在插入它时设置不同的属性 例如 我们可以通过单击 插入 栏中的 表格 按钮插入一个表格 另外 也可以不使用 插入 栏而使用 插入 菜单插入对象 2 文档 窗口 文档 窗口用于显示当前创建和编辑的文档 3 文档 工具栏 文档 工具栏包含各种按钮 它们提供各种 文档 窗口视图的选项 各种查看选项和一些常用操作 4 标签选择器位于 文档 窗口底部的状态栏中 它显示环绕当前选定内容的标签的层次结构 单击该层次结构中的任何标签 可以选择该标签及其全部内容 5 属性检查器属性检查器用于查看和更改所选对象或文本的各种属性 属性检查器 6 面板组面板组是分组在某个标题下面的相关面板的集合 单击组名称左侧的展开箭头 可展开一个面板组 第三节 首页 页面制作 在做网站之前 先在本地硬盘中建立一个文件夹 取名 sjsc 该文件夹用于放置设计色彩网站的所有文件 并将在以后全部上传到服务器上 该文件夹内的文件请尽量不要用中文名称 以免今后出现浏览器兼容性问题 一 页面设计首先我们用Photoshop设计好各个页面界面图 保存图像格式为PSD格式或TIFF格式 宽度为980个像素 界面效果图如下 设计色彩 课程首页 设计色彩 课程简介 设计色彩 网络课堂 设计色彩 思考练习 设计色彩 作品欣赏 设计色彩 资源库 设计色彩 答疑讨论 第四节 课程简介 页面制作 一 课程大纲 页面制作 二 师资团队 页面制作最后的页面效果图如下 练习题 完成 kcmb htm 页面的制作 第五节 网络课堂 页面制作 一 网络课堂 页面制作 二 网络课堂 章节页面制作 第六节 思考练习 页面制作 练习题 1 制作 思考题 页面 2 制作 作品欣赏 和 资源库 页面 效果图分别如下 第七节 答疑讨论 页面制作 答疑讨论 页面即留言板 主要功能是交流学习疑问 心得等 技术上需要一个支持网络交互功能的平台 最后的页面效果图如下 第八节网站的发布 推广和维护 一 网站的发布网站发布其实就是一个文件上传的过程 通过FTP FileTransferProtocol 文件传输协议 连接到已经申请好的主机地址 输入用户名和密码 登陆后即可上传 最常用的工具是CuteFTP传输工具 二 网站的推广网站的推广是网站建设过程中不可或缺的一个环节 推广的成功与否直接反映在网站的点击率上 网站推广的形式多样 根据具体需要选择 使用较多的有 搜索引擎 广告 邮件 链接等 三 网站的维护网站维护不仅是网页内容的更新 包括新资源的上传 留言板的管理 网站的定期推广服务等 还有技术上的维护 包括对网站运行状况进行监控 发现运行问题及时解决等 思考与练习 运用前面所学到的知识