2016网页制作PPT.pptVIP

制作一个完整的网页，还需要用其他软件制作出相关文件来完善网页，例如制作 Flash 动画、Shockwave 电影等。就需要对这些素材进行一些处理。 常用的素材处理工具有： Photoshop Fireworks Flash 1.1.2 HTML语言与XHTML语言 【例1-2】在Dreamweaver 8环境下制作例1-1的界面，分析系统生成的XHTML代码 。 HTML与XHTML区别 XHTML的主体body部分比HTML简洁得多.文字内容和显示样式分离 页面的首部有不同的文档类型说明!DOCTYPE …。 XHTML的标记和属性名称只能用小写，而HTML代码不区分大小写。 XHTML代码所有的属性值都要用引号引起来，而HTML代码不要求。 XHTML代码的单标签，如: hr、br、img等都要在后面加 /（斜杠前加空格）来结束，如br /，而HTML代码只需写单标签本身br。 XHTML文档的基本结构为： 1. 2 网站建设流程1.2.1 分析阶段 这一阶段的主要任务是收集、研究用户需求，讨论Web内容，制定计划。 任务 主题 内容 1.2.2 设计阶段 1．站点风格：信息式（新浪）、画廊式（个人网站）。 2．网络技术： 网络上的运行速度。 （网页下载时间不应超过２０s） 浏览器脚本兼容性。会影响某些网页效果不能正常显示。 页面对屏幕分辨率的适应。网页页面的大小应尽量适应流行屏幕的分辨率。随着显示器分辨率的提高，网页设计标准也会提高。 网页是否需要交互操作。在网页中加入JavaScript脚本，或在服务器端提供CGI、ASP或PHP支持。 安装插件。如果网页中使用了flash动画、Shockwave媒体对象、Real视频等，需要相应的插件，应考虑用户获取插件的途径 。 1.2.2 设计阶段 3．规划站点结构及导航方式 规划网站目录结构 目录名及文件名不能过长，也不能用中文。 文件名中可以包含数字或下划线。 主页的文件名应为index.htm或Default.htm（系统默认的主页名称）。主页文件放在站点根目录下，其余文件均应归类到相应的子目录下。 1.2.2 设计阶段 【例1-3】 规划《家畜生产学》教学网站的目录结构。养猪生产、养禽生产、养牛生产、养羊生产4个模块，可以建立目录结构如右图。 1.2.2 设计阶段 设计站点导航 导航设计的原则是： 通过最少的点击次数达到目的地。 整个网络的导航风格应该一致，否则浏览者会误解为已离开本网站。 导航系统应一目了然，又必须尽量少占用页面空间。 1.2.2 设计阶段 【例1-4】《家畜生产学》教学网站的导航系统 1.2.2 设计阶段 设计各级页面的版式： 原则一： 统一：设计作品的整体性，一致性。同一级页面的版式应该相同，不同级页面的版式应有所区别。 连贯：页面相互有关系。 分割：将页面分成若干小块，小块之间有视觉上的不同，可以使用户一目了然。 对比：通过矛盾和冲突，使设计更加富有生气。 和谐：整个页面符合美的法则，浑然一体。 1.2.2 设计阶段 原则二（3C原则）： Content（内容）：主页简明，内容明确。 Clarify（清晰性）：文字不能太多，字体大小一致，统一设计风格。 Color（色彩）：具有一致性和可读性。一致性指色调一致，色彩不宜太多；可读性指色彩搭配恰当，文字与底图对比鲜明。 1.2.2 设计阶段 1.2.3 制作阶段 网站建设的第三阶段是具体实施设计的方案，将站点中的网页按照设计方案制作出来。本篇以下各章节将教授这方面的知识。 Dreamweaver允许用面向对象的方法“搭建”页面，也允许直接编程制作Web页面。 1.2.4 测试阶段 在所有影响页面显示的各种环境下进行测试，然后对网页进行修改 不同系统平台 不同连接速度 不同访问方法（局域网、调制解调器、ISDN等） 不同浏览器种类或版本 不同显示分辨率。 1.2.5 发布与维护阶段 发布：把网站上传到ISP提供的服务器端 维护、更新和修改 ：获取最新信息，是人们上网的主要原因 谢谢！ 欢迎提问问题？ 网页制作 教材及参考书 教材 《网页设计与制作技术教程（2版）》 清华大学出版社，王传华 参考书 《网页设计与制作教程》（第3版），机械工业出版社，刘瑞新。 《Dreamweaver 8完美网页设计—白金案例篇》,中国电力出版社，何海霞。 第1章 网页设计与制作基础 第2章 Dreamweaver基础 第3章 网页中的文本 第4章 网页元素定位 第5章 网页中的多媒体对象 第6章 模板与库 第7章 动态网页特效 第8章 动态网站 第1篇 网页设