网页设计与制作.pptVIP

网页设计与制作网页设计与制作 计算机公选课计算机公选课 主讲：林旺 e_mail: lw_ 课程说明课程说明 l本课程主要从“技术”的角度着手，即：主要 介绍基本语言html的使用和网页制作工 具的使用。 l如何设计并制作出布局合理，色彩协调，功 能完善的网站和网页，有待各位花更多时间 和精力去学习。 l本课程只是投石问路，很多有关网站及网页 设计和制作的新技术新方法，我们会提及， 但不会详细介绍。如有可能，我们会安排专 题讲座。 课程的目标课程的目标 通过学习，要掌握网页制作的基本 知识和技能，培养网络实际应用能力， 达到在尽量短的时间内熟练掌握网页制 作和网站规划技能。掌握dreamweaver、 fireworks、flash 三个网页制作软件的 基本使用方法和技巧。 本课程的主要内容本课程的主要内容 l internet的基本知识 l 网页设计及网站规划 l 网页制作html语言 l 网页制作三剑客 dreamweaver fireworks flash lweb站点的建立和管理 本课程对学生的要求本课程对学生的要求 l自觉签到，请勿迟到和早退 l进行必要的预习、认真听课和作必要的笔记 l可以随时提问与插话 l课后请及时复习 l有bp机与手机者请关闭之 l请勿在教室吃东西和乱丢纸屑 l提倡在上机练习时互相帮助，最大限度利用 internet协作学习，包括利用web论坛、专题组 、bbs和qq等互助与讨论，以及留下您的建设 性意见 l认真按时完成上机练习与上机作业，不允许请 人代做或代他人做作业，不允许直接抄袭他人 的作业 本课程提倡与培养哪些精神本课程提倡与培养哪些精神 l l 提倡与培养认真品质；反对混学分的行为提倡与培养认真品质；反对混学分的行为 l l 提倡与培养迎难而上，勇于克服困难的顽强作风；反对逃避困难的提倡与培养迎难而上，勇于克服困难的顽强作风；反对逃避困难的 行为行为 l l 提倡与培养在错误、挫折与失败中顽强进取的坚韧毅力提倡与培养在错误、挫折与失败中顽强进取的坚韧毅力（允许学生 犯错误，并充分提供改正错误的机会）；反对和不容忍知错不改的反对和不容忍知错不改的 行为行为 l l 提倡与培养重操作、重实践、重应用的理论联系实际的工作作风；提倡与培养重操作、重实践、重应用的理论联系实际的工作作风； 反对纸上谈兵，不容忍不做练习和不完成作业的行为反对纸上谈兵，不容忍不做练习和不完成作业的行为 l l 提倡与培养守时与诚信的美德；反对无故迟到与缺勤，不容忍抄袭提倡与培养守时与诚信的美德；反对无故迟到与缺勤，不容忍抄袭 与作弊的行为与作弊的行为 l l 提倡与培养协作与互助精神提倡与培养协作与互助精神（鼓励资源共享与乐于助人）；反对自反对自 私、保守的思想与行为私、保守的思想与行为 l l 提倡与培养敢于向专家、权威、教师挑战的批判精神提倡与培养敢于向专家、权威、教师挑战的批判精神（鼓励发现、 指出与纠正教师在教学各环节中的不足与错误）；反对盲从的行为反对盲从的行为 l l 提倡与培养举一反三的创新能力提倡与培养举一反三的创新能力（鼓励不满足课程教学内容，自觉 探讨老师未讲授的内容）；反对固步自封的行为反对固步自封的行为 特别建议特别建议 l如果你选此课程只是为了获得学分，建 议不要选修此课程，否则你会后悔； l如果你选此课程是为了学习网页制作的 技术和方法以及提升自己的竞争能力， 建议一定要选修此课程，否则你会后悔 。 选修注意事项选修注意事项 l本人基础 基本的计算机操作能力 浓厚的兴趣 时间，精力和金钱的付出 l基本要求 选则学 学则来 来则听 几点想法几点想法 学习经验是：practice makes perfect。 学习教训是：落后就要“挨打”！（遭受良心的鞭打） 学习感想是：笨鸟要先飞。 学习意见是：扪心自问！ 学习建议是：大家能够互相帮助。 感想：这个集体很温暖！ l l 学习经验：学习经验：practice makes perfectpractice makes perfect l l 学习教训：落后就要学习教训：落后就要“ “挨打挨打” ”！（遭受良！（遭受良 心的鞭打）心的鞭打） l l 学习感想：笨鸟要先飞。学习感想：笨鸟要先飞。 l l 学习意见：扪心自问！学习意见：扪心自问！ l l 学习建议：大家能够互相帮助。学习建议：大家能够互相帮助。 l l 希望感想：希望这个集体很温暖！希望感想：希望这个集体很温暖！ 声声 明明 本节部分内容引用 了 裴纯礼教授个人主页的部分内容 该部分遵循原作者版权，并致谢。 教你做网页教你做网页 l做主页难不难啊？要多久才能学会呢？ l只用5分钟。 l方法： 方法一、用word制作 方法二、用记事本(notepad)制作 方法三、用frontpage制作 方法四、用dreamweaver制作 方法一、用方法一、用wordword制作制作 l打开word，输入“hello”。 方法一、用方法一、用wordword制作制作 l从“文件(file)”菜单中选“另存为(save as)”, 文件名保存为hello1.htm 方法一、用方法一、用wordword制作制作 l用ie打开刚才保存的文件，检查页面效果 方法二、用记事本方法二、用记事本(notepad)(notepad)制作制作 l打开记事本，输入如下代码： 方法二、用记事本方法二、用记事本(notepad)(notepad)制作制作 l从“文件(file)”菜单中选“保存(save)”，文件类型 选“所有(all)”,文件名保存为hello2.htm 方法二、用记事本方法二、用记事本(notepad)(notepad)制作制作 l用ie打开刚才保存的文件，检查页面效果 方法三、用方法三、用frontpagefrontpage制作制作 l打开frontpage，输入“hello”。 方法三、用方法三、用frontpagefrontpage制作制作 l从“文件(file)”菜单中选“保存(save)”，文 件名保存为hello3.htm 方法三、用方法三、用frontpagefrontpage制作制作 l用ie打开刚才保存的文件，检查页面效果 方法四、用方法四、用dreamweaverdreamweaver制作制作 l打开dreamweaver，输入“hello”。 l从“文件(file)”菜单中选“保存(save)”，文件 名保存为hello4.htm l用ie打开刚才保存的文件，检查页面效果 简单不简单？简单不简单？ 简单！ 网页设计及网站规划网页设计及网站规划 l 网站创建流程 确定网站主题 搜集材料 规划网站 选择合适的制作工具 制作网页 上传测试 推广宣传 维护更新 网页设计及网站规划网页设计及网站规划 l 网站的关键 布局 网页色彩 网页字体 网页设计及网站规划网页设计及网站规划 l网站的目录结构 不要将所有文件都存放在根目录下 按栏目内容建立子目录 在每个主目录下都建立独立的images目录 目录的层次不要太深 不要使用中文目录 不要使用过长的目录 尽量使用意义明确的目录 l 网站的链接结构 树状链接结构（一对一结构） 星状链接结构（一对多结构 网页设计及网站规划网页设计及网站规划 l开发平台介绍 网页制作工具 lmicrosoft frontpage 2000/xp lmacromedia flash mx lmacromedia dreamweaver mx lmacromedia fireworks mx 图形工具 l平面图形工具 l动画工具 l三维图像工具 javascript特效工具 ftp工具 网站综合开发基础 l学习目的： 了解网站规划的基本方法 熟悉网页设计的观念和原则 了解网站的宣传和推广的基本方法 了解网站设计成功的经验 l学习重点： 网站规划 网页设计的观念和原则 网站综合开发基础 l经验者说：融会贯通 l网站开发设计的基本流程是： 了解业务需求，进行建站的前期策划，制定“网站功能需求分 析报告”。包括网站面向对象分析，建立网站的目的、规模、 风格等等。 依据客户需求制定网站开发预算。 进行网站系统设计、站点规划，制定站点结构、设计应用系 统，撰写“网站开发建议书”。 进行美术设计，创意网站风格。 客户确认网站美术设计，进入主页制作阶段。 客户确认“网站开发建议书”，进入软件程序系统开发阶段。 开发完毕、测试联调，提交“网站验收申请” 验收合格，移交技术资料，提交“网站维护手册”。 网站综合开发基础 l网站的规划 1 明确网站的类型 设计艺术类网站 资讯型网站 2 明确建设网站的目的 3 网站的内容设计 4 网站的表现形式设计 5 明确的命名规则 6 文档目录的规划 网站综合开发基础 l网页设计介绍 1 网页设计流程 初始会商 概念开发 内容综合 html布局和导航 图形制作 丰富内容 测试 交付 2 网页设计要领 网页应易读 网页风格要统一 页面容量越小越好 网站综合开发基础 l网站的宣传和推广 1 传统媒体的运用 2 网址宣传融入日常工作 3 网络的运用 4 收集具“针对性”的站点 5 了解各个站点的宣传影响力 网站综合开发基础 l网站设计成功经验 1 成功第一步网站的主题和名称 主题要小而精 题材最好是自己的喜爱 2 定位网站的形象 设计网站的标志（logo） 设计网站的标准色彩 设计网站的标准字体 设计网站的宣传标语 3 确定网站的栏目 4 确定网站的目录结构 5 确定网站的链接结构 6 设计网站的整体风格 网站设计点评 l学习目的： 学习优秀网站的一般评价标准 初步了解网站设计点评方法 体验一些优秀网站的成功之处 l学习重点： 优秀网站的一般标准 网站点评实务 网站设计点评 l经验者说：你会赏析吗？ 怎样欣赏优秀网站的艺术的美，怎样品评 网页作品的优劣，如同对其他艺术的欣赏品评 一样，都是一个十分复杂的问题。从美学的角 度上看，这一审美活动不仅与审美对象有关， 而且与审美主体（即赏析人）的审判能力、水 平及其文化艺术修养更有密切关系，同时也深 受一定时代的社会审美意识、民族审美情趣的 影响。所以，我们要学会正确地鉴赏网页作品 ，领略网页设计的真谛，从中获得更多更美的 享受，得到精神上的升华，得到情操的陶冶和 心灵的净化，以便运用美学的理性知识对网页 及网站进行欣赏与品评。 网