信息论精品课程网站设计论文.docx

1、信息论精品课程网站设计论文目 录1 概述 11.1 项目的背景与意义 11.2 相关的技术与开发工具介绍 12 需求分析 22.1 信息论精品课程网站建设的需求 22.2 功能需求 22.3 环境需求 22.4 用户界面需求 32.5 软件需求 33 系统设计 43.1开头动画设计 53.2主页设计 73.3 子页设计 134 系统测试和性能优化 214.1 系统测试 214.2 方针 214.3 性能优化 225 总结与展望 235.1 当前存在的问题和以后发展的方向 235.2 心得与体会 236 参考文献 241 概述1.1 项目的背景与意义1.项目的背景信息论基础与应用是运用概率论与数

2、理统计的方法研究信息、信息熵、通信系统、数据传输、密码学、数据压缩等问题的应用数学学科。信息论的意义和应用范围已超出通信的领域。自然界和社会中有许多现象和问题，如生物神经的感知系统、遗传信息的传递等，均与信息论中研究的信息传输和信息处理系统相类似。因此信息论的思想对许多学科如物理学、生物学、遗传学、控制论、计算机科学、数理统计学、语言学、心理学、教育学、经济管理、保密学研究等都有一定的影响和作用。2.项目的意义随着网络技术的发展与互联网的普及，网站建设与网页制作也来越成为各行各业以及个人宣传自己的有利工具。网站在当金时代被越来越多的人用来宣传，通过网站可以让更多的人更好的了解想要知道的事，我们

3、现在做的是关于信息论课程的网站，此网站可以让学生更多的了解信息论，更方便学习。1.2 相关的技术与开发工具介绍1Microsoft dreamweaver 8.0 是由macromedia公司设计开发的一款可视化的网页设计和网站管理工具，支持最新的Web技术，包含HTML检查、HTML格式控制、HTML格式化选项、可视化网页设计、图像编辑、全局查找替换、全FTP 功能、处理Flash等富媒体格式和动态HTML、基于团队的Web创作。Dreamweaver 8 是业界领先的 Web 开发工具，通过该工具使用户能够高效地设计、开发和维护基于标准的网站和应用程序。使用 Dreamweaver 8.0

4、，Web 开发人员能够完成开发的全过程，从创建和维护基本网站到支持最佳实践和最新技术的高级应用程序。2Adobe photoshop CS4 是由美国Adobe公司开发的图像设计及处理软件，以其强大的功能倍受用户的青睐。它是一个集图像扫描、编辑修改、图像制作、广告创意、图像合成、图像输入/输出、网页制作于一体的专业图形处理软件实际上，PHOTOSHOP的应用领域很广泛的，在图像、图形、文字、视频、出版各方面都有涉及。目前的影视后期制作及二维动画制作，PHOTOSHOP也有所应用的。3.Flash是由macromedia公司推出的交互式矢量图和 Web 动画的标准，由Adobe公司收购。网页设计

5、者使用 Flash 创作出既漂亮又可改变尺寸的导航界面以及其他奇特的效果。Flash被称为是“最为灵活的前台”。由于其独特和时间片段分割（TimeLine）和重组（MC嵌套）技术，结合ActionScitp的对象和流程控制。使得在灵活的界面设计和动画设计中成为可能，同时它也是最为小巧的前台。由于其独特的跨平台物性和在界面控制以及多媒体的功能使用得使用flash来制作的应用程序具有很强的生命力。在与用户的交流方面具有其它任何方式都无可比拟的优势。当然，某些功能你可能还要依赖于XML或者其它诸如javascript的客户端技术来实现，但你能方便在它们的实现数据通信。 2 需求分析2.1 信息论精品

6、课程网站建设的需求信息论是运用概率论与数理统计的方法研究信息、信息熵、通信系统、数据传输、密码学、数据压缩等问题的应用数学学科。信息论将信息的传递作为一种统计现象来考虑，给出了估算通信信道容量的方法，已经深入到社会的各个领域，是现实中非常有用的解决问题的工具。数学与信息科学学院作为潍坊学院信息论的研究基地，需要推出信息论精品课程网站，向广大师生传播信息论知识，让大家了解并学习信息论相关知识，为推动潍坊学院精品课程学术研究做出应有贡献。2.2 功能需求作为一个介绍课程的网站，希望能成为为广大师生的一个平台，在这里，可以详细了解到信息论基础与应用的多方面的内容：课程简介、课程特色、教学大纲、教学课

7、件、教案主讲人、简介主讲老师、教学方法、教学手参考资料。为学生更好的学习提供了便利。2.3 环境需求硬件环境：PC机PC (personal computer)，个人计算机一词源自于1978年IBM的第一部桌上型计算机型号PC，在此之前有Apple II的个人用计算机。能独立运行、完成特定功能的个人计算机。个人计算机不需要共享其他计算机的处理、磁盘和打印机等资源也可以独立工作。今天，个人计算机一词则泛指所有的个人计算机、如桌上型计算机、笔记型计算机、或是兼容于IBM系统的个人计算机等。软件系统：windows xp 操作系统 、网站运行的web服务器2.4 用户界面需求A、用户界面的一致很关键

8、，界面的结构必须清晰且所用的术语要保持一致，风格必须与内容相一致，界面的色调字体也要保持一致。B、遵循对比原则一一在浅色背景上使用深色文字，在深色背景上使用浅色文宇C、采用行业标准和惯例，使网站看起来或视觉上都比较专业。D、应具备熟练用户和新手用户两种界面，支持生手也支持熟手，让用户便于使用、便于理解、并能减少用户发生错误选择的可能性。E、界面对象在视觉上、感觉上和行为上应该与其在现实世界中的表现一致。F、弹出菜单不应该是唯一的功能来源，要实现多功能的整合应用。G、界面间的切换，界面布局都很重要。用户要能够自由快速地对界面上的每一项做出选择，并且所有选择都是可逆的。2.5 软件需求制作网站的软

9、件与插件处理的软件。网页设计软件：DREAMWEAVER 8.0图片处理软件：PHOTOSHOP CS4动画制作软件：FLASH CS4 插件处理软件：FLASHPAPER 2.1，ISpring3 系统设计信息论精品课程的主页要体现简洁、大方、美观、大气。采用白色为底色，图片与动画体现信息主题。模块分为：首页、课程特色、主讲人简介、教案、课件、教学大纲、课程简介、申报表、教学方法、教学大纲等。具体分支见下面树图：主页与子页模块树框图3.1开头动画设计1.大小尺寸：768*1024 PX2.主题：全球通信。3.设计：一个自转的地球上放置了一个雷达（经过时可以放大），彰显了人类通信的无线性与无限

10、性。遨游世界、寻觅宇宙。背景体现了通信高塔、无线通信、通信电路板、通信编码等方面，昭示了人类信息工程的蒸蒸日上（见图1）。4.技术方面：A准备四张关于信息论的图片，在PHOTOSHOP CS4中将其整合，作为背景图片B在FLASH CS4中运用图形工具画出圆形，填充蓝色，转化成影片剪辑，运用滤镜效果制作投影C导入地图图片，运用补间动画与遮罩效果，制作出旋转地地球D导入雷达图片，转为按钮元件，在经过时使其放大。E最后组合在一起就行（1）运用软件：FLASH CS4、PHOTOSHOP CS4（2）简介：背景运用PHOTOSHOP CS4将几张主题性图片进行了整合，体现了信息工程取得的成就。中间的

11、芯片名字更加突出了主题。“信息论基础与应用”一行字运用FLASH CS4软件制作。先在文字上方制作了一个运用模糊滤镜效果的光，然后运用补间动画将光产生移动效果。然后运用文字形状遮罩层将光只突显文字部分。自转的地球：地球运用图像工具与滤镜效果（投影、内发光）制成；雷达制成按钮元件，在经过时可以放大；地图先运用PHOTOSHOP CS4将背景去掉，存储为PNG格式，导入FLASH CS4；动画是运用补间动画与遮罩功能将地图在地球上旋转。（3）注释：注意：运用滤镜效果前需要将文字或图片转换成影片剪辑元件（F8）。按钮元件：按钮元件实际上是四帧的交互影片剪辑，它只对鼠标动作做出反应，用于建立交互按钮。

12、遮罩层：可以将与遮罩层相链接的图形中的图像遮盖起来。用户可以将多个层组合放在一个遮罩层下，以创建出多样的效果。遮罩层可以是把焦点限制在高亮层上，原理是通过一个绝对定位的层，设置它的宽度和高度以致能覆盖整个屏幕（包括缩放和滚动浏览器的情况下），再给它设置一个比较高的透明度来层叠在原有内容之上（但要比高亮层小），这样用户就只能点到这个层之上的内容了。补间动画：又叫做中间帧动画，渐变动画，只要建立起始和结束的画面，中间部分由软件自动生成，省去了中间动画制作的复杂过程，这正是Flash的迷人之处，补间动画是Flash中最常用的动画效果。滤镜：主要是用来实现图像的各种特殊效果。它在软件中具有非常神奇的作

13、用。所以有的软件都按分类放置在菜单中，使用时只需要从该菜单中执行这命令即可。滤镜的操作是非常简单的，但是真正用起来却很难恰到好处。滤镜通常需要同通道、图层等联合使用，才能取得最佳艺术效果。如果想在最适当的时候应用滤镜到最适当是位置，除了平常的美术功底之外，还需要用户的滤镜的熟悉和操控能力，甚至需要具有很丰富的想象力。这样，才能有的放矢的应用滤镜，发挥出艺术才华图1 开头动画3.2主页设计整个主页设计包括三部分：FLASH标题、导航、正文内容、友情链接和版权内容。3.2.1.FLASH 标题： 1.大小尺寸：768*500 px2.主题：浮动的克劳德香农3.设计：克劳德香农是信息论基础的奠基人，

14、为了纪念他，我们运用了他的头像，并使它浮动起来，吸引观者注意力，让人印象深刻。4.技术：A准备三张香农的图片，三张有关信息论的背景图片B在FLASH中建立六个图层，将六张图片分别导入C第一张香农图片建立传统引导层，在第一个背景制作上划过效果D第二张香农图片转化成影片剪辑，在两个关键帧处一个设置透明，一个设置不透明。让后创建补间动画。创建补间动画自上而下效果。E第三张图片运用与第二张一样的方法制成，只是没有添加补间动画。（1）运用软件：FLASH CS4（2）简介：香农浮动效果是运动传统引导层与补间动画的结合，背景部分是影片剪辑元件与补间动画的结合，最终合成最终效果。（3）注释：传统引导层：引导

15、层就是运动对象的运动轨迹所在的层， 它可以给运动对象一条确定的运动轨迹. 由于该层中的内容不会在SWF中显示出来,所以有时也用来作注释用。影片剪辑元件：影片剪辑是包含在flash影片中的影片片段，有自己的时间轴和属性。具有交互性，是用途最广、功能最多的部分。可以包含交互控制、声音以及其他影片剪辑的实例，也可以将其放置在按钮元件的时间轴中制件动画按钮。 5.思想：信息工程传播或技术传播理论,以其纯粹的数学方式理解和诠释了信息发生、传播中的一些基本方式和原理。其中以信息熵、噪音、冗佘、反馈等概念为核心,通过数学公式描述了信息传播中的一些基本规律,确定了许多主要概念和基本观点,为传播领域提供了基本的

16、范式,指明了新的研究方向和课题。今天,它仍然是传播学的重要方法,有助于对于这个多学科根源的领域进行更缜密的理论整合。6.链接：（1）信息论背景：香农理论的重要特征是熵(entropy)的概念，他证明熵与信息内容的不确定程度有等价关系。熵曾经是波尔兹曼在热力学第二定律引入的概念，我们可以把它理解为分子运动的混乱度。信息熵也有类似意义，例如在中文信息处理时，汉字的静态平均信息熵比较大，中文是9.65比特，英文是4.03比特。这表明中文的复杂程度高于英文，反映了中文词义丰富、行文简练，但处理难度也大。信息熵大，意味着不确定性也大。因此我们应该深入研究，以寻求中文信息处理的深层突破。不能盲目认为汉字是

17、世界上最优美的文字，从而引申出汉字最容易处理的错误结论。质量、能量和信息量是三个非常重要的量。3.2.2 主页导航导航是指通过一定的技术手段，为网页的访问者提供一定的途径，使其可以方便地访问到所需的内容。 导航表现为网页的栏目菜单设置、辅助菜单、其他在线帮助等形式。网页导航设置是在网页栏目结构的基础上，进一步为用户浏览网页提供的提示系统，由于各个网页设计并没有统一的标准，不仅菜单设置各不相同，打开网页的方式也有区别，有些是在同一窗口打开新网页，有些在新打开一个浏览器窗口，因此仅有网页栏目菜单有时会让用户在浏览网页过程中迷失方向，如无法回到首页或者上一级页面等，还需要辅助性的导航来帮助用户方便地

18、使用网页信息。导航就相当于一个向导，引导搜索引挚去访问你的网站，告诉它去哪访问哪些内容。方便用户快速找到想到的内容，提高内容的权重。导航条分别依次输入首页课程简介、教学大纲、教学课件、教学重点难点、简介主讲老师、教案讲稿、教学方法手段；快速导航补充教学课件、师资队伍和申报表（见图2）。让浏览者能够方便的找到各个模块。我们的导航设计的很友好，让用户快速找到想到的内容。1.大小尺寸：748*100 345*7002.内容：各模块名字，并建立子页超链接3.技术：（1）运用软件 DREAMWEAVER 8.0（2）注释：超链接：超链接在本质上属于一个网页的一部分，它是一种允许我们同其他网页或站点之间进

19、行连接的元素。各个网页链接在一起后，才能真正构成一个网站。所谓的超链接是指从一个网页指向一个目标的连接关系,这个目标可以是另一个网页,也可以是相同网页上的不同位置，还可以是一个图片，一个电子邮件地址，一个文件，甚至是一个应用程序。而在一个网页中用来超链接的对象，可以是一段文本或者是一个图片。当浏览者单击已经链接的文字或图片后,链接目标将显示在浏览器上，并且根据目标的类型来打开或运行。3.思想：简洁、美观、大方并突出出题。图 2 网站导航3.3.3 正文内容设计分为课程简介、师资队伍：课程简介提供信息论基础与应用的主要内容、适应专业及层次、先修课程等的介绍，设置链接，实现资源的免费共享。师资队伍

20、模块介绍主讲教师，美观、简明。并且设置了链接，图文并茂地展示主讲教师风采。让浏览者了解教师情况。近年学校始终把建设一支与办学目标相适应的高水平师资队伍作为核心工作之一，视师资队伍建设为提高人才培养质量的根本保证，积极采取有效措施，建立人才脱颖而出的良好机制，为高等教育事业的人才提供发展的自由空间、干事的广阔舞台和成才的优良环境。 一直以来，学校大力推进人才强校战略，努力营造以人为本的优良人才成长环境，不断加大对师资队伍建设的投入力度，逐步深化人事分配制度改革，创新人才管理体制机制，师资队伍建设工作立足内部培养，大力开展人才引进，全力为现有人才搭建成就事业的舞台，师资队伍建设取得显著成效，综合素

21、质和水平明显提高。教师队伍中一些具有较高学历、良好修养、扎实功夫、教法灵活的优秀教师。他们的业务能力强，科研能力强，敬业精神强。深受学生的欢迎。主页的设计：A.确定精品课程主页的大小为1024*768 B.适合作为背景的图片一张，直接导入背景即可C.确定主页的格式，插入一个6行1列的表格，以便进行编辑D.表头为一个经过Photoshop处理的照片，结合潍坊学院与信息论的特点，显示的别具一格E.插入表头，确定大小为150*768F.导航栏的创建，整体背景为一张处理的导航条，之间插入整个网页需要插入的链接如：首页、课程简介、教学大纲之间空格实现是按“ctrl+shift+空格”G.除去表头，导航，

22、整个主页由六部分组成，分别为左上部分的导航和右上部分的课程设计。插入一个八行两列的表格，第一行为两个导航条组成（见图3）图3 课程简介H.之下的部分左部为友情链接，右部为师资队伍，设计如G，只是之间加入一个flash动画，客户登陆按钮(见图4)：图4 师资队伍I.下面得两部分为flash动画(见图5)和图片（见图6），就不再一一介绍图5 flash插图J.各个分页的整体设计和主页如出一辙图6 主页设计图3.3 子页设计子页包括课程简介、教学大纲、教学课件、教学重点难点、简介主讲老师、教案讲稿、教学方法手段、补充教学课件、师资队伍和申报表。课程简介运用Photoshop制作的图片做背景。 主讲老

23、师简介运用Dreamweaver 8.0设计。教学大纲、教学课件、教学重点难点、教案讲稿、教学方法手段充教学课件、师资队伍和申报子表运用photopaper制作的swf做子模块3.3.1课程简介：1.大小尺寸：768*1024 px2.主题：信息论基础与应用的课程简介3.设计：简洁大方，主题鲜明4.技术：（1）运用软件：DREAMWEAVER 8.0 （2）简介：信息论基础是高等院校信息与计算科学本科专业所开设的一门专业限选课。主要内容包括：信息度量和信道容量的基本概念和理论、典型信源和信道特性、信源编码定理和信道编码定理，以及信源编码和信道编码的基本理论和方法。本课程的主要任务是使学生对信息

24、论的基本理论以及应用有一个比较全面和系统的了解，使学生熟练掌握通信系统的基本模型，信息传输和压缩的基本理论，为学习和研究信息的传输，存储和处理相关类的后续课程，以及图像与语音信源压缩编码、计算机网络通信与无线移动通信纠错编码、以及各种现代密码理论与技术的研究和开发，打下坚实的理论基础。5.思想：内容详尽，体现精神3.3.2 教学大纲：1.大小尺寸：768*1024 px2.主题：信息论基础与应用的教学大纲3.设计：简洁大方，主题鲜明4.技术：（1）运用软件：DREAMWEAVER 8.0 （2）简介：见网站5.思想：内容详尽，体现精神3.3.3 教学方法：1.大小尺寸：768*1024 px2

25、.主题：信息论基础与应用的教学方法3.设计：简洁大方，主题鲜明4.技术：（1）运用软件：DREAMWEAVER 8.0 （2）简介：“以数学原理为基础，立足工程应用”的教学理念“以问题主导教学内容”的教学方法 重视学生作业，改革考核方式5.思想：内容详尽，体现精神3.3.4 教学课件：1.大小尺寸：578*500 px2.主题：信息论基础与应用的教学课件3.设计：简洁大方，主题鲜明4.技术：（1）运用软件：DREAMWEAVER 8.0 ISPING（2）简介：详见网站5.思想：内容详尽，体现精神3.3.5 教学重点难点：1.大小尺寸：578*500 px2.主题：信息论基础与应用的教学重点难

26、点3.设计：简洁大方，主题鲜明4.技术：（1）运用软件：DREAMWEAVER 8.0 FLASHPAPER 2.1（2）简介：详见网站5.思想：内容详尽，体现精神3.3.6 友情链接1.定义：友情链接，也称为网站交换链接、互惠链接、互换链接、联盟链接等，是具有一定资源互补优势的网站之间的简单合作形式，即分别在自己的网站上放置对方网站的LOGO图片或文字的网站名称，并设置对方网站的超链接(点击后，切换或弹出另一个新的页面)，使得用户可以从合作网站中发现自己的网站，达到互相推广的目的，因此常作为一种网站推广基本手段。本网站制作的友情链接包括国家精品课程资源网、潍坊学院主页、数学与信息科学学院主页

27、、数学分析精品课程主页。用以补充课程内容、有利于查询相关内容、开拓视野。此外友情链接的好处不仅可以给网站带来较多直接的访问量,而且它会让搜索引擎更多的收录网页。据权威调查显示，全球80%的网站，他们的访问量70%-90%都是来自搜索引擎，因此，让搜索引擎收录更多的网页，就是提高网站访问量的最有效办法。 此外还要考虑链接流行度。 链接流行度，就是与站点做链接的网站的数量，是搜索引擎排名要考虑的一个很重要的因素。也就是说，站点链接的数量越多，它的等级就越高。3.3.7 版权设置网页版权即网页著作权，是指该网页的作者对其作品享有的权利。版权的取得有两种方式：自动取得和登记取得。在中国，按照著作权法规

28、定，作品完成就自动有版权。主页上还设有部分Flash动画，能够吸引浏览者的注意力，是辅助供能的具体应用。3.3.8文字编排和文字效果 在网页的排版上尽量做到简洁易懂方便浏览，清晰明了。本次网页设计由中文网页常用的“宋体”、“黑体”为主构成整个页面，这样显得正式得体；适当运用粗体，字号分别在主要页面标题与其他正文文字做主次内容上的区别，可以做到分好层次、体现主题。图7 课程简介子页面教学大纲、方法手段（见图8、图9），都是运用软件flash paper 2.1，将word格式文本转换成swf格式文本，在右侧插入大小为578*500 px的表格，然后插入教学大纲、方法手段即可。图8 教学大纲子页面

29、 图9 教学理念子页设计图教学课件（见图10），是运用软件ispring，将ppt格式文本转换成swf格式文本，在右侧插入大小为578*500 px的表格，然后插入教学课件即可。并在上方制作导航。图10 教学课件子页面图11教学重点和难点子页面4 系统测试和性能优化4.1 系统测试系统测试，英文是System Testing。是将已经确认的软件、计算机硬件、外设、网络等其他元素结合在一起，进行信息系统的各种组装测试和确认测试，系统测试是针对整个产品系统进行的测试，目的是验证系统是否满足了需求规格的定义，找出与需求规格不符或与之矛盾的地方，从而提出更加完善的方案。系统测试发现问题之后要经过调试找

30、出错误原因和位置，然后进行改正。是基于系统整体需求说明书的黑盒类测试，应覆盖系统所有联合的部件。对象不仅仅包括需测试的软件，还要包含软件所依赖的硬件、外设甚至包括某些数据、某些支持软件及其接口等。网站发布之前，要进行细致周密的测试，一保证正常浏览和使用。在这里选择了使用xp系统的IIS来对制作的网站进行系统测试。主要测试包括以下内容： A、服务器的稳定性、安全性 B、程序及数据库测试，网页兼容性测试，如浏览器、显示器 C、文字、图片、连接是否有错误达到以下目标：1、 确保系统测试的活动是按计划进行的。 2、 验证软件产品是否与系统需求用例不相符合或与之矛盾。 3、 建立完善的系统测试缺陷记录跟

31、踪库。 4、 确保软件系统测试活动及其结果及时通知相关小组和个人。4.2 方针1、 为项目指定一个测试工程师负责贯彻和执行系统测试活动； 2、 测试组向各事业部总经理/项目经理报告系统测试的执行状况； 3、 系统测试活动遵循文档化的标准和过程； 4、 向外部用户提供经系统测试验收通过的预部署及技术支持； 5、 建立相应项目的（BUG）缺陷库，用于系统测试阶段项目不同生命周期的缺陷记录和缺陷状态跟踪； 6、 定期的对系统测试活动及结果进行评估，向各事业部经理/项目办总监/项目经理汇报/提供项目的产品质量信息及数据； 4.3 性能优化1.系统优化原来是系统科学（系统论）的术语，现在也用作（而且常用作）计算机方面的术语。它尽可能减少计算机执行少的进程，更改工作模式，删除不必要的中断让机器运行更有效，优化文件位置使数据读写更快，空出更多的系统资源供用户支配，以及减少不必要的系统加载项及自启动项。当然优化到一定程度可能略微影响系统稳定性，但基本对硬件无害2. 网站性能优化的通用方法有一下几个方面：A、html静态化对于一般的网站来说，效率最