计算机个人网站设计论文.docx

1、计算机个人网站设计论文目 录内 容 摘 要 2第一章 绪论 11.1网站作用 11.2对网络的认识 11.3 网站的由来和发展 1第二章 个人网站制作相关技术 32.1 FLASH 32.2 Dreamweaver 32.3 Photoshop简介 3第三章个人网站建设需求分析 431网站的总体规划 432个人网站制作的目的 433HTML简史 434超链接 434文本 535网页中图像的使用常识 5第四章 模板创建和更新其他页面 641模板的创建 642创建可编辑区域 643创建模板 644更新模板及页面保存模板 7结 论 8后 记 9参 考 文 献 10附 录 11个人网站设计与制作内 容

2、 摘 要摘要：Internet的迅猛发展正在彻底地改变我们的生活、工作方式，网络已经成为我们生活中不可缺少的一部分。随着时代的发展，网络逐渐成为最时尚、最快捷的交流工具。从2000年中国入世以来，全球经济一体化的趋势对国有企业带来巨大冲击。在互联网络高速发展的今天，网站正成为学校、公司、企业、政府及团体进行形象展示、信息发布、业务拓展、客户服务、内部沟通的重要阵地，它不但具有快捷、无距离及随时随地均可的更新的特性,更能提供一些互动性的功能,使得网站充满生气，让人倍感亲切。网站的迷人之处在于综合使用文本、图像、声音、动画和视屏的信息和内容，具有丰富的多媒体表现与互动特点，无可置疑，网站已成为最吸

3、引人的也是最有效的信息传递手段和方式因此在网络发展的同时，网站的建设也倍受人们的重视。随着网络技术的发展，各类网站纷纷出现。个人网站也成为了一种时尚。越来越多的人希望拥有自己的网站,开辟网站世界的一片天地,展示自己的才华和风格。关键词： Internet 个人网站 互动Abstract：The rapid development of Internet is thoroughly change our lives, work ways, network has become us the indispensable part in life. Along with the time devel

4、opment, the network gradually become the most fashionable, most efficient communication tools. Since Chinas entry into wto, from 2000, the trend of global economic integration of state-owned enterprise to bring the huge impact.In todays high-speed development of the Internet, the website is becoming

5、 the schools, companies, enterprises, government and institutional image display, information dissemination, business development, customer service, internal communications and important position, it not only has a quick, no distance and at any timeanywhere can be the updated features, but also prov

6、ides a number of interactive features, the site is full of angry people feel at home. The charm of the site is the integrated use of text, images, sound, animation and screen the information and content, with a rich multimedia performance and interactive features, there is no doubt, the website has

7、become the most attractive is the most effective means of information transfer while network development and the way the construction of the site much attention. With the development of network technology, various types of Web sites have cropped. The website has also become a fashion. More and more

8、people want to have your own website, opening up a world of web world, to show their talent and style. keywords：Internet website interactive第一章 绪论1.1网站作用Internet是目前世界上最大的计算机互联网络，它遍布全球，将世界各地各种规模的网络连接成一个整体。作为Internet上一种先进的，易于被人们所接受的信息检索手段，World Wide Web(简称WWW)发展十分迅速，成为目前世界上最大的信息资源宝库。据估计，目前Internet上已有上

9、百万个Web站点，其内容范围跨越了教育科研、文化事业、金融、商业、新闻出版、娱乐、体育等各个领域，其用户群十分庞大，因此，建设一个好的Web站点对于一个机构的发展十分重要。近年来，随着网络用户要求的不断提高及计算机科学的迅速发展，特别是数据库技术在Internet中的广泛应用，Web站点向用户提供的服务将越来越丰富，越来越人性化。Internet的迅猛发展正在彻底地改变我们的生活、工作方式，网络已经成为我们生活中不可缺少的一部分。1.2对网络的认识信息时代的来临拓宽了大家进行自我提升的途径，同时也对大家的素质提出了更高的要求。被称为当今社会的“天之骄子”的电脑主宰着世界的前进，而主宰电脑的我们

10、则更应该多思考，多研究，多学习。只读书的学习方式一去不复返，科技的日新月异，使我们不得不学习一种新的知识-计算机技术。怪不得有人说“不会电脑的人，将是新世纪的文盲”。足见网上学习的重要性。无可置疑，网站也是最有效的信息传递手段和方式因此在网络发展的同时，网站的建设也倍受人们的重视。随着网络技术的发展，各类网站纷纷出现成为最吸引人。1.3 网站的由来和发展1994年中国科学院高能物理研究所设立了国内第一个web服务器,推出一个叫做“中国之窗”的网页，这可能是国内Internet上出现的第一个Web网页，1995年开始，中国教育科研网，中国科技网，中国公用计算机到期以及中国金桥网这构成中国数字神经

11、系统的四大互联网络相继建成，使互联网在中国开始真正进入社会生活之中。这时其，个人网站出现的条件还很不成熟，国内上网的人数很少，也缺乏支持个人建站的环境，用户很难找到理想的个人主页存放地。个人网站发展的第二阶段是从工作出发997年初到期998年，这段时间，中国网民数量飞速增长，个人网站日渐繁荣， 个人主页的数量级急剧增加。同时，越来越多的商业网站开始免费提供个人主页空间，这些良好的外部极大地促进了个人网站的发展，涌现了一批很著名的个人网页，从工作出发998年下半年开始，随着互联网应用的深入的普及，随着众多主页的制作工具的出现，使得建站成为一件非常容易的事，创建一个能充分体现自我风格和特色的个人网

12、站已经成为互联网用户的新追求。第二章 个人网站制作相关技术2.1 FLASHFLASH是制作动画的一个软件工具，它可以通过文字、图片、录像、声音等综合手段形象的体现一个意图，通常像我们看到的广告片段一样。一般利用 Flash 技术来包装公司形象、进行产品宣传等，通过网页充分体现它的魅力，并可以达到非常好的效果。与以前版本相比较Flash MX有如下特点：2.2 DreamweaverDreamweaver是Macromedia公司推出的一款“平民化”的网页制作软件，具有可视化编辑界面和强大的所见即所得网页编辑功能。用户不必编写复杂的HTML源代码，就可以生成跨平台、跨浏览器的网页。同时，Dre

13、amweaver支持动态HTML，并采用了Roundtrip HTML技术，从而奠定了在网页高级设计功能方面的领先地位。在进行网页设计过程中，动态HTML技术能够让用户轻松设计复杂的交互式网页，产生动态效果；而Roundtrip HTML技术则可以支持HTML源编辑模式，不会产生冗余代码，使网页渲染速度加快。因此，Dreamweaver是一款可以满足多层次需求，功能强大的可视化专业级网页设计和制作工具。2.3 Photoshop简介Photoshop是Adobe公司旗下最为出名的图像处理软件之一，集图像扫描、编辑修改、图像制作、广告创意，图像输入与输出于一体的图形图像处理软件Photoshop

14、是世界顶尖级的图像设计与制作工具软件。图像处理是对已有的位图图像进行编辑加工处理以及运用一些特殊效果，其重点在于对图像的处理加工。在表现图像中的阴影和色彩的细微变化方面或者进行一些特殊效果处理时，使用位图形式是最佳的选择，它在这方面的优点是矢量图无法比拟的。第三章个人网站建设需求分析31网站的总体规划是从总体上对网站的架构进行整体规划。因为只有这样，才能在网站的制作与维护中对网站的功能有一个清晰的把握。此外，做好网站规划，会对网站以后的功能扩展起到事半功倍的作用。32个人网站制作的目的通常情况下，架设个人网站主要是为了通过互联网表达个人在交际、生活等方面的信息需求或者进行信息的交流，具有较强的

15、目的性，我的个人网站一般体现 在：为了展示自己的风采，让大家和我一起分离我的心得与经验，让和我有共同爱好的朋友有一个倾诉的地方。首页分析：首页的设计的简述为了使我的首页美观生动，吸引人在我的首页，我还添加了形象开关动画页面，在它的下面我添加了我的flash动画作品，这样会使网页具有动态美的感觉。在网页的最上方，是我的网站名称。33HTML简史HTML超文本标记语言(Hypertext Markup Language)网络的资讯越来越多，网站须有引人注意的外观,才能增加浏览人次,达到宣传的目的.人们开始注意网页的外观。HTML亦因此变得更复杂,更具弹性。表格，原来是更整齐展现资料工具，变成了排版

16、工具。CSS的出现令以表格为基础的外观设计被视为过时。服务器方面的技术亦改变了网络的构造，使用者可以选择其浏览方式、外观。Flash的出现为设计师和媒体创作人开创了新路。除了引人的外观之外，亦有一个重要的考虑点：网34超链接超链接在本质上属于一个网页的一部分，它是一种允许我们同其他网页或站点之间进行连接的元素。各个网页链接在一起后，才能真正构成一个网站。所谓的超链是指从一个网页指向一个目标的连接关系，这个目标可以是另一个网页，也可以是相同网页上的不同位置，还可以是一个图片，一个电子邮件地址，一个文件，甚至是一个应用程序，而在一个网页中用来超链接的对象，可以是一段文本或者是一个图片。当浏览者单击

17、已经链接的文字或图片后，链接目标将显示在浏览器上，并且根据目标的类型：内部链接，锚点链接和外部链接。超链接对象：如果按照使用对象的不同，网页中的链接又可以分为：文本超链接，图像超链接，E-mail链接，锚点链接，多媒体文件链接，空链接等。超链接是一种对象，它以特殊编码的文本或图形的形式来实现链接，则相当于指示浏览器移至同一网页内的某个位置，或打开一个新的网页，或打开某一个新的WWW网站中的网页。网页上的超一般分为三种：一种是绝对URL的超链接。URL（Uniform Resource Locator）就是统一资源定位符，简单地讲就是网络上的一个站点、网页的完整路径。第二种是相对URL的超链接。

18、如：将自己网页上的某一段文字或某标题链接到同一网站的其他网页上面去；还有一种称为同一网页的超链接，这种超链接又叫做书签，颜色：在网页中，一般文字上的超链接都是蓝色（当然，用户也可以自己设计成其他颜色）文字下面有一条下划线，当移动鼠标指针到该超链接上时，鼠标指针就会变成一只手的形状，这时候用鼠标在键单击，就可以直接跳到与这个超链接相连接的网页或WWW网站上去。如果用户已经浏览过某个超链接，这个超链接的文本颜色就会发生改变（默认为紫色）只有图像的超链接访问后颜色不会发生变化。34文本网页内容是网站的灵魂，网页中的信息也以文本为主。无论制作网页的目的是什么，文本都是网页中最基本的、必不可少的元素。与

19、图像相比，文字虽然不如图像那样易于吸引浏览者的注意，但却能准确地表达信息的内容和含义。一个内容充实的网站必然会使用大量的文本，良好的文本格式可以创建出别具特色的网页，激发读者的兴趣。为了克服文字固有的缺点，人们赋予了文本更多属性，如字体、字号、颜色等，通过不同格式的区别，突出显示重要的内容，此外，还可以在网页中设置各种各样的文字列表，来明确表达一系列的项目。这些功能给网页中的文本增加了新的生命力。 35网页中图像的使用常识 在网络上随意注意一页面，都会发现除了文字以外还有各种各样的其他元素。如图像、动画和声音。图像或多媒体是文本的解释和说明，在文档的适当位置上放置一些图像或多媒体，不仅可以使文

20、本更加容易阅读，而且使得文档更加具有吸引力，网页中图像的格式通常有3种：即GIF、JPEG和PNG。目前GIF和JPEG文件格式的支持情况最好，大多数浏览器都可以查看它们。由于PNG文件具有较大的灵活性并且文件较小，所以它对于几乎任何类型的网页都是最适合的。但是Microsoft。Internet Explorer和Netscape Navigator只能部分支持PNG图像的显示，因此建议使用GIF和JPEG格式以满足更多人的需求。第四章 模板创建和更新其他页面41模板的创建从现有文档创建模板，Dreamweaver以文件扩展名.dwt来保存模板，模板被保存在站点的本地根文件夹中的一个特殊的T

21、emplates文件夹中.如果该Templates文件夹在站点中不存在, Dreamweaver将在保存新建模板时自动创建该文件夹。创建模板的方法如下：打开主页index，选择“文件/另存为模板”命令，弹出“另存为模板”对话框，选择“站点”并为模板输入一个唯一的名称，这里我输入“index”，然后单击“保存”按钮。42创建可编辑区域由模板生成的网页上，哪些地方可以编辑是需要预先设定的。创建可编辑区域的方法是在插入栏中选择“模板”“可编辑区域”对话框，在“名称”中输入唯一的名称，最后单击“确定”完成设置，可设置多个可编辑区域。我的个人网站其他栏目页面的头部和尾部是一样的，所以只需保留头部和尾部，

22、中间则为可编辑区域，我的模板如下图所示：43创建模板创建基于模板的页面在设置了模板设计之后，即可向空页面或已包含内容的页面应用模板。方法如下：首先新建页面，然后通过“窗口”菜单打开资源面板，选择面板中的模板资源，单击“应用”按钮，模板就被应用到了新的页面中，应用了模板的页面在右上角会标明了模板的名称，我的其他栏目和栏目内页大都是基于模板创建的页面。44更新模板及页面保存模板更新模板及页面保存模板时，Dreamweaver会询问它是否应该更新所有附着到该模板的文档。也可以使用“修改/模板/刷新页面”命令。Dreamweaver将在该模板的文档，大大提高了网站批量创建页面和更亲折效率。结 论通过这

23、次毕业设计，使我受到了一次用专业知识、专业技能分析和解决问题的全面系统的锻炼。使我在综合知识的选用方面，在企业网站开发的基本思想、方法方面，以及在常用代码设计思路技巧的掌握方面都能向前迈了一大步。在本次设计的全过程中，我对三年所学的知识有了一个比较系统的认识和理解，涉及了一个比较系统的认识和理解，涉及了各方面的知识，大大扩展了我的知识面，同时是我学会了如何使用所学的知识去解决一些实际的问题，在设计中我深知自己掌握的知识还远远不够，掌握的一些理论知识应用到实践中去，总会出现这样或那样的问题，不是理论没有掌握好，而是光知道书本上的知识是远远不够的，一定要把理论知识和初中结合起来，把学到的知识应用到

24、时间中去，多做多练，才可以把理论的精华发挥出来，知识不是知道，了解就好，一定要去应用它，发展它，让它在现实生活中得到充分的应用，从而解决一些问题，这才是学习的根本目的，而知识又不是单一的，它是互相联系的，学科与学科之间都有着内在的联系。通过这次的毕业设计中，让我深深地体现到进行网站开发不是一件简单的事情，它需要设计者具有全面的专业知识、缜密的思维、严谨的工作态度以及较高的分析问题、解决问题的能力，而我在很多方面还有欠缺。我会在以后工作的使用过程中，根据工作的具体要求不断的修改，完善，争取使该系统慢慢趋向完美。后 记 在本次设计的全过程中，我对三年所学的知识有了一个比较系统的认识和理解，涉及了一

25、个比较系统的认识和理解，涉及了各方面的知识，大大扩展了我的知识面，同时是我学会了如何使用所学的知识去解决一些实际的问题，在设计中我深知自己掌握的知识还远远不够，掌握的一些理论知识应用到实践中去，总会出现这样或那样的问题，不是理论没有掌握好，而是光知道书本上的知识是远远不够的，一定要把理论知识和初中结合起来，把学到的知识应用到时间中去，多做多练，才可以把理论的精华发挥出来，知识不是知道，了解就好，一定要去应用它，发展它，让它在现实生活中得到充分的应用，从而解决一些问题，这才是学习的根本目的，而知识又不是单一的，它是互相联系的，学科与学科之间都有着内在的联系。在本文的撰写过程中，我们的导师给予了悉

26、心的指导和关心，使我克服了众多困难终于完成了论文的撰写工作。导师渊博的知识、严谨求实的治学态度及敬业精神，给我留下了深刻的印象，并将在我今后的人生道路上产生深远的影响，在此论文完成之际，谨向导师致以崇高的敬意和衷心的感谢！参 考 文 献1弘博软件工程师研修计划Dreamweaver网页设计划2010年第13期2实例Photoshop CS3 中文版实例教程方晨、胡名正2009年第11期3Flash动画设计技术詹建新、孔欣2010年第8期4 沈大林主编：中文Flash 8案例教程，中国铁道出版社5 庄王健编：网页设计三剑客白金教程，电子工业出版社6网页样式CSS使用详解7精美网页特效设计技巧精粹

27、2006年出版8信息网络安全2008年第85其9电脑爱好者10Photoshop 7.0试题解答（高级图像制作员级）11 附 录个人网站策划书网站名称：奇思妙想网站目标：（1）每一个思想都是一种创意 （2）对自己做一个挑战、完成一次对自己的超越 （3）相信自己、我能 （4）愿每一个有梦想、有激情的人能够打造一片属于自己的蓝天执行网站结构蓝图（栏目）首页 个人资料 作品赏析 图片欣赏 我的心情 留言板网站文件规划表：表1根目录文件夹和文件名称使用栏目及说明D:indeximages所有的图片文件夹Index.html首页Geren.html个人资料Zuopin.html作品赏析TuPian .html图片欣赏XinQing html我的心情Liuyan.html留言板网站标准色：天蓝色与白色混搭网站分辨率：1024*768px网站风格：高调、清爽 首页结构草图：Logo标志导航栏相关信息版权信息图1