《动漫在线视频资源平台的设计与实现.doc》由会员分享，可在线阅读，更多相关《动漫在线视频资源平台的设计与实现.doc（28页珍藏版）》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、摘要目前，全球科技都在迅速发展中，几乎每天每个人都会用到各种网络。网络是我国新兴文化，现在的几乎每个现代人，都是通过网络了解信息，特别是年轻人更是热忱于网络。随着全球各地社会的发展，网页也被越来越多家喻户晓,网页信息化受到越来越多的人所注重，各种企业和机构在网络上的竞争也越发强烈，为了博人眼球，各种企业和机构都在想方设法创新，把网站做到更加脱颖而出，才能让自己在同行业的竞争中不轻易被打败，而且这种趋势的竞争力越来越大，网站设计的需求量已经大到难以想象。这次毕业论文，我通过PhotoShop和Dreamweaver软件，利用HTML、CCS及Javascript等语言完成制作网站页面设计和色彩设
2、计及排版。以网站的形式做一个专门观看动漫视频的程序，这个视频平台可以观看各地各国的动漫节目，操作方便，页面的排版整洁，页面内容分类明确。关键词： 新兴文化 竞争力 Dreamweaver 动漫Abstract At present, technology is developing rapidly all over the world, and almost everyone USES the Internet every day. The Internet is an emerging culture in China. Most modern people learn about info
3、rmation through the Internet, especially the young generation who are keen on the Internet. Along with the development of the society around the world, web has been more and more people know, website localization is more and more people pay attention to, all kinds of enterprises and institutions in
4、the network competition is more intense, in order to bo person eyeball, all sorts of businesses and organisations are trying to innovation, to beautify the website to wrap themselves, so as to put myself in the same industry competition, and this trend is more and more competitive, the demand of web
5、site design has to hard to imagine.For this graduation thesis, I used PhotoShop and Dreamweaver software to complete the website page design, color design and typesetting by using languages such as HTML, CCS and Javascript. In the form of a website to do a special watch animation video program, this
6、 video platform can watch animation programs around the countries, easy to operate, the page layout is clean, the page content classification is clear.Key words: emerging culture competitive Dreamweaver anime目 录第一章 什么是网站设计.11.1网站设计的定义.11.2 制作网页前的准备.11.3 相关软件准备.2第二章 视频网站设计的前景.42.1视频网站平台的现在.42.2视频网站平台
7、的未来.4第三章 网页设计实战.53.1程序开发.53.1.1 设计目的.53.1.2 研究意义.53.1.3 网站平台的设计与开发.53.1.4 建立系统说明.53.1.5程序开发的创新.53.1.6相关工具与技术.63.2 网站设计方案.63.2.1 网站设计思路.63.2.2网站需求分析.63.2.3开发工具与测试.63.3数据库的开发.73.3.1 数据库开发目的.73.3.2 数据库开发设计.73.3.3 设计方案.73.3.4创建表.83.4 登录设计.93.4.1登录系统.93.4.1后台的管理.93.5 页面布局.93.5.1设计首页布局.93.5.2编辑头内容.133.5.3
8、插入文本.133.5.4插入图像.133.5.5插入视频.133.5.6登录注册页面.143.5.7链接其他网页.183.6建立网页链接.183.6.1图片链接.18第四章 作品展示.19参考文献.23致谢.24第一章 什么是网站设计1.1网站设计的定义随着社会的发展，浏览网站的行为成为当今人们必不可少的事情，设计网站也越来越挑战设计者们的能力，当今社会，发展网站设计的竞争力不断提高，设计者们只有不断创新改造，不断吸收各种灵感， 网站设计是需要在一片空白的页面，发挥自己的创作能力，把网站的整体结构用相关软件设计出来，要和网页的相关原理紧密联系起来，将策划案中的内容、网站的主题模式，以及结合自己
9、的认识通过艺术的手法表现出来; 总的来说，网站设计最终的目的就是要产生网站，我们需要的各种各样的信息如文本、字体颜色、字体大小、图片（jpg、png、gif等）、图片大小、表格等等都可以通过编辑我们的网站体现在网页上面，这些属于比较简单的信息，编辑到网页上算是比较容易的部分，但是有一些稍微复杂的比如矢量图形、音频、动画等多媒体档案则需要插件程序来运行。网站的设计布局的设计标准是div+css，这种布局方法可以增加代码页面的简洁性、内容与表现分离等好处，可以起到让浏览者浏览过程能对这个网站感兴趣而继续浏览，不会因为网站复杂而离去。1.2 网页基本构成元素网页的基本构成元素，众所周知，首先，文字是
10、第一位，但是在网站中文字的出现应该言简意赅，简洁明了，让人一目了然，但也不能太过单调，也不会因为文字多容易乏味而早早离去，适当的说明是最好的。还有，学会使用标题也是很重要的部分，可以提示浏览者各个地方的作用，起到了导航的作用，同时，运用图像的标题，还会给页面增添美观的作用。其次，为了更加吸引浏览者，我们需要善用图片，灵活地运用图片到网站中，通常会更出彩更博人眼球，所以我们应该在网站中某些显眼的地方，插放一些相关的、更容易引人注目的图片，这样既能达到美观的效果，又能更容易突出网站的重点，使浏览者对网页印象深刻。但是插入位置要合适，否则只会给页面留下凌乱的感觉。必要时，我们还可以适当加入一些动图（
11、gif），这是很有创意也有效吸引浏览者的办法，也是网站中最活跃的元素了。除了正常的使用图片，我们还可以在页面插入较大的主图，简单明了突出这个页面的主要内容，也节省了浏览者仔细阅读文字的时间。1接着是页面的色彩，如果网站内的色彩搭配特别，可以体现设计者的审美观，也会影响到浏览者浏览时的感受，网站给浏览者的第一印象必须要印象深刻的才好。页面的颜色不用多，适当就好，而且一定要搭配得当，要有一个颜色为主，其他颜色各种颜色为辅，协助调节。再接着，是加入超链接，这是网页与网页之间最重要的链接了，正常来说，它都是连接着另一个网页，但它也可以是图片、文字、电子邮件地址、某程序等等，如果网站有多个主题栏目，则必
12、须在网站的首页加入超级链接，让浏览者可以快速切换到感兴趣的页面，而各个子页面也要有超级链接，还要有能够回到主页的链接鼠标放在有超链接的地方会变成一个手形状的标志，并且此处可以点击，进入到另外一个网页页面。还有最为重要的就是排版，排版是整个网页的核心，没有精美的排版，估计读者看都不会多看网站一眼，所以排版再网页中是重中之重的。排版就是调整各种图形、图片、动图或者视频在网页中的位置大小等是否合适，是布局清晰明朗。 排版还可以服务于多种目的：强调网站的主题、定义个性化品质、表达某种情感、引发访客的兴趣、呈现整体的设计美感等。排版需要注意很多细节，比如进入一个网站，网站的颜色搭配、背景图片最先映入眼帘
13、，所以可以通过编辑HTML及CSS调节各部分颜色或位置，要注意颜色方块所在位置是否正确，是否看着舒服。接着是协调每一个文字跟图片之间的距离，所在位置，字体样式、字体大小、字体颜色要有变化，但与不能过分多样式，要有更高的辨识度，让浏览者容易分清哪些才是重要内容。排版的作用：可以强调网站的视觉效果：进入网站最先看到的就是它的外观，所以布局要得当，颜色要搭配，尽量使网页页面富有层次感；提高网站的可读性：这个的关键就在于文字部分的布局是否合理，浏览者进入网站中主要看的就是文本方面的内容，字体颜色、字体大小布局等的微小调整，都能起到很大作用，在某些重要段落或句子当中加入下划线突出文字，对强调重要内容信息
14、有很有帮助，也是的网站的内容展示出来会更有层次感。更加提升了网站内容的可读性和可用性。保持网站的一致性：网站与网站之间要紧密联系在一起，各个页面切换时要有协调的画面，不能东拼西凑，每个网页之间的画面显得格格不入，这样在浏览者查找自己想要的信息时，也不至于眼花缭乱。合理的网页排版通常即能突出网页中的重点，又能迅速传递网页中的信息，避免浏览者的阅读时的负担。1.3 相关软件准备22Dreamweaver：学过网站设计的应该都知道，网站编辑主要使用软件就是Dreamweaver，简称DW，是网站编辑中最主要的软件，中文名称 梦想编织者，开发于美国MACROMEDIA公司 ，2005年被Adobe公司
15、收购。DW主要由HTML代码，CSS代码及JavaScript代码组成。HTML是一种网页描述语言。是一个基于文本的编码标准，一个网页可以是一个HTML文件。而如果是一个网站则可以是由一组相关的HTML文件和其他文件组成。CSS，即层叠样式表(英文全称:Cascading Style Sheets)，是一种用来表现HTML或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。它能够对网页中元素位置的排版进行像素级精确控制，支持几乎所有的字体字号样式，拥有对网页对象和模型样式编辑的能力。JavaScript
16、是一种直译式脚本语言，它是一种基于原型、弱类型、动态类型的语言，内置支持类型，广泛用于客户端的脚本语言，最早是使用在HTML网页上，用来给HTML网页增加动态功能。网站大部分内容都是在这DW这个软件编辑，通过设计者不断发现创新美化自己的页面。PhotoShop：也就是大家都熟悉的ps，近年来，网络发展飞快，ps也在其推动下迅速发展起来。它是由Adobe Systems公司开发的和发行的图像处理软件，是个不可缺少的一款专业的图片处理网页设计软件。编辑网站时经常需要用到图片，但时有些图片放进网站中不搭配，这时候就需要用到ps处理图片，使用它众多的修图和绘图工具，可以解决很多图片编辑工作问题。网站的
17、设计离不开ps，一个网站的设计是否精美，吸引浏览者的目光，主要还是取决于网页上的图片处理程度了，所以制作网站的同时也要学习更多关于ps的知识。AE与PR：必要时，我们还需要用到视频剪辑软件。有时候我们需要导入一些视频文件，视频需要剪辑时，可以准备AE、PR等来剪辑。两者的区别使，PR是一款非线性视频编辑软件，除了最最基础的剪辑功能之外，还有调色、字幕、简单特效制作、简单的音频处理等常用功能。而AE是一款特效制作软件，包括影视特效，栏目包装，动态图形设计等等。所以AE一般应用在原创视频的制作上。和三维软件结合使用，可以使作品实现更加绚丽的效果。第二章 视频网站设计的前景2.1视频网站平台的现在在
18、这高速发展的社会，是互联网的时代，同时也就早就了网站行业的高速发展，现在社会需要大量的网络设计人才来发展，也为更多的大学生开辟了新的就业之路。 目前，网站平台的发展日趋壮大，视频平台的网站也不例外越来越吃香，现在的网站设计中处处更需要体现出网站的使用功能，那些花里胡哨、没有很大用处的设计在网页潮流中将会慢慢被人们所遗忘，有利用价值的、实用的一功能为主的网页设计才是网站好不好最有力的证明。这需要站在观看者的角度分析问题，才能做出更好，更受观看者欢迎的网站，从而达到让观看者喜欢这个网站的目的。部分观看者为了省去下载视频软件的时间，能直接在网站搜索视频平台观看视频，既简单方便，又节省了内存，这样为观
19、看者节省时间空间，观看视频的人还是经常会选择视频网站平台的观看的。所以视频平台在现在的发展是处于上升阶段的。2.2视频网站平台的未来当今社会，科技发展越来越壮大，网络科技也不例外，而且使用网络的人日趋增长，特别是青少年，现在的青少年几乎没有不会使用网络的人了，在新一代的人中，网站几乎成了人们的必需品。所以，未来的网络科技的发展不但不会下降，反而会有更多的人们选择在这一领域发展，网络科技将会持续发展，网站的发展也就不例外，像视频网站，现在的人，不管男女老少，大多喜欢看视频消磨时间，视频网站平台少不了被关注，因而，视频网站平台的发展会一直更新换代，往好的趋势走去。第三章 网页设计实战3.1程序开发
20、3.1.1 设计目的随着社会的发展，网站设计和开发的好坏会直接影响到网站被人们接受的程度。视频在线观看平台也同样蓄势待发，本系统主要以观看动漫视频为主的网站在线平台。可以解决平时不容易找到合适的动漫剧集观看的用户的问题。为满足广大用户不同的需求提供了更方便快捷的服务。3.1.2 研究意义近年来，随着社会的发展，信息化已经成为社会一个非常热门的话题，程序开发系统也逐渐变成人们一个热点。前端的界面设计通过使用PS来实现的，网站页面通过HTML、CSS和JavaScript实现，并利用Bootstrap框架完成了响应式的布局。现在流行在网上在线观看电视节目，系统界面不但要拥有精美的页面，更要由严谨的
21、规划。我们将使用HTML、JSP等技术来编辑网站页面，开发模式采用MVC的开发模式，并以B/S为架构，并运用PHP技术把数据库和动态网页相关联。本设计借助实际的视频网站的逻辑建立而来，并自己建立数据库，使得用户可以通过登录网站进入属于自己的视频网站，可以记录保存用户观看过的视频历史，更好地完成观看视频网站平台的体验。3.1.3 网站平台的设计与开发网页设计网站页面只要会采用PHP语言对数据库进行操作，通过对数据库搜索方式查阅，控制页面需要正确的分析出用户类型进行权限设计，需要采用MYSQL数据库，实现对整个数据库系统的操作，在系统的开发完成后，需要不断的运行与调试，以便展现出最符合用户需求的网
22、站。3.1.4 建立系统说明对于系统说明这一设计，它对于这个系统的初级应用者来说时很重要的部分，就好比时初级应用者的导航，他会非常详细地介绍整个系统的内容及具体的操作。初级应用者有了这个“导航”，也就说明学会系统的基本应用操作，这个“导航”会对系统界面从上到下或从左到右的顺序进行系统登录、系统注册、系统查询和系统的浏览等各方面的介绍。3.1.5程序开发的创新1、通过利用采集方式得到旧网站系统数据，跟移动网站直接在旧系统上进行修改的开发方式不一样，这个能更快速由效地和原来的系统进行结合；2、同时提供Web app页面和原生应用系统使用的接口，能更广泛接受各种设备，也能更大限度的满足客户对性能的要
23、求；3、系统采用中间件的形式，能和旧系统分开部署，更能使服务器部署灵活；3.1.6相关工具与技术程序开发的工具，主要以软件开发的相关过程、任务和活动等。运行环境为工具集成和软件开发、维护及管理提供统一的支持。主要包括的工具由Eclipse、Tomcat、MySQL和Navicat For MySQL等。开发工具在网站设计过程中必不可少，它属于一种被网站设计师认定的软件包、系统框架及操作平台等建设网站的特殊软件。在一个比较完善的系统的开发过程中，使用正确的工具能为整个开发过程减少更多的时间和成本，大大提高了开发的效率。网站开发系统的技术：1、包括网站的架构，也就是规划出网站的开发架构；2、前端开
24、发,主要就是UI设计，PS图片的处理，html网站页面设计等；3、后台开发，就是通过利用PHP、jsp而当后台编程语言编写；4、脚本开发，通过编写js语言，完成脚本部分的内容；3.2 网站设计方案3.2.1 网站设计思路随着网络迅速发展，网络成为人们重要的工具，而影视类时网络中一个重要部分，网站会将各种资讯提供给用户，让他们快速有准确地找到自己感兴趣的内容，还将影视的发展历史展示出来做简单介绍，让用户对其发展有一定的了解。本网站平台主要始对各国各地的动漫集中在一起，让用户更好地体验动漫带来的快乐，特别是最近一些热门的、播放量大的动漫，将会展示在推荐板块，让用户迅速观看到值得一看的动漫片。如何布
25、局，设置板块、布置内容和提高体验感是本次设计最重要的内容。3.2.2网站需求分析通过对市场调查分析，现在社会文化领域发展迅猛，人们的生活水平也逐渐提升，影视行业也没有例外，再加上网络的兴起，信息变得很快捷简便，这一切更加加速推动文化事业的发展，但数量增多的同时鱼龙混杂的市场更需要简单快捷的内心戏提高效率，影视与网络的结合时必然的趋势。而市场上知名的影视网站也不在少数，要想变得跟其他网站有不一样的地方，就必须要目标鲜明，所以制作自己的网站就需要突出它的特别之处，本次设计的网站就是以动漫为主的影视网站。3.2.3开发工具与测试网站模块主要以首页以及其中的子网页为主，以这些模块为基准对网站的详细内容
26、进行深入设计，网络在线的形式能够让用户更加精准快速找到自己想要的内容。开发网站主要分为设计与实现两部分，与之对应的开放软件分别为Photoshop和Dreamweaver。Photoshop是一款主要对图片进行修改处理的软件，在进行网站编辑的时候Photoshop时必不可少的软件。Dreamweaver是美国MACROMEDIA公司开发的集网页制作和管理网站于一身的所见即所得网页编辑器，它是第一套针对专业网页设计师特别发展的视觉化网页开发工具，利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。3.3数据库的开发3.3.1 数据库开发目的数据库设计的目的就是设置一个目标，就
27、是要实现数据的共享和安全存取，一个好的数据库设计必须要最终实现用户对数据共享的具体要求。必须要在满足与用户的数据存取要求的基础上实现对于数据的关联性及优化，必须实现数据的安全性、可扩容性结构以保证数据库对于用户未来数据要求的兼容性等。此次设计通过所学的数据库原理与程序设计的知识，针对一个小型的数据库管理系统进行系统的需求分析、系统设计、数据库设计、编码和测试等，达到掌握开发一个小型数据库的目的。3.3.2 数据库开发设计数据库对于一个系统来说非常重要，它是可以把数据存储起来并介绍有关操作的工具，简而言之就是数据库就是信息的集合点。本系统离不开数据库的支持，所以数据库对设计一个系统来说使非常非常
28、重要的，它使整个程序设计的基础，数据库的设计使单独进行的，这样有一个好处就是在编码过程中只要指导数据名称或者表名字段名就可以进行编码设计了。 3.3.3 设计方案由于网络科技发展，人们的需求也越来越大，而SQL数据库可以把自己喜欢的影视信息存储在里面，使得用户查找信息更加方便快捷。所以我们就得手机基本影视数据及了解基本的SQL操作和数据处理流程，为后面具体设计打下基础。通过上述系统功能分析，针对一般电影演员系统的需求，得到下面的信息：1、电影按电影类型分类，每个电影都对应一个类型，这样可以便于查找；2、一部电影只有对应的导演；3、一部电影都有对应的产地、发布时间或电影时长；ER模型图：关系模式
29、图：电影关系模式movie（mname，mplace，type，derector，length，published）演员关系模式a（aname，aplace，sex，birthday）演出关系模式ma（mname，aname，credit）3.3.4创建表表的设计：1. 建立最符合客户需求的数据库计划。2. 对数据库进行规范化处理，避免一些不必要的错误。3. 用户权限的区别。4. 数据库完整性。5. 系统的功能性设计，在数据库的实现需要利用mysql的各个功能来维持运行 刘志成，刘梦龙.数据库应用技术SQL Server 2000M，科学出版社，2003，97-98。6. 数据库定期的维护。根
30、据e-r图我们可以确定出实体联系的大体框架，接下来我们可以根据实体及其属性关键字确定关系数据库模型。在服务器上建立名为edu的数据库，其中包括以下表：anameaplaceTypeDerectorPublishedLength冰雪奇缘美国冒险克里斯巴克2019/11/2299你的名字日本爱情新海诚2016/8/26106罗小黑战记中国奇幻MTjj2019/9/121013.4 登录设计3.4.1登录系统在用户进入视频网站之前，需要先进行注册登录系统，包括账号密码，系统判断输入的账号和密码是否正确，由于账号使通过MD5加密过的，所以在对用户密码判断时应先对密码进行MD5转换后再进行判断，当用户名
31、或密码不正确时，系统会在页面提示账号或密码错误信息。用户登录后要防止用户二次登录。3.4.2后台的管理由于后台管理系统只对后台的管理员开放，因此，后台管理的实质工作是指后台管理员对影视网站进行的添加、修改及删减等工作，添加工作的操作是指对保存到本地经过修改编辑过的动漫片上传到网站上去，修改时把排名比较靠后、热度比较小的动漫进行调整、修改，删减就是删去人气不高、已经过气了的动漫片。3.5 页面布局3.5.1设计首页布局网站的设计不但要可以吸引住观众的眼球，还要求要实用、有利用价值才行。所以设计师在设计的时候要注意到的地方很多，无论是字体还是色彩搭配，都有极大的讲究，才可以构建出一个兼并实用和美观
32、一体的网页页面出来。网站的首页，既然位于首页，就要有出众的视觉效果和详细有用的文字内容，所以在制作网站时，首页的设计也是尤为重要的一个部分。1、为了使功能齐全，板块主要分为网站首页、动漫电影、番剧、直播、登录页面、注册页面、联系客服等板块。2、接着，可以插入一些图片（jpg.或png.），增加网页的美观度，插入图片可以使用img标签来实现，给标签添加”src”属性，属性值中加入要插入的图片的路径，代码为,例如我网站中的实例代码如下图所示： 然后通过CSS代码调整图片在网页中的位置如下图： 网页中的页面效果为： 3、网页中的视频多种多样，有时候要找的视频没有那么容易找到，这时候就需要一个搜索功能
33、的按纽了，在body部分添加一个新的标签，再添加一个input type=search的元素作为搜索的按键，再添加一个提交按钮：具体代码如下图所示：网页中的页面效果如下图所示：4、在首页可以添加一些最近热门播放的动漫推荐，具体例子如下：源代码如下图：CSS代码如下：网页中的页面效果如下图所示：5、最后，可以在网页中设置动漫类型的分类：源代码如下：CSS代码如下：界面总体布局：标题导航栏横幅二级导航栏正文客户端登陆注册联系客服3.5.2编辑头内容头元素是所有头部元素的容器，它可以包含脚本，指示浏览器在哪里能够找到样式表，提供元信息等。、以及等标签，都可以添加到头中。如我的网页中添加了等，如下图：
34、3.5.3插入文本插入文本部分，可以说是最基础的了，在body中，输入input标签，然后再type属性中输入text,如，然后可以通过 等改变字体大小、字体颜色、字体样式。3.5.4插入图像在页面中插入图片，可以通过使用img标签。新建一个新的html文件，给标签添加”src”属性，属性中添加要插入的图片所在文件的路径，这样图片就添加成功，可以大开挖网页在网页中预览。其中，图片可以添加jpg.或png.格式的文件。3.5.5插入视频在网页中插入视频，首先需要找到视频的文件，我所用到的视频格式是MP4格式，首先加入一个标签，利用宽width和高height控制视频长度高度，然后选择视频文件的路
35、径，先打开网页查看视频所在位置，接着在CSS页面设置调整视频的位置，我所加入的视频有两个，并且设置他们在同一行上，完成的代码：源代码如下图：CSS代码如下图：在页面中显示的效果：3.5.6登录注册页面1、登录系统：在网站中加入一个登录的页面，用户可以输入用户名+密码，即可登录，登录html代码如下：具体页面效果:1、 注册系统：如果用户没有此网站的账户，可以先通过注册账号。点击首页中的注册，进入到注册页面，输入新注册的用户姓名，通过输入两次用户密码，必须是6-8位数字或字母，不可输入下划线等字符，确定两次输入密码一致，如果密码不一致，系统会出现“两次密码输入不一致”的提示，接着是输入本人手机号
36、码、邮箱等，选择自己的性别、爱好，最后，确定用户的籍贯，点击提交，注册成功。部分代码如下：然后设置部分代码如下图：页面中显示的效果为：3.5.7链接其他网页创建完一个网页，需要创建一个新的网页，这时候要新建一个新的html网页和新的CSS页面，在其中进行新的页面的编辑，如果要连接上前面做过的网页，可以在页面中添加的标签，可以链接每一个页面。3.6建立网页链接3.6.1图片链接在网页中建立一个图像链接，可以在图片上加入一个,这样，图片链接洁完成了，点击图片就可以自由切换页面了。第四章 作品展示网页制作完，下面是我的作品展示：1、首页，图中的大图里面存放着几张图片在一起，打开页面的时候图片可以自动
37、变换：可以在如图所示位置选择自己想看的电视内容：2、在上面的菜单栏，选择动画一栏，可以切换到看动画的页面，如下图示：3、进入页面有电影的宣传图，下面有电影的宣传片，点击可以观看内容，如图所示：4、在下面一栏，有可以筛选你想看的动漫，包括视频的年代、类型、产区等等,如图所示：5、接下去点击番剧，可以看到第三个页面，专门看动漫剧集的地方，页面内容与动画页面相似：6、点击直播页面，是专门看主播cosplay动漫角色的平台，点击进入可以观看直播，页面如图所示：7、点击登录页面，可以进入到登录账号的页面，如图所示：登入用户名和密码即可进入自己的账号8、点击注册，进入注册账号页面，如图所示：参考文献：1.
38、 基于项目面向沟通的网页设计教学模式与应用 赵智慧 浙江工业大学之江学院，浙江，杭州，310024中国教育信息化。高教职教 2010，（8）2.结合理念在网页设计中的应用 周月芝 保定市财贸学校，河北，保定，071000 中国市场 2009，（14）3.刘志军，冯永华.课堂教学变革的反思与重建“慕课”背景下课堂教学变革的思考J.教师教育学报，2014，11(3):53-63.4.孙晓娟.基于“慕课”的高职课程改革及教学评价的研究J.中国管理信息化，2016，1(4):236-237.5.何磊孙志宜.视觉传达设计专业课程教学改革与创新J.合肥师范学院学报，2015，(1)33期.6王丽丽，陈雯嫣
39、，戴天。我的网站我设计微课程教学设计J.中国信息技术教育，2017,（Z1）：22-24.7吝春妮。精品课程网站的优化设计策略研究J.中国信息技术教育，2016,（23）：110-112.8孟安宁。高校文科类网站设计课程教学模式研究J.时代教育，2017,（07）：167.9刘兴。基于J2EE高校教师教育研究中心网站系统的设计与实现D.湖北工业大学，2017.10徐蕾。威客网在高职平面设计类课程教学中的应用研究-以南京金陵中等专业学校网站综合实训课为例J.现代职业教育，2017,（15）：77.致谢通过在广东东软学院大学四年紧张又乐在其中的学习时光中，我对本专业的课程都有了一些了解，在这其中，有些课程更是让我多有体会，让我对其产生很大的兴趣，就比如这次的网站平台设计，其中的设计成果总会让我产生意外的惊喜，而且这次设计让我学到了更多东西，不仅是这方面知识的学习，还包括了要做好一件事情，往往不是那么容易的，需要你下定决心去做好好，全力以赴才有可能，老话说的好：“世上无难事，只要肯攀登。”世界上没有困难的事情，只要你愿意刻苦的去完成，没有什么完成不了的，明白这个道理，这其中