多媒体技术及应用--课程设计报告

《多媒体技术及应用--课程设计报告》由会员分享，可在线阅读，更多相关《多媒体技术及应用--课程设计报告（15页珍藏版）》请在金锄头文库上搜索。

1、多媒体技术及应用 课程设计报告 课程名称课程名称 多媒体技术及应用 设计题目设计题目 网页设计与制作 专业班级专业班级 学生姓名学生姓名 学号学号 指导教师指导教师 起止日期起止日期 2013 年 9 月 2 日至 9 月 5 日 数理与信息工程学院数理与信息工程学院 目目 录录 摘要摘要1 关键字关键字1 一、概述一、概述2 1.1 课题的意义和解决的问题2 1.2 系统实现的具体功能3 1.3 系统的特点与创新点3 1.4 软件与硬件的运行环境4 二、功能需求分析二、功能需求分析4 2.1 课题的社会和技术背景4 2.2 客户与功能的需求分析5 2.3 系统运行软件和硬件环境的分析及确定6

2、 2.4 系统的具体功能要求6 三、系统设计三、系统设计6 3.1 软件与开发平台6 3.2 框架与模板间的联系7 3.3 项目的详细设计7 四、技术实现四、技术实现8 4.1 主要功能模板的实现8 4.2 主要技术问题的解决方法10 4.3 亮点和创新点的实现11 五、总结五、总结12 参考文献参考文献13 附录附录14 多媒体技术及应用多媒体技术及应用 设计者：莫仁宗 学号：11600122 摘摘 要要 多媒体技术及应用是计算机科学与技术专业的一门专业选修课。课程综合 讲述了多媒体计算机的基本原理、关键技术及其开发和应用。在信息技术飞速 发展的今天，人们获取信息的方式更多是来源于互联网。而

3、吸引浏览用户的则 是视觉效果出色、信息量丰富、使用起来便捷的网页，所以网页设计尤为重要。 本文从网页设计的角度出发，介绍一些设计中要素和技巧，最为基本的框架和 运用 PS 处理图片，DW 的使用，以及用 Adobe premiere 对一些视屏的剪辑等等。 关键字：关键字：多媒体 网页设计 框架 PS DW premiere 一、一、 概述概述 1.1课题的意义和解决的问题 自己动手实践制作 html 网页，初步了解 Dreamweaver 软件的功能布 局和一些基本操作；掌握对网页内容排版的操作，做到网页内容将来在 浏览器中显示效果美观；初步了解并可以使用脚本语言对网页内容的控 制，了解其基

4、本语法结构；将自己做好的网页放在上面，以实现他人通 过网络访问到此网页。调整好网页布局，使其各表格应尽可能对齐，整 体界面简洁、美观。网页应实现对输入内容的纠错检验，实现上传照片 的功能。要用 Tomcat 架构服务器，使做好的 html 网页可以在其他电脑 上通过地址访问得到。 1.2系统实现的具体功能 制作一个网页，使第三方可通过网络访问的我们的网页。我会对想相 关照片和视屏进行处理，以便我的队友可以快速的在网页上添加照片与视屏。 1.3系统的特点与创新点 我们小组的作品首页特点是整体框架干净，唯美，有层次感。色调 给人一种视觉美，使第三方不会有视觉疲劳。而且，我们大胆的创新了 栏目的信息

5、多样化。而，我对素材的处理则十分的带美感。 1.4软件与硬件的运行环境 由于我们小组的分工明确，对于后台我不是十分了解。我们一般在 XP 的电脑系统中运行软件，而我对照片和视频的处理都是用 PS CS5 和 premiere 完成的。 二、二、 功能需求分析功能需求分析 2.1 课题的社会和技术背景 当今社会发展的速度非常快，21 世纪电脑的飞速发展互联网已成为 人们快速获取、发布和传递信息的重要渠道，正以一种前所未有的冲击力影响 着人类的活动。虽然这个时代准备过去，但下个时代大部分人都认为是移动信 息时代。而，网页的却还要不停的发展，所以网页时代还有很长的路要走。今 天的网页技术已近是非常有

6、火候的了，基本的问题都是可以解决的。 2.2 客户与功能的需求分析 在 Internet 飞速发展的今天，互联网已成为人们快速获取、发布和传 递信息的重要渠道，正以一种前所未有的冲击力影响着人类的活动。它在人们 政治、经济、生活等各个方面发挥着重要的作用。因此网站建设在 Internet 应 用上的地位显的格外重要，它已成为政府、企事业单位信息化建设中的重要组 成部分。 现今的社会，人们已经离不开了网络，网络已经成为人与人之间交流的一 种形式，它能够把事情的复杂化转为简单化，摆脱了时间和空间的限制。网站 为很多人提供了一个网络生活空间，通过其网页展示了企业介绍、城市文化、 校园文化介绍、招商信

7、息、加盟程序、留言等一系列内容的介绍。为了更好的 宣传和服务于经济发展，我通过制作一个网站来介绍宣传一下我的家乡。本文 比较系统的阐述了有关网站建设方面的相关理论知识及该网站开发设计，充分 体现了计算机技术服务于经济建设的重要思想。 2.3 系统运行软件和硬件环境的分析及确定 硬件：操作系统：Microsoft Windows XP Professional 软件：Macromedia Dreamweaver 8 Dreamweaver Dreamweaver 是在网页设计与制作领域中用户最多、 应用最广、功能最强大的软件，随着 Dreamweaver 8 的发布，更坚定 Dreamweave

8、r 在该领域的地位。它集网页设计、网站开发和站点管理功能于一 身，具有可视化、支持多平台和跨浏览器的特性，是目前网站设计、开发、制 作的首选工具。 Adobe Photoshop CS5 Adobe Photoshop 是公认的最好的通用平面美术设计 软件。由 Adobe 公司开发设计。其用户界面易懂，功能完善，性能稳定，所以， 在几乎所有的广告、出版、软件公司，Photoshop 都是首选的平面工具。 Adobe premiere Premiere 是视频编辑爱好者和专业人士准备的必不可少 的编辑工具。它可以提升您的创作能力和创作自由度，它是易学、高效、精确 的视频剪辑软件。Premiere

9、 提供了采集、剪辑、调色、美化音频、字幕添加、 输出、DVD 刻录的一整套流程，并和其他 Adobe 软件高效集成，使您足以完成 在编辑、制作、工作流上遇到的所有挑战，满足您创建高质量作品的要求 2.4 系统的具体功能要求 掌握对网页内容排版的操作，做到网页内容将来在浏览器中显示效 果美观；初步了解并可以使用脚本语言对网页内容的控制，了解其基本语法结 构；将自己做好的网页放在上面，以实现他人通过网络访问到此网页。调整好 网页布局，使其各表格应尽可能对齐，整体界面简洁、美观。网页应实现对输 入内容的纠错检验，实现上传照片的功能。要用 Tomcat 架构服务器，使做好的 html 网页可以在其他电

10、脑上通过地址访问得到。 三、三、 系统设计系统设计 3.1 软件与开发平台 Macromedia Dreamweaver 8, Adobe Photoshop CS5, Adobe premiere 3.2 框架与模板间的联系 最开始网页呈现在你面前的时侯，它就好像一张白纸，它需要任意挥洒 设计才思。虽然我们能控制一切你所能控制的东西，在开始的时候，但最好明 白网页布局的基本概念。 网页主要是做一个表格样式，相对简单。在做时，一开始可以多生成几行 几列，方便后面对单元格进行合并操作，最终调成自己需要的 24（行）6（ 列）样式。 添加文本输入框后，主要就是调整网页布局。开始可以直接拖动来调整，

11、 但这往往会牵一发而动全身，后面的调整动作很可能会把前面调好的部分再次 破坏，所以应十分注意。可以在大体调的差不多后，在左侧点击拆分，然后直 接在文本框的代码中调整数据大小，来实现对文本框长度的调整。 我们的目的是使文本输入框正好填充整个单元格，并且确保文本框左侧的文字 不会因为太长儿发生折行现象，为照片上传预留空间，调整好整个页面的文字 格式和大小以及各边框的颜色，最终目的是保证整个页面整齐、简洁、美观 3.3 项目的详细设计 静态页面是网页的代码都在页面中，不需要执行 asp,php,jsp,.net 等 程序生成客户端网页代码的网页。静态页面不能自主管理发布更新的页面,如果 想更新网页内

12、容,要通过 FTP 软件把文件 DOWN 下来用网页制作软件修改。但是 静态页面最大的好处是下载速度快，因为不需要程序运算和数据库连接。常见 的静态页面以.html、.htm 为扩展名的。并非网站上没有动画的就是静态页面。 动态页面是通过执行 asp、php、jsp、.net 等程序生成客户端网页代码的网页。 动态页面通常可以通过网站后台管理系统对网站的内容进行更新管理。发布新 闻，发布公司产品，交流互动，博客，网上调查等，这都是动态网站的一些功 能，也是我们常见的。动态网页是需要语言环境支持的，动态页面常见的扩展 名有：.asp、 .php、 .jsp 、.cgi 等。动态页面的“动态”是网

13、站与客户端 用户互动的意思，而非网页上有动画的就是动态页面4。 动态网页是最常用的网站建设的一种表达形式，其优点在于可以根据先前所制 定好的程序界面，根据用户的不同请求返回相应的数据。可以说是一对多的关 系。从而达到资源的最大利用和节省服务器上的物理资源。如果今后需要改变 站点风格，只需要重新制作前台所访问的数据即可。只要数据库结构不变，可 以很快的进行改版的。 四、四、 技术实现技术实现 4.1 主要功能模板的实现 网页设计是一个互动的过程，不仅是设计师构思设计就可以完成的。 从客户提出需求到最终发布，期间需要客户与设计人员共同参与协商才可以， 具体流程如下： 首先，获取客户需求和资料。在设

14、计网站页面之前，设计师需要知道客户 的需求，从而确定客户建立网站的目的。客户提出网站需求是非常重要的一个 环节。没有详细的需求，设计人员无法凭空进行设计制作。在这个步骤中，双 方的沟通与交流是非常重要的。 其次，确定网站内容。设计人员选择适合自己的图像编辑软件、动画制作 软件和网页制作软件进行网页的初步设计，这中间可能还需要和客户进行多次 沟通才能达到客户满意的效果。在具体设计时，设计人员应该为网站定位一个 主题，从而保证所有网页都围绕这个主题进行设计制作，保证风格的和谐统一。 然后，申请域名和空间。使用该方法能够有效同步管理文件。还可以通过 FTP 软件连接到服务器空间上，然后上传文件。 最后，后期维护。一般静态网站上传后，如果客户方没有专业人员维护，这样 就需要设计人员从客户方获取新资料进行定期或不定期的更新。如果是动态网 站，设计人员需要负责培训客户方如何使用后台管理，这样客户就可以自己通 过后台管理添加信息，设计人员只要及时更正动态网站的错误即可。 网站实际上是由很多网页组成的，那么网页之间是如何联系的呢？这就是 本章要讲的内容-网页的“链接” 。 “链接” ，又称“超链接“（Hyperlink）, 它作为网页的桥梁。网页中的很多对象都可以加入“链接”属性。在 Dreamweaver 8