文档介绍：该【WEB前端页面设计毕业论文设计模板 】是由【1781111****】上传分享，文档一共【38】页，该文档可以免费在线阅读，需要了解更多关于【WEB前端页面设计毕业论文设计模板 】的内容，可以使用淘豆网的站内搜索功能，选择自己适合的文档，以下文字是截取该文章内的部分文字，如需要获得完整电子版，请下载此文档到您的设备，方便您编辑和打印。摘要...................................................................................................................2第1章前端开发工具及相关技术.............................................................................................................................................................................................................................................................................................................................................................................................................................................................................10第2章前端布局分析与设计..............................................................................................................................................................................................................................................................................................................................................................,线,面的运用.........................................................................................................................................................................................................................................................................................................................................................................31第3章主要功能的实现...............................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................37第4章总结...............................................................................................................................................................................................................................37致谢.......................................................................................................................381要世纪是信息高速发达的时代,网络作为当今最流行最方便快捷的媒介也越来越被人们接受,并且融入我们的生活。随着高校信息化建设的不断推进,网站的作用超越了传统的信息获取,交流它更能体现组织机构的风采,性质。所以高校院系建立本院系美观,专业,易于维护管理的网站已经势在必行。本论文主要围绕数字媒体技术专业的门户网站为开发主题,最基本也是最必须的三个技能。前端的开发中,在页面的布局时,HTML将元素进行定义,CSS对展示的元素进行定位,再通过JavaScript实现相应的效果和交互。虽然表面看起来这些很简单,但这里面需要掌握的东西绝对不会少。在进行开发前,需要对这些概念弄清楚,弄明白,这样在开发的过程中才会得心应手。分析并解决实现中的若干技术问题介绍了个性化页面的背景及jsp+javascript+mysql系统的一般原理;阐述整个个性化页面生成系统的系统结构及工作原理;分析了系统实现中的特殊性,难点和重点;设计实现用户注册,用户登录,用户管理等jsp页面。分析并解决实现中的若干技术问题;建立完整的校园网站,进行测试并分析结果。该网站有效地实现用户通过JSP页面访问来进行用户注册,登陆,并对网站内容进行有效的管理,提升了后期添加和删除信息的有效性,具有一定的应用价值。1章前端开发工具及相关技术此来满足了各种不同需求的浏览者。网站的作用众所周知人们通过网站快速获取,发布和传递信息。目前很多高校建立起了自己的网站这些网站的建立使得学校可以突破传统的媒体的限制在网络上开辟的属于自己的新天地。网络具有超时空性。网络超时空性是一种“一人对一人,一人对多人,多人对一人,多人对多人”的传播方式。超时空性的形成正式由于在网络在时间层面,空间层面上的开放性带来的。网络的超时空性使得网站对学校本身和外界社会表现特定的功能,表现在网站有助于改变教育资源的分散性和分布不均衡性,有效的将教育资源进行整合,从而使得教育资源使用意义上的无限增长。网络具有的海量存储特性,网络能形成一个巨大无比的数据库,世界上任何时间任何地点的任何一件事都能成为网络的信息被广泛传播。网站的海量存储特性可以从横向和纵向两方面分析:横向看网站往往设置多个板块,分别放置相关内容。不同板块的信息相互独立,共同构成网站的内容。纵向看,同一个板块的内部,内容并不是固定不变的,而是不断添加连续更新的。大量的信息使得高校网站成为一个巨大的数据库。交互性体现在网站通过设置留言板,论坛,发挥网络交互的功能,在我们的日常生网站正是以这些特点为基础,发挥了自己本身的资源整合,信息传播,多方交流互动等方面的独特功能,成为一座沟通桥梁。很多网站内容多姿多彩,板块,内容争妍斗艳。但不外乎以一下几部分例如:学校介绍,新闻发布,招生信息,就业信息,师资力量,科研成果,机构设置,教学素材等。高校网站的建立和维护需要大量的物力和人力,为何要投入去建网站上?是因为如上所述的网站有的独特特性使得建设高校网站势在必行我们要创建我们本专业的网站数字媒体技术系的专业网站,网站前端设计最基本的三个技能:HTML,CSS,JavaScript,PS矢量图像编辑技术。这个是前端开发中最基本也是最必须的三个技能。前端的开发中,在页面的布局时,HTML将元素进行定义,CSS对展示的元素进行定位,再通过JavaScript实现相应的效果和交互。虽然表面看起来这些很简单,但这里面需要掌握的东西绝对不会少。在进行开发前,需要对这些概念弄清楚,弄明白,这样在开发的过程中才会得心应手。建立本系网站发挥的作用如下:(1)媒体技术系网站是数字媒体专业的“商标”。在这个高度信息化的社会里,建立数字媒体技术系自己的网站是最直接的宣传手端。网站的超时空特性,不仅能让本地区的人们了解学院,更可让世界了解本专业。(2)媒体技术系网站巨大的教育资源,网站是实现教育资源分配的桥梁,它使每一位教师和学生都能均等的得到培训和受教育的机会,能极大的提高教学效率。数字媒体技术系网站能提供教学互动的全新方式,网站使得教师与教师,教师与学生,学生与学生之间的交流有了全新的方式,它不再受到传统课堂的制约。它可以使不同的学院同处一室,共同讨论,共同提高。地理上的界限在这里模糊和消失了,数字媒体技术系(3)数字媒体技术系网站能够提供个性化的学****平台,不同的学生理解世界的方式各不相同,认知世界有诸多方式。网络提供的丰富资源可以使学生寻觅不同的教育方式,各取所需。数字媒体技术系网站允许不同的学生沿着自己的途径,按自己的速度接受教育与学****学生将有机会享受最佳的教育机会,充分发掘自己的内在潜力,培植独特的个性和人格。(4)数字媒体技术系网站是最佳的教学研究室,数字媒体技术系网站与教育类专门网站的有效链接,给本系教学研究带来了一片新天地,各种优秀教案,专家论坛,网络观摩课,各科素材,多媒体课件制作等内容为教师教研提供了极佳的平台。有效地降低教研成本,提高效率。(1)MyEclipse简介MyEclipse企业级工作平台(MyEclipseEnterpriseWorkbench,简称MyEclipse)是对EclipseIDE的扩展,利用它我们可以在数据库和JavaEE的开发,发布以及应用程序服务器的整合方面极大的提高工作效率。它是功能丰富的JavaEE集成开发环境,包括了完备的编码,调试,测试和发布功能,完整支持HTML,Struts,JSP,CSS,JavaScript,Spring,SQL,Hibernate。MyEclipse[4]结构上的这种模块化,可以让我们在不影响其他模块的情况下,对任一模块进行单独的扩展和升级。简单而言,MyEclipse是Eclipse的插件,也是一款功能强大的JavaEE集成开发环境,支持代码编写,配置,测试以及除错,MyEclipse6。0以前版本需先安装Eclipse。MyEclipse6。0以后版本安装时不需安装Eclipse。(2)DreamweareDreamweareMACROMEDIA公司开发的集网页制作和管理网站于一身的所见即所得网页编辑器,它是第一套针对专业网页设计师特别发展的视觉化网页开发工具,利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页[5]。使用网站地图可以快速制作网站雏形,设计,更新和重组网页。改变网页位置或档案名称,Dreamweare会自动更新所有链接。使用支援文字,HTML码,HTML属性标签和一般语法的搜寻及置换功能使得复杂的网站更新变得迅速又简单。(3)PhotoshopAdobePhotoshop,简称“PS”,是一个由AdobeSystems开发和发行的图像处理软件。Photoshop主要处理以像素所构成的数字图像。使用其众多的编修与绘图工具,可以更有效的进行图片编辑工作。在网站前端开发过程中需要把图片用Photoshop处理成加载到网站页面的图片,用Photoshop制作矢量图形用作网站页面的修饰按钮。,它可以使得信息和用户之间不仅只是一种显示和浏览的关系,而是实现了一种实时的,动态的,可交互式的表达能力。从而基于CGI静态的HTML页面将被可提供动态实时信息,并对客户操作进行反应的Web页面的取代。Javascript脚本正是满足这种需求而产生的语言。它深受广泛用户的喜爱和欢迎。它是众多脚本语言中较为优秀的一种,它与网络的主导地位。因此,尽快掌握javascript脚本语言编程方法是我国广大用户日益关心的问题。(1)javascript是一种基于对象的语言,同时也可以看作一种面向对象的。这意味着它能运用自己已经创建的对象。因此,许多功能可以来自于脚本环境中对象的方法与脚本的相互作用。(2)简单性javascript的简单性主要体现在:首先它是一种基于Java基本语句和控制流之上的简单而紧凑的设计,从而对于学****Java是一种非常好的过渡。其次它的变量类型是采用弱类型,并未使用严格的数据类型。(3)安全性javascript是一种安全性语言,它不允许访问本地的硬盘,并不能将数据存入到服务器上,不允许对网络文档进行修改和删除,只能通过浏览器实现信息浏览或动态交互。从而有效地防止数据的丢失。(4)动态性javascript是动态的,它可以直接对用户或客户输入做出响应,无须经过Web服务程序。它对用户的反映响应,是采用以事件驱动的方式进行的。所谓事件驱动,就是指在主页(HomePage)中执行了某种操作所产生的动作,就称为“事件”(Event)。比如按下鼠标,移动窗口,选择菜单等都可以视为事件。当事件发生后,可能会引起相应的事件响应。(层叠样式表)是用来进行网页风格设计的,它简化并扩展了HTML中的各种标记,使得各个标记的属性更具有一般性和通用性,大大提高了HTML开发的效率。在制作网页时采用CSS技术,可以有效地对页面的布局,字体,颜色,背景和其他效果实现更加精者页数不同的网页的外观和格式。什么是CSS?CSS中,Cascading是“层叠”的意思,也就是说在同一个Web文档中可以有多个样式表存在,这些样式表根据所在的位置,拥有不同的优先级,优先级越高,就会在最后显示时被采用。从样式表插入的形式看可以分为3种。(1)内联式样式表;(2)嵌入式样式表;(3)外部式样式表;CSS的特点CSS是用来扩展HTML的,而不是用来替换HTML的,也就是说CSS不能脱离HTML,它只是一项辅助工具。除了可扩展HTML的样式设定外,CSS使得网页的设计与维护更加高效,这主要表现在以下几个方面:减少图形文件的使用,集中管理样式信息,设定共享样式,将样式分类使用。[9]是继prototype之后又一个优秀的Javascript框架。其宗旨是——WRITELESS,DOMORE,写更少的代码,做更多的事情。它是轻量级的js库(压缩后只有21k),这是其它的js库所不及的,它兼容CSS3,还兼容各种浏览器(IE6。0+,FF1。5+,Safari2。0+,Opera9。0+)。JQuery是一个快速的,简洁的JavaScript库使用户能更方便地处理HTMLdocuments,events,实现动画效果。jQuery其模块化的使用方式使开发者可以很轻松的开发出功能强大的网页特效。本文主要论述了如何在Web开发中使用jQuery技术,丰富网站的交互性和用户体验性。jQueryJavascrip脚本库。Javascript轻量级脚本库系列文章。的类库,这些工具方法或对象方法封装在类库中,方便用户使用。注意jQuery是脚本库,而不是脚本框架。库不等于框架,比如System程序集是类库,MVC是框架。jQuery并不能帮助我们解决脚本的引用管理和功能管理,这些都是脚本框架要做的事。脚本库能够帮助完成编码逻辑,实现业务功能。使用jQuery将极大的提高编写javascript代码的效率,让写出来的代码更加优雅,更加健壮。jQuery有如下特点:(1)提供了强大的功能函数使用这些功能函数,能够帮助我们快速完成各种功能,而且会让我们的代码异常简洁。(2)解决浏览器兼容性问题javascript脚本在不同浏览器的兼容性一直是Web开发人员的噩梦,常常一个页面在IE9,Firefox下运行正常,在IE6下就出现莫名其妙的问题。针对不同的浏览器编写不同的脚本是一件痛苦的事情。有了jQuery我们将从这个噩梦中醒来,比如在jQuery中的Event事件对象已经被格式化成所有浏览器通用的,从前要根据event获取事件触发者,。target。jQuery则通过统一event对象,让我们可以在所有浏览器中使用event。target获取事件对象。(3)实现丰富的UIjQuery可以实现比如渐变弹出,图层移动等动画效果,让我们获得更好的用户体验。单以渐变效果为例,从前我自己写了一个可以兼容IE和ff的渐变动画,javascript代码实现,费心费力不说,写完后没有太多帮助过一端时间就忘记了。再开发类似的功能还要再次费心费力。如今使用jQuery就可以帮助我们快速完成此类应用。(4)纠正错误的脚本知识大部分开发人员对于javascript存在错误的认识。比如在页面中编写加载时即执行的操作DOM的语句,在HTML元素或者document对象上直接添加onclick属性,不知道onclick其实是一个匿名函数等等。拥有这些错误脚本知识的技术人员也能完成所有的开发工作,但是这样的程序是不健壮的。比如在页面中编写加载时即执行的操作DOM的语句,当页面代码很小用户加载很快时没有问题,当页面加载稍慢时就会出现浏览器终止操作的错误。jQuery提供了很多简便的方法帮助我们解决这些问题,一旦使用jQuery你就将纠正这些错误的知识--因为我们都是用标准的正确的jQuery脚本编写方法!,同时讲述了相关的前端开发技术比如:Javascript,CSS,jqurey等。:HTML,CSS和JavaScript,这就要求前端开发工程师不仅要掌握基本的Web前端开发技术,网站性能优化,SEO和服务器端的基础知识,而且要学会运用各种工具进行辅助开发以及理论层面的知识,