明星网站建设 毕业论文

明星网站建设 毕业 摘要 随着互联网的飞速发展，电脑网络已应用到各个领域，普及到千家万户,无论是国内还是国外都迅速的发展起来。现在，网络已经成为人们快速获取信息、发布信息和传输信息的主要渠道，成为每个人生活中的一部分，同时网络也提供了一个很好的信息交换平台。网络传媒以被越来越多的人看好，而网站就是传媒很好的一种方式，目前有很多企业都在开发属于自己的网站，所以研究网站建设是很有必要的 。 现今的社会，人们已经离不开了网络，网络已经成为人与人之间交流的一种形式，它能够把事情的复杂化转为简单化，摆脱了时间和空间的限制。网站为消费者提供了一个网络生活空间，通过其网页展示了明星周杰伦基本信息 、个人履历 、 广告代言 、社会活动、明星相册、社会等一系列内容的介绍。使人们更加全面的了解周杰伦。 本论文介绍了网页的结构分析和具体功能实现，网页的界面和运作方式，尽力模拟近代网页普遍性形式。 关键词:网站建设，明星网站，网络传媒 Abstract With the rapid development of Internet, computer network has been applied to various fields, access to thousands of households, whether domestic or abroad have developed rapidly. Now, the network has become the main channel for people to obtain information, dissemination of information and rapid transmission of information, become a part of everyone's life, at the same time, the network also provides a good information exchange platform. Network media by more and more enterprises, and web site is a good way of the media, there are many enterprises in the development of their own web site, so the site construction is very necessary. Today's society, people have cannot do without the Internet, the network has become a form of communication between people, it can make things complicated to simple, get rid of the limitation of time and space. The site provides consumers with a network of living space, through the Webpages how star Jay Chou basic information, resume, endorsements, social activities, star album, social evaluation and a series of content introduction. Make people more comprehensive understanding of Jay Chou. This paper introduces the structure analysis and the concrete function realization of Webpage, Webpage interface and mode of operation, to simulate the Webpage universal form, Keywords: website construction, star website, network media 目录 引言 ....................................................................................................................................... 1 1 概述 ................................................................................................................................... 2 1.1软件的选择及介绍 ...................................................................................................... 2 1.2选题的目的和意义 ...................................................................................................... 2 2网站的设计 ........................................................................................................................ 2 2.1设计准备 .................................................................................................................... 2 2.2确定网站主题 ............................................................................................................. 2 2.3确定网站色彩及风格................................................................................................... 3 2.4确定网站内容 ............................................................................................................. 3 3网站各模块简介 ................................................................................................................ 3 3.1网站首页 .................................................................................................................... 4 3.2基本信息 .................................................................................................................... 4 3.3个人履历 .................................................................................................................... 5 3.4个人作品 .................................................................................................................... 6 3.5广告代言 .................................................................................................................... 6 3.6社会活动 .................................................................................................................... 6 3.7明星相册 .................................................................................................................... 7 3.8社会评价 .................................................................................................................... 7 4 具体实现与分析 ............................................................................................................... 8 4.1页面布局 .................................................................................................................... 8 4.2站点的建设与收集素材 ............................................................................................... 9 4.3 HTML语言 ...............................................................................................................10 5 .................................................................................................................................. 11 参考文献 ............................................................................................................................. 12 致谢 ..................................................................................................................................... 13 引言 随着科技的进步、时代的发展，计算机信息行业也逐步壮大，人们也越来越离不开各种各样的信息，人们对信息的追求越来越迫切。在信息技术飞速发展的今天，人们获取信息的方式更多是来源于互联网。而吸引浏览用户的则是视觉效果出色、信息量丰富、使用起来便捷的网页，所以网页设计尤为重要。 互联网成为人们快速获取、发布和传递信息的重要渠道，它在人们政治、经济、生活等各个方面发挥着重要的作用。网页设计伴随着网络的快速发展而快速兴起，作为上网的主要依托，由于人们使用网络的频繁而变得非常的重要。网页讲究的是排版布局，其功能主要就是提供一种形式给每个上网者，让他们能够了解网站提供的信息[1]。 网站作为网络信息主要的表现形式而且还是互联网信息的主要承载者，在互联网上表现出了它及其重要的地位，发挥着及其重要的作用，无论是国内还是国外都迅速的发展和壮大，并被人们重视。网站的迷人之处在于它综合使用文本、图像、声音、动画视频信息和内容，具有丰富的多媒体表现与互动特点。毋庸置疑，网站已成为最吸引人的也是最有效的信息传递的手段与方式。随着网络技术的逐步发展，各类网站纷纷出现，娱乐网站也成为了一种时尚，在网络世界里的一片天地，展示自己的才华和风格。 本网站的制作目的是能够使更多的人能够了解明星周杰伦，使更多的人能够从新认识周杰伦。 1 1概述 1.1软件的选择及介绍 Dreamweaver是美国MACROMEDIA公司开发的集网页制作和管理网站于一身的所见即所得网页编辑器。于2005年6月推出并正式投入市场以来，已经发展得相 [2]当成熟。关于Dreamweaver的技术介绍的相关书籍与网络信息相当丰富。通过大学中的学习，对Dreamweaver有了比较深刻的认识，并比较轻松的掌握了Dreamweaver的操作。因此，软件技术可以完成任务的要求。 1.2选题的目的和意义 随着Internet的迅速发展，我们已经不再满足于单单地进行浏览网页，而是希望我们能更深入地参预到网络中去，Internet的开放性使得歌迷们自行建立了属于自己偶像的网站，这样可以使更多人详细了解自己的偶像。 我们更需要的是交流，交流能促进我们不断的进步，并且融合别人的长处;让我们能多一些渠道倾听来自不同立场的声音;通过此网站可以使很多志同道合的朋友在这里和你相识、相交、相知。 2网站的设计 2.1设计准备 网页设计是一门新兴起的设计类，近几年来随着网络的发展而逐渐受到人们的重 [3]视，它自己本身以网络作为载体,把各种各样的信息快捷、方便的方式传达给大家。一个网站项目的确立一般是建立在各种各样的需求上面的，这是明星网站，所以这种需求一般来自于歌迷的实际需求，其中每个人的实际需求占了绝大数部分。因此如何更好地了解、分析需求，并且又能够准确、清晰地以文档的形式表达出来，保证开发过程以个人需求为目的正确项目开发方向进行。 2.2确定网站主题 做网站，首先必须要解决的就是网站内容的问题，即是确定网站的主题。如果自己在某些方面越有兴趣，或掌握的资料越多，就可以做一个自己感兴趣的东西。你可以有自己的见解，做出自己的特色网站。对于内容主题的选择，要做到小而精，即主 2 题定位要小，且内容要精。不要去试着作一个包罗万象的站点，这往往会失去你的网站的特色，也会带来很大的劳动，给网站的及时更新带来更大的困难。我的网站主题是以周杰伦个人相关的资料来制作的，详细的介绍了周杰伦的个人信息、作品及成就等。 2.3确定网站色彩及风格 网站色彩，网站给人的第一印象来自于视觉的冲击，不同的色彩搭配会产生不同的效果，并可能影响到访问者的情绪。“标准色彩”指的是能体现网站形象和延伸内 [4]涵的色彩，给人们一种以整体统一的感觉。我明星网站的色彩是以灰色为主，黑色的字体和浅色的图像给人一种舒服的感觉。 风格是抽象的，指网站的整体形象给浏览者留下的综合感受。这个“整体形象”包括网站的LOGO、网站的色彩、网站的字体、网站的标语等许多因素。网站是可以平易近人的、生动活泼的，也可以是严肃专业的。但不管是在色彩、技术、文字、布局、还是交互方式上，只要能由此让浏览者明确的看出这是你的网站所独有的，这就形成了一种风格。 风格是有人性的，它通过网站的色彩、技术、文字、布局、交互方式等可以综合概括出一个网站的自己的个性;我的网站风格是以舒服为主，给人一种舒舒服服的感觉。 2.4确定网站内容 我的明星网站大体上包括了一些内容:网站首页、基本信息 、个人履历 、 广告代言 、社会活动、明星相册、社会评价等，方便大家的浏览。 3网站各模块简介 一个网站的首页是网站的核心，当一个网站服务器收到一台电脑上网络浏览器的 [5]信息连接请求时，便会向这台电脑发送这个文档。当在浏览器的地址栏输入域名，而并未指向特定目录或档案时，通常浏览器会打开网站的首页。 网站首页往往会被编辑的很易于了解该网站所提供的所有资讯，并引导互联网用户浏览网站其他部分的内容。这部分内容一般被认为是一个目录性质的内容，我的明星网站的首页给大家一目了然的感觉，打开首页就可以了解我的明星网站的设计风格 3 还可以看到一些特定的功能，大家可以尽情地浏览其中的信息。 3.1网站首页 本明星网站的首页主要介绍了明星周杰伦的详细的个人信息，希望看到这个网站的人能一下子了解周杰伦。首页的大致图如下图3-1所示: 图3-1首页模板展示 3.2基本信息 此模块详细的介绍了周杰伦的个人信息，使人们能够详细的了解明星周杰伦。在制作本页面的时候我采用了首页的框架，在这个框架的中间介绍了周杰伦的个人情况。通过我的介绍可是使别人在浏览我的网站的时候能一目了然的清楚。如图3-2所示 4 图3-2基本信息展示 3.3个人履历 在这个模块中，我想表达的是别人能一下子就了解周杰伦的个人情况，所有，在制作这个页面的时候我详细的介绍了周杰伦的个人情况。如图3-3所示。 图3-3个人履历展示 5 3.4个人作品 在制作个人作品这个页面的时候，我想了很久，因为周杰伦的个人代表作品太多了，所以我选择了他在各个领域最具有代表性作品，然后列举出来。在页面的左后我放上了几张我比较喜欢的个人照片。如图3-4所示。 图3-4个人作品展示 3.5广告代言 作为21世纪最具有代表性的歌手之一，周杰伦为很多产品做过代言，其中最具有代表性的就是奶茶广告。在本页面中我详细的讲解周杰伦的广告代言。本页面清晰的表现了周杰伦所代言的广告。 3.6社会活动 作为著名歌星，他都一举一动都是引人注目的，周杰伦在成名之后积极的投身在 ，周杰伦向受灾的梁平小学，捐慈善事业，在2008年5月12日四川汶川发生地震时 款50万元人民币，后又捐款200万元人民币捐献给灾区人民，然后再通过红十字会向灾区捐款50万元人民币。取消重庆演唱会的行程，将演唱会改成募捐的形式，除 6 了将演唱会的收入全部捐献给灾区之外，并现场带领歌迷筹集超过3000多万元人民币。 3.7明星相册 在明星相册这一页面，我花费了很大的精力，因为刚开始我不知道怎样的形式来展示照片，最后我用一个CSS来展现，点击不同的照片在中间的位置会显示不同的照片。本页面我放置了很多我所喜爱的明星照片。全面的显示了不同时期的周杰伦。 3.8社会评价 他在很大程度上提升了词曲原创人在华人音乐界的地位，而周杰伦自己也与另外数位知名的华语音乐制作人王力宏等并列成为2002年至2007年影响华语音乐很深的新人。周杰伦的音乐风格亦十分多样化，他的专长是节奏蓝调(R&B)和饶舌(Rap)。他创新地在歌曲里使用西方古典音乐。周杰伦融合中西音乐的风格创造了一种新鲜的声音，这和台湾的主流音乐很不同。本页面详细的讲解了对周杰伦的评价。如图3-5所示 图3-5 社会评价所示 7 4具体实现与分析 4.1页面布局 最开始，网页呈现在你面前，它就好像一张白纸，它需要你任意挥洒你的设计才思，可以创造出自己的设计方案。，虽然你能控制一切你所能控制的东西，但假如你知道什么是一种约定俗成的标准或者说大多数访问者的浏览习惯，那么你可以在此基 [6]础上加上自己的东西，这样你创造出来的网页才能更好的被别人接受。 1、页面尺寸 由于页面尺寸和显示器大小及分辨率有关系，网页的局限性就在于你无法突破显示器的范围，而且因为浏览器也将占去不少空间，留下给你的页面范围变得越来越小。一般分辨率在800x600的情况下，页面的显示尺寸为:780x428个象素;分辨率在640x480的情况下，页面的显示尺寸为:620X311个象素;分辨率在1024X768的情况下，页面的显示尺寸为:1007x600。从以上数据可以看出，分辨率越高页面尺寸越大。 浏览器的工具栏也是影响页面尺寸的原因。一般目前的浏览器的工具栏都可以取消或者增加，那么当你显示全部的工具栏时，和关闭全部工具栏时，页面的尺寸是不一样的。 在网页设计过程中，向下拖动页面是惟一给网页增加更多内容(尺寸)的方法。除 [7]非你能肯定站点的内容能吸引大家拖动，否则不要让访问者拖动页面超过三屏。如果需要在同一页面显示超过三屏的内容，那么你最好能在上面做上页面内部连接，方便访问者浏览。 2、整体造型 造型就是创造出来的物体形象，这里是指页面的整体形象。这种形象应该是一个整体，图形与文本的接合应该是层叠有序。虽然，显示器和浏览器都是矩形，但对于页面的造型，你可以充分运用自然界中的其它形状以及它们的组合:矩形，圆形，三 [8]角形，菱形等。 对于不同的形状，它们所代表的意义是不同的。比如矩形代表着正式，规则，你注意到很多ICP和政府网页都是以矩形为整体造型;圆形带表着柔和，团结，温暖，安全等，许多时尚站点喜欢以圆形为页面整体造型;三角形代表着力量，权威，牢固，侵略等，许多大型的商业站点为显示它的权威性常以三角形为页面整体造型;菱形代 8 表着平衡，协调，公平，一些交友站点常运用菱形作为页面整体造型。虽然不同形状代表着不同意义，但目前的网页制作多数是接合多个图形加以设计，在这其中某种图形的构图比例可能占的多一些。 3、页头 页头又可称之为页眉，页眉的作用是定义页面的主题。比如一个站点的名字多数都显示在页眉里。这样，访问者能很快知道这个站点是什么内容。页头是整个页面设 [9]计的关键，它将牵涉到下面的更多设计和整个页面的协调性。页头常放置站点名字的图片和公司标志以及旗帜广告。 4、文本 文本在页面中出现都数以行或者块(段落)出现，它们的摆放位置决定者整个页面布局的可视性。在过去因为页面制作技术的局限，文本放置的位置的灵活性非常小，而随着DHTML的兴起，文本已经可以按照自己的要求放置到页面的任何位置。 5、页脚 页脚和页头相呼应。页头是放置站点主题的地方，而页脚是放置制作者或者公司信息的地方。你能看到，许多制作信息都是放置在页脚的。 图片 6、 图片和文本是网页的两大构成元素，缺一不可。如何处理好图片和文本的位置成了整个页面布局的关键。而你的布局思维也将体现在这里。 7、多媒体 除了文本和图片，还有声音，动画，视频等等其它媒体。虽然它们不是经常能被利用到，但随着动态网页的兴起，它们在网页布局上也将变得更重要。 4.2站点的建设与收集素材 1、创建本地站点的具体操作步骤如下: 要制作一个网站，第一步操作都是一样的，就是要创建一个“站点”，这样可以使整个网站的结构清晰地展现在面前，避免了以后复杂的管理。打开Dreamweaver从菜单中选择“站点/新建站点”在弹出的对话框中填写目录和指定文件夹，输入站点名称和默认的存放图像的位置。在文本框中输入自己已经想好的网站名称“个人网站”。填好后，单击“下一步”，进入下一个步骤。由于我要做的是一个静态的网页，所以选择上面的一项“否，我不想使用服务器技术。”单击“下一步”，进入下一个步 9 骤。在此选项中有两个选择，选择推荐的“编辑我的计算机上的本地副本，完成后再上传到服务器”。底下的文本框允许在本地磁盘上指定一个文件夹，Dreamweaver将在其中储存站点文件的本地副本。单击该文本框后面的文件夹图标，新建并指定一个 [10]空的文件夹“E:/web555”。之后单击“下一步”，进入下一个步骤。这一步是如何设置连接到远程服务器，弹出式菜单中有6种选择，这里选择“无”。而后“下一步”再“完成”，这样，一个站点就算建好了。 2、收集素材: 收集一些网站所需要的素材，比如图片、动画、文字等。做网站前的一些准备工作也是很重要的。只有有了充足的准备我们才能把网站做好。因此在做网站前我们必须把做网站的过程中可能所需的所有的材料都准备好，这样才能做出让自己和大家都满意的网站，而不至于在做的过程中乱了手脚。 4.3 HTML语言 要想建出专业的Web页面，就要学会利用HTML来编写网页。HTML(Hypertext Markup Language)超文本标记语言，是用于编写网页的主要语言。它是纯文本的类型的语言，语法非常的简单。它通过对各种标记、元素、属性、对象等的设置来建立与图形、声音、视频等多媒体信息以及对其它超文本的链接。一般典型网页应该包括如下HTML代码: 其中，之间是网页的标题，一般被显示在浏览器的标题栏中。与之间可以声明和定义变量、方法，还可以加入java-script/vb-script等一些脚本语言。与之间是网页的主要内容，任何网页元素都可以加入其中。例如在主体中可以加入标签是定义了一个层，加入与标签是定义字体样式，加入标签是定义一个CSS样式等。 10 5总结 2015年03月，我开始了我的毕业设计工作，时至今日，设计基本完成。从最初的茫然，到慢慢的进入状态，再到对思路逐渐的清晰，整个写作过程难以用语言来表达。历经了几个月的奋战，紧张而又充实的毕业设计终于落下了帷幕。回想这段日子的经历和感受，我感慨万千，在这次毕业设计的过程中，我拥有了无数难忘的回忆和收获。 4月初，资料已经查找完毕了，我开始着手论文的写作。在写作过程中遇到困难我就及时上网找资料找一些比较好的来参考，并和同学互相交流。在大家的帮助下，困难一个一个解决掉，论文也慢慢成型。4月底，论文的大致思路已经完成。经过自己的不断努力，同时翻阅了大量的资料(包括网上资料、书本及学校的一些相关资料)，我这个明星网站基本制作完成，个人感觉还是不错的。总体达到我自己当初的设想，当然也有一些不足之处，由于设计时间较紧，加之设计经验的不足，总是觉得有很多不尽人意的地方，譬如功能不全，外观粗糙，底层代码的不合理，网站的整体设计及各模块功能可能设计的不完全„„数不胜数，有待于进一步的完善和改进。尤其是本想制作一个留言板的，但后期因种种原因没有制作成功。但整体来说还算不错。在这明星网站中我尽情地展示了自己所喜爱的明星。 我的这个网站可以说是我在大学校园里的最后一次作品了，所以在设计的过程中，我倾注了大量的心血，在此期间，我查阅大量的资料，请教同学、老师、朋友，只为了让效果更完美。通过这次的毕业设计，使我得到了实际的锻炼，不但是对我这三年所学知识的一个检验，也是对我计算机应用水平的一个考核，而且还给了我一个找出自己不足的机会。 回首三年，取得了些许成绩，生活中有快乐也有艰辛。感谢老师三年来对我孜孜不倦的教诲，对我成长的关心和爱护。学友情深，情同兄妹。三年的风风雨雨，我们一同走过，充满着关爱，给我留下了值得珍藏的最美好的记忆。 11 参考文献 [1] 杨尚森.网页设计与制作[M](第三版).北京:电子工业出版社，2010年 [2] 赵增敏.ASP动态网页设计[M].北京:电子工业出版社，2003年 [3] 胡珊.个人网页设计与制作[J].电脑学习.2009年，第二期，28-29页 [4] 蒙新.ASP编程技术与综合实例演练[M].北京:清华大学出版社，2001年 [5]周琦.关于网页设计与制作技术的探讨[J].电脑知识与技术，2009年，第26期.7376-7378页 [6] Eric A(Meyer. Cascading Style Sheets: The Definitive Guide[M](北京:中国电力出版社，2001.5 [7] 王君学.网页设计与制作[M].北京:人民邮电出版社，2009年 [8]Elisabeth Freeman, EricFreeman. Head First HTML with Css & XHTML [M].北京:东南大学出版社，2006.5 [9] 王映雪.HTML网页制作[M].北京:清华大学出版社，2009年 [10] 谢希仁.计算机网络(第五版)[M].北京:电子工业出版社，2008年 12 致谢 毕业论文暂告收尾，这也意味着我在黄河交通学院的三年学习生活既将结束。回首既往，自己一生最宝贵的时光能于这样的校园之中。在这三年的时间里，我在学习上和思想上都受益非浅。这除了自身努力外，与各位老师、同学和朋友的关心、支持和鼓励是分不开的 。本毕业设计完成之际，我由衷地感谢杨老师的大力帮助和支持，感谢我的同学和朋友，在我遇到各种各样复杂问题的时候，给予我鼓励和帮助，使我分析问题和解决问题能力有了很大提高。 三年寒窗，所收获的不仅仅是愈加丰富的知识，更重要的是在阅读、实践中所培养的思维方式、表达能力和广阔视野。很庆幸这些年来我遇到的许多恩师益友，无论在学习上、生活上还是工作上都给予了我无私的帮助和热心的照顾，让我在诸多方面有所成长。感谢三年来各位老师和同学对我学习、生活的关心和帮助。 最后感谢我的母校三年来对我的栽培。尤其是我的各位授课恩师，在我的面前展示了一个更加广阔而新颖的天地，他们的严谨态度、精湛的技艺、一丝不苟的治学精神使我受益非浅，倍感新鲜。在今后的工作生涯中，我会牢记这几年老师们对我的教导，不忘学校对我的栽培。我在这即将毕业离校的时候，我衷心的祝愿各位老师工作顺利，一生幸福。同时，我也祝愿我的同学到可以找的一份好的工作，都有一个好的前程。 13