《网页设计毕业论文.docx》由会员分享，可在线阅读，更多相关《网页设计毕业论文.docx（18页珍藏版）》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、网页设计毕业论文毕业论文按一门课程计，是普通中等专业学校、高等专科学校、本科院校、高等教育自学考试本科及研究生学历专业教育学业的最后一个环节，为对本专业学生集中进行科学研究训练而要求学生在毕业前总结性独立作业、撰写的论文。从文体而言，它也是对某一专业领域的现实问题或理论问题进行科学研究探索的具有一定意义的论文。一般安排在修业的最后一学年学期进行。网页设计毕业论文1响应式网页设计原型研究网页设计毕业论文内容当今，移动互联网迅猛发展，各种智能设备层出不穷。传统网页设计采用“固定页面及元素宽度，任何终端统一页面效果的策略，无疑将造成网页在一些新兴移动终端上显示的文字极小、链接分布极密，用户需要在屏幕
2、上不停操作来自主寻求较好的体验。面对这一弊端，网页设计师聚焦于“响应式网页设计这一关键词，试图使用一套代码为各类终端设备提供不同的设计和体验。从先前“为固定设备设计网页跨越到“响应式网页设计是一个较难的经过。一些新手可能已经积累了诸如媒体查询、流式布局、弹性图片等零散的设计开发技巧，把握了5和CSS3的使用方法，但他们仍然无法驾驭响应式网页设计。造成这种情况的直接原因就在于缺乏一个能够指导他们立即开展响应式网页设计实践的可操作流程，即原型。1两个关键概念：响应式网页设计与原型响应式网页设计(RWD，Responsive网页Design)是一种网页前端开发技术，它能够描绘为，“兼顾多种不同设备屏
3、幕尺寸、分辨率、系统平台和行为做出相应的调整和布局的显示机制。原型(Prototype)，也叫“原样，是“模拟科学中的一个术语。在心理科学中，由于很难对动作或心智活动认识清楚，所以一般沿用JR安德森的观点，把原型(Prototype)视为关于范畴的最典型的样例设想，即把“原型视为外化的实践形式，或“物质化了的心智活动方式或操作活动程序。综合上述，响应式网页设计原型可描绘为：符合“响应式网页设计项目分析、各类终端具有合适本身用户体验的不同页面效果、一套代码完成所有不同终端的网页制作、各类终端与主流阅读器良好兼容等一系列规则的，外化的响应式网页设计活动实践形式。2建构响应式网页设计的原型建构原型一
4、般采用心理模拟法，它包含三个步骤：(1)响应式网页设计活动的功能分析;(2)响应式网页设计活动的构造分析;(3)功能分析与构造分析的有机结合。其中，功能分析的重点是作用的对象，条件与结果;构造分析的重点在于组成要素及要素之间的关系。响应式网页设计的目的是能够高效的编写一套代码为各类终端设备提供良好的设计效果和使用体验，这需要具备5、CSS3、Javascript和jquery的基本技能。响应式网页设计之父伊桑.马科特以为，响应式网页设计应该首先针对小屏幕进行设计，然后逐步加强针对大屏幕设计。这种思路颠覆了传统固定宽度的网页设计方法，对于那些已经积累了零散的响应式网页设计开发技巧、5及CSS3等
5、技术，能够较熟练的完成固定宽度桌面端网页的新手而言，恐怕很难理解从小屏幕开场设计然后渐进加强的思路。考虑到新手已经习惯设计制作固定宽度的桌面版网页，响应式网页设计假如从固定宽度的大屏幕网页制作开场，然后改造这套代码将仅适用于桌面的网页依次兼容平板端和手机端也是一个不错的思路。响应式网页设计活动包含了“项目分析、“网页平面设计、“桌面版网页制作、“平面版的改造、“手机版的改造及“兼容问题的调试这6个典型的子活动。这些典型要素的关系能够描绘为，“要想高效的完成某响应式网页设计项目，首先需要项目分析，其阶段性结果是响应式网页的总体方案，即在用户群体需求分析及主题解读的基础上，进行色彩分析及定位，确定
6、UI版面布局，分析设计网页功能模块，确定网页风格等，最终构成包含“前言、“需求分析、“系统分析、“风格设计、“各类终端UI版面初步布局、“色彩定位、“网页建设日程规划等部分的网页总体方案文档;然后，根据前期方案中“色彩、“风格及“各类终端UI版面布局等的分析，根据页面设计原则，利用photoshop绘制适用于各类终端显示的平面效果图;随后，利用“5+Css3技术采用+css布局完成固定宽度桌面版网页的制作并生成网页文件和样式表文件;接着，在这套代码的基础上，利用媒体查询技术、流式布局、弹性图片技术，结合平板终端的页面效果图将代码改造成兼容桌面及平板的网页;之后，在上述修改的基础上，继续利用媒体
7、查询技术和弹性图片技术，结合手机终端的页面效果图将代码改造成兼容桌面、平板、手机的网页;最后，利用火狐和IETester软件查看初步完成的响应式网页，解决跨阅读器的兼容问题，构成完好网站。该经过中任何环节假如出现不妥当都应该返回上个步骤进行重新修改。结合上述对网页设计活动的功能与构造分析，不难发现，响应式Web设计活动原型中的6个典型子活动复杂程度不同。其中“桌面版网页制作、“平面版的改造、“手机版的改造及“兼容问题的调试这4个典型子活动是比拟复杂的，包含了很多熟手的关键技术，需要进一步阐述。3熟手的关键技术从上述适用于新手的响应式网页设计活动基本原型发现，制作一个能够兼容主流阅读器的固定宽度
8、桌面版网页是响应式网页制作的开端。那么，首先在“桌面版网页制作这个环节中提取一些熟手关键技术，作为给予新手的技巧提示。3.1兼容主流阅读器的桌面版网页制作技术为了防止不同阅读器给予一样5标签的初始样式存在差异，熟手利用5+CSS3制作桌面版网页制作时，一般会在样式文件(扩展名.css)中给出如下初始化代码：*margin：0px;padding:0px;bodymargin:0px;padding:0px;text-align:center;font-family:宋体font-size:16px;color:#cccccc;ul,li,amargin:0px;padding:0px;list
9、-style:none;divoverflow:hidden;float:left;#wrapperwidth:1007px;height:auto;margin-left:auto;margin-right:auto;overflow:hidden;clear:both;这部分代码块能够实现页面在IE内核和Firefox内核的所有版本阅读器中居中对齐，外层布局盒子与阅读器头部无缝紧贴;及css3完成固定宽度布局时，默认所有内部布局向左浮动，溢出属性为隐藏;所有构成页面的5元素的默认边距和填充属性为0px;5的列表标签默认项目符号为空，边距和填充为0px。此外，确定页面尺寸,目前大多数显示器为
10、1024像素*768像素，那么以此为默认显示器时，页面的宽度尺寸一般设置为“1007像素。初始化CSS代码后，接下来就是利用+CSS完成布局，这里提示新手：完成布局后，务必在IETESTER和Firefox中检查网页布局能否能够兼容主流阅读器。然后，根据桌面版网页平面设计效果图完成页面的制作。此外，熟手的经历是制作经过中频繁检测桌面版网页能否能够完美兼容各种阅读器。3.2利用流式布局、弹性图片、媒体查询技术修改桌面版网页(1)相对视口尺寸，将最外层的布局(例如：#wrapperwidth:1007px;.)的宽度设置为96%(这个值取决于当前页面的视觉效果，可以以给其他数值);然后，将最外层的
11、布局内部的页头布局、导航布局、内容布局、侧边栏布局、页脚布局对应的CSS样式中的width属性值利用公式目的元素宽度上下文元素宽度=百分比宽度把网页的固定布局修改成百分比布局，也就是将固定像素宽度转换成对应的百分比宽度。(2)将页面中所有5标签元素对应的CSS样式表中的margin-right、margin-left、padding-right、padding-left的属性值也用公式目的元素宽度上下文元素宽度=百分比宽度来修改。(3)将CSS样式表中的font-size属性值的单位用em来代替px。这里仍然使用公式目的元素宽度上下文元素宽度=百分比宽度。这里需要提示新手的是：在标签的初始化代
12、码中，假如有font-size:16px;语句，那么在给其他元素的font-size属性上修改值时，公式中的“上下文元素宽度就等于16px，例如，#logofont-size:48px;如今要修改为#logofont-size:3em;。(4)为了实现弹性图片，让图片随视口缩放，图形图像、动画和视频的弹性设置使用“img,object,video,embedwidth:100%;max-width:100%;。其中，max-width属性是用于确保缩放时不会超出图片最大尺寸。同时，熟手还会使用AdaptiveImages解决方案来实现自适应图片。(5)媒体查询能够通过判定不同设备终端，提供不同
13、的样式使其实如今不同终端都能获得最佳的用户体验。例如，某个响应式页面用电脑阅读页面时，页面信息会以平铺的形式分布在页面适宜的位置;用手机阅读页面时，导航按钮会相继隐藏起来，部分信息变成左右滑动的方式呈现，页面会重新布局，图片相应缩小。媒介查询的语法格式是，例如：设定宽度不超过400像素的屏幕尺寸，代码是：。固然，5+CSS3提供了良好的媒体查询功能，但当前仍有一些阅读器不支持，你可能需要添加如下基本样式：3.3不同种类、不同版本阅读器的兼容问题解决跨越阅读器的问题一直是响应式网页设计的难题。熟手面对这一问题时，一般采用“渐进加强与降级、“利用javascript修复老版本IE、“使用Moder
14、nizr辅助修正样式，按需加载资源、“给IE6，7，8追加媒体查询功能等方法。4结束语对响应式网页设计而言，当前的设计理念和技术方法还不是终点,网站前端设计师需要继续努力找出更好的解决方案。而对新手学习者而言，响应式网页设计开发技能的构成不是一蹴而就的，还需要学习者在多个项目中，利用原型进行屡次定向、操作及内化才能真正把握。网页设计毕业论文2【摘要】本文以就业信息管理平台为例，研究网页设计中表格与层的应用，提出表格与层能够让网页的布局整洁美观，将网页中的文字、图片、动画等诸多元素有条理地统一组织起来。固然表格的使用整体上是好的，但在一些细节的美化上表格的设计就难以做到，这就要采用层来搭配表格的
15、设计解决相应的排版美化问题。【关键词】网页设计；表格；层；就业信息管理平台随着信息技术的日新月异，网页设计的重要性也逐步凸显，怎样快速、方便地设计出相关的网页、网站就显得非常重要。在网页设计与制作的教学经过中，怎样让学生快速地把握网页设计的一些排版技巧是非常有必要的。因而，笔者结合网页设计与制作教学中的一些体会，并通过就业信息管理平台的设计案例，探索网页设计中表格与ApDiv层的排版设计技巧。一、Dreamweavercs简介Dreamweavercs是由Adobe公司推出的一套拥有可视化编辑界面，用于制作并编辑网站和移动应用程序的网页设计软件。目前，最新的版本为DreamweaverCC，网
16、页设计软件的功能强大。对网页的阅读已经是我们生活中的不可分割的一部分，网页作为网络信息传播的主要载体，其设计也为大家所关注。网页设计软件的种类有很多，但最知名、最专业的网页设计工具，非Dreamweaver莫属。它是著名的“所见即所得的可视化网站开发工具，目前的网页设计几乎都采用Dreamweaver来设计。Dreamweaver不仅提供了强大的网页编辑功能，而且还提供了网页的上传工具。利用FTP进行大文件的传输，节省了文件的传输时间，它是一个集网页创作和文件传输管理等多功能的设计工具。二、表格与层在网页设计中的使用在就业信息管理平台的设计中，采用程序设计，能够很好地提高网页的下载与阅读速度，
17、但对于初学者来讲，程序设计是一件头痛的事。因而，怎样利用表格与层来进行设计，就非常重要。网页设计中的排版有很多种方法，其中表格结合层的使用排版是最基本也是最有效的方法。表格与层，对职业院校的学生来讲，非常容易学，而且使用也非常方便，做出来的网页也非常的漂亮，因而，在网页设计中表格与层是非常重要的。一网页设计中表格的使用。在网页设计中，利用表格的排版，它的整体效果好是毋庸置疑的，表格在网页中的位置能够通过表格属性来进行设置。在Dreamweaver中，页面内容的设计、排版主要是通过表格来完成。通过表格的互相嵌套、合并与拆分，能够将本人构思好的页面完好地表现出来。表格在网页中的重要作用，主要是它在
18、不同的显示上，能够根据网页的大小、显示器的大小进行相应的变化。并始终都处于阅读的相对位置，完好地把内容显示出来，具有很好的兼容性。因而，使用表格排版比拟规范，整体性强，能够让网页的设计显得非常的整洁，到达想要的效果。但由于表格的整体性，在一些细微的地方以及操作上还不够细化，在内容的设计表现上还不够丰富。二网页设计中层的使用。层的使用在网页设计中也是非常的普遍，由于它的定位比拟准确，又是一种可视化操作元素，它的使用让网页增加了丰富的表现。层与表格的使用基本差不多，但在位置的定位上要比表格方便很多，这也是层的主要优点。在网页设计中，文本、图像、表格等元素只能固定其位置，不能互相叠加。假如要想使多个
19、元素进行叠加或者定位要准确，在这种情况下，就需要使用层来进行设置。层具有很多表格所不具备的特点，如层的重叠、移动、隐藏等一些功能，层还能够添加一些动作行为，让层的内容表现愈加丰富，也正是基于这一点，层成了网页设计中一个重要的元素。层的这些特点有助于设计思维不受局限，进而在设计上有很大的空间。由于它是一种流元素，层在具有上述优点的同时，也存在着一些不可避免的缺陷，例如层在网页中的定位不会随着阅读器大小的变化而变化，层的位置是固定不动的，在这样的情况下就失去了层在网页设计布局中的意义。三就业信息管理平台中表格与层的结合使用。表格与层的结合使用才能更好地体现出它们的优势，层也才能更好地体现出它在网页
20、设计中的强大功能。在网页设计中，怎样做到表格跟层的统一、层与表格融为一个整体，这就要用到层在表格中的插入操作，以及层的嵌套使用，下面以就业信息管理平台中制作下拉菜单为例来设计。首先，在网页中插入一个三行一列的表格，在表格的第一行插入一张图片，作为网页设计的Logo，而在第二行中插入一个嵌套的一行五列的表格作为网页的导航条，表格的第三行作为主要内容的设计与排版。三、表格与层的正确应用表格与层在网页设计中固然有强大的功能，但在使用的经过中也不能太随意，假如随意地使用就会增加阅读器的负担，阅读下载的速度就会变慢，影响网页的阅读。一表格布局出现的问题。在网页设计中，利用表格排版的时候，不能使用一个大大
21、的表格铺满整个页面，这样不利于阅读器的打开。阅读器打开一个表格，是要等一个表格全部下载完成，这样就需要很长的时间来打开这个网页。在表格的嵌套中，也不能无限制地嵌套下去，一般表格的嵌套，应该控制在最多三层表格，假如嵌套的表格过多，打开时也会消耗大量的资源，不利于网页的打开。有数据统计，一般阅读者打开网页的等待时间为7秒以内。怎样解决这个问题，主要采用拆分表格的方法，将一个大的表格拆分成几个小的表格，并要尽可能地避免表格的层层嵌套。二层布局出现的偏差。在网页的设计中，层的单独使用没有多大的意义，由于层是流元素，不会随着网页阅读器的变化而变化，它的位置是固定的，不会产生移动。固然有时候，我们在利用表
22、格与层排版的时候，看起来很整洁，但一预览就完全错位了，根本不是想要的效果。怎样才能使层与页面中的表格一样，能够随阅读器的变化而产生相对位置上的变化，这就需要先使用表格对整个网页的整体进行规划，然后添加一个层到表格中的一个单元格中，作为一个父层。操作的方法为：菜单栏中的插入布局对象ApDiv，插入后，这个层的位置左、上必须为空，没有任何内容。然后，其他的子层就通过这个父层进行嵌套，在这里必须强调的是，父层必须通过菜单栏的插入，不能通过用鼠标画出来的方式操作。采用这种方法设置层后，无论阅读器的窗口大小怎样变化，它都会跟着变化，体现了与表格成为一个整体，在阅读时就不会产生位置上的移动，因而，层只要结
23、合表格的使用才能更好地丰富网页内容。总之，在网页设计中，表格与层是非常重要的元素，但在布局设计中，只要把表格与层结合使用，才能让网页的布局精巧与丰富。网页中的内容固然很重要，但网页中的设计与布局才是最重要的。因而，通过合理的布局设置，十分是主页设计要整洁美观，才可能更好地吸引读者。因而，在平常的网页设计中，要多看一些优秀网站的排版设计，只要这样，才能更好地提高本人的网页设计能力。【参考文献】1俞燕丹项目教学法在（网页设计与制作）课程中的实践研究J新课程研究中旬刊，20xx102韩媛媛浅谈Dreamweaver在网页设计中的应用J信息与电脑，20xx73周金容网页制作经过与技巧J软件导刊，20x
24、x15网页设计毕业论文3Flash软件画在网页设计中的应用网页设计毕业论文摘要摘要:Flash技术运用范围非常广泛,不管是网站、广告、动画、游戏,甚至程序设计与多媒体化展示方面都有一定程度的运用。本文首先对Flash动画今后的发展趋势进行分析并详细化叙述了Flash的实际定义与特点,并对Flash动画当前在网页设计中的应用方式进行分析,针对性阐述了Flash动画在整站式网页设计经过中交互式导航系统、Web图像动画展示以及鼠标动画的应用。在此针对性研究Flash动画在网页设计中的相关研究,望研究结果能够对今后的学者一定帮助。网页设计毕业论文内容关键词:Flash动画网页设计应用研究随着社会迈入信
25、息化时代,网络及计算机技术的发展及普及程度呈现出优质化的发展形势,进而促进网页动画渐渐发展起来,此外网页动画设计在网页设计中占据重要地位,促使人们在关注动画整体发展趋势的经过中将注意力放在网页动画方面。在构建及设计网页时,运用Flash帮助网页实现多媒体化的网页成果展示,同时也渐渐成为网页设计发展经过中不可或缺的重要部分。1Flash的运用及特点MacromediaFlash作为一种交互式编辑矢量图及多媒体创作软件,因特网网页设计矢量动画文件格式时常得以较多的运用,此外,针对性分析Flash,能够了解到目前其主要具备下面六大特点:第一,将矢量图形作为主要运行前提,致使其本身文件导出容量不大,在
26、进行图片缩放时对其本身的明晰度影响不大,在网络传输经过中存在一定的便捷性;第二,Flash具备非常优质化且强大的AS代码,在设计动画时运用Flash技术,促使动画的交互性优良,便于读者在阅读经过的理解并施行相关互动;第三,针对实际运用经过分析,Flash动画在运作时主要采用插件,若用户想要实现视频观看,仅仅需要安装一次视频插件就能够直接观看,避免繁琐性屡次安装的现象发生。此外,由于Flash构建的动画本身极小,所以其具备较快的调用速率;第四,在设计Flash经过中,能够根据需要适当增加页面控制按钮帮助页面实现链接的跳动,还能够运用鼠标实现页面动画中的运动及移动。第五,Flash能够实现动画视听
27、效果内容的升华,譬如渐变声、位图等等,用户在制作图片的经过中能够直接构建全Flash制作站点;第六,Flash动画属于一种“准流式文件内容,无需全部下载完成就能够实现动画观看。2Flash动画在网络设计中的应用在网页设计中,Flash动画具备非常多关键性的作用,如流式播放动画、FlashMV及短片动画等,此外其所表现的形式中存在一定的交互性。但需要注意的是,在施行网页设计时,避免繁琐、复杂的动画设计效果的存在,毕竟物极必反,只会降低网页的品质;如图1所示。2.1网页动画信息交互的实现为了进一步却宝宝网页动画信息交互整体的流畅性,其中的一个重要关键就是Flash动画导航的交互性设计。在对该部分内
28、容进行设计时,往往会使用针对性的Flash动画脚本AxtionScript。实际设计经过中,通常由编程者的思想与Flash在事件中作用共同构成动力,并根据动画中的相应内容实现AxtionScript的详细化定义。2.2网页动画相关要素的设计第一,交互式导航系统。在网页设计中,导航栏对用户主要起到一种引导性作用。所以在设计时需要将其设计为多个导航级别,并构建针对性的标识来将其区分,以色彩为例,能够采用较为鲜艳、清爽式的搭配。第二,Web图像动画形式展示。传统网页中,Web图像主要呈现静态,不过经过计算机技术的不断发展,近期几年在网页设计中渐渐出现了一部分动态化的Web图像。同时在其色彩方面的运用
29、,主要采用RGB模板,并在网页安全色方面运用216色,其主要的色彩格式包括GIF、PNG以及JPE6。第三,鼠标动画。为了实现优质化Flash动画效果,在制作动画效果时要十分注意鼠标在移动经过中其轨迹图案及色彩搭配。首先,要确保鼠标移动经过中的色彩与网页设计色彩是不同的,有助于用户一眼就能够将鼠标找到。最后就是,鼠标在色彩区别网页之后还要注意其透明性,避免遮蔽信息的现象出现。3结语综合全文内容,在网站设计经过中,Flash作为一个极具重要性的视觉性元素,其能够在帮助网站实现多媒体化效果展示的同时,还能够结合数据通信这一措施全面性丰富网站本身具备的素材及资源,最终到达一种动态化的效果。截至今日,由于计算机技术发展速度不断提升,结合Flash本身所具备的多种优质化特征,笔者相信在今后人们的日常生活中,Flash动画一定能够获得愈加广泛的用处,更具普遍性,最终实现网页设计的主体化运用趋势。网页设计毕业论文文献1乔慧.Flash动画在网页制作中的应用及发展J.内蒙古石油化工,20xx(21):68.2关晓轩.Flash动画在网页制作中的应用研究J.北方文学(下旬),20xx(11):91-93.