毕业设计（论文）-个人网站的设计与实现.doc

北京理工大学 现代远程教育 学院毕业设计 (论文) 第 1 页 摘摘 要要 三年前，在网上想找个 20m 的主页空间都很难，而且有种种限制，动不动 就把你的网站给删了。现在提供免费个人主页空间的网站越来越多，空间也越 来越大，很多人开始在网上为自己建个小窝。本文就个人网站的建设，介绍 一下制作流程和实现方法 . 关键词： 北京理工大学 现代远程教育 学院毕业设计 (论文) 第 2 页 目录 摘摘 要要.1 abstract.2 目目录录 .3 概概述述错误！未定义书签。 第第一一章章 建建设设个个人人网网站站的的设设计计 6 1.1 总体设计方案主 题鲜明 .6 1.2 网站的版式设计 6 1.3 色彩在网页设计中的作用.6 1.4 网页形式与内容相统一 .7 第第二二章章 新新技技术术的的使使用用 .7 2.1 三维空间的构成和虚拟现实 7 2.2 多媒体功能的利用 7 2.3 非图形的内容。 8 第第三三章章 优优化化网网站站 8 3.1 结构清晰并且便于使用。.8 3.2 导向清晰 .8 3.3 快速的下载时间。 8 3.4 方便的反馈及订购程序 .9 3.5 网站测试和改进 9 3.6 内容更新与沟通 9 第第四四章章 建建设设个个人人网网站站的的具具体体实实现现方方法法.9 4.1 确定网站主题 9 4.2 域名的选择 10 北京理工大学 现代远程教育 学院毕业设计 (论文) 第 3 页 4.3 掌握建网工具 10 4.3.1 html编辑器10 4.3.2 所见即所得的网页编辑器10 4.3.3 flash互动网页制作工具.11 4.4 确定网站界面 11 4.4.1 栏目与板块编排.11 4.4.2 目录结构与链接结构12 4.4.3 进行形象设计 .14 4.5 确定网站风格 14 4.6 有创意的内容选择 .15 4.7 推广自己的网站 15 4.7.1 搜索引擎注册与搜索目录登录技巧16 4.7.2 广告交换技巧.16 4.7.3目标电子邮件推广.16 第第五五章章 支支撑撑网网站站运运行行 .22 5.1 销售网站的广告位 .22 5.1.1 cpm (cost per million/thousand) 22 5.1.2 点透（click-through）.22 6.1.3 提成 (commission)22 5.2 与大型网站合作 23 第第五五章章 结结论论 23 参参考考资资料料 24 北京理工大学 现代远程教育 学院毕业设计 (论文) 第 4 页 前前言言 个人网站是个人向用户和网民提供信息 (包括产品和服务 )的一种方式 ,是 个人展示个性 和信息平台， ，网站是 internet 上宣传和反映 个性和文化的重 要窗口。 个人网站设计显得极为重要。 web 站点的设计是展现 个人形象、介绍产品和服务、体现 个人发展战略 的重要途径，因此我们必须明确设计站点的目的和用户需求，从而做出切实可 行的设计计划。我们会根据消费者的需求、市场的状况、个人自身的情况等 进行综合分析，以 “实质性”为中心，而不是以 “美术”为中心进行设计规划。 在设计规划时考虑 以下五点 ： 1.建设网站的目 地 2.提供服务 的对象 3.个人能提供的产品和服务 4.网站的特点 5.个人产品和服务的表现方式（风格） 考虑好这五点 ,我们就可以开始制作个人网站。 北京理工大学 现代远程教育 学院毕业设计 (论文) 第 5 页 第第一一章章 建建设设个个人人网网站站的的设设计计 1.1 总总体体设设计计方方案案主主题题鲜鲜明明 在目标明确的基础上，完成网站的构思创意即总体设计方案。对网站的整 体风格和特色作出定位，规划网站的组织结构。 web 站点应针对所服务对象（机构或人）的不同而具有不同的形式。有些站 点只提供简洁文本信息；有些则采用多媒体表现手法，提供华丽的图像、闪烁 的灯光、复杂的页面布置，甚至可以下载声音和录像片段。好的web 站点把 图形表现手法和有效的组织与通信结合起来。 为了做到主题鲜明突出，要点明确，我们将按照客户的要求，以简单明确 的语言和画面体现站点的主题；调动一切手段充分表现网站点的个性和情趣， 办出网站的特点。 web 站点主页应具备的基本成分包括： 页头：准确无误地标识你的站点 和个人标志； email 地址：用来接收用户垂询； 联系信息：如普通邮件地址 或电话； 版权信息：声明版权所有者等。 充分利用已有信息，如客户手册公共关系文档技术手册和数据库等。 1.2 网网站站的的版版式式设设计计 网页设计作为一种视觉语言，特别讲究编排和布局，虽然主页的设计不等 同于平面设计，但它们有许多相近之处。 版式设计通过文字图形的空间组合，表达出和谐与美。 多页面站点页面的编排设计要求把页面之间的有机联系反映出来，特别要 处理好页面之间和页面内的秩序与内容的关系。为了达到最佳的视觉表现效果， 我们将反复推敲整体布局的合理性，使浏览者有一个流畅的视觉体验。 1.3 色色彩彩在在网网页页设设计计中中的的作作用用 色彩是艺术表现的要素之一。在网页设计中，我们的设计师根据和谐、均 衡和重点突出的原则，将不同的色彩进行组合搭配来构成美丽的页面。 根 据色彩对人们心理的影响，合理地加以运用。如果您的个人有 cis（个人形 象识别系统），我们将按照其中的vi 进行色彩运用。 北京理工大学 现代远程教育 学院毕业设计 (论文) 第 6 页 1.4 网网页页形形式式与与内内容容相相统统一一 为了将丰富的意义和多样的形式组织成统一的页面结构，形式语言必须符 合页面的内容，体现内容的丰富含义。 灵活运用对比与调和、对称与平衡、节奏与韵律以及留白等手段，通过空 间、文字、图形之间的相互关系建立整体的均衡状态，产生和谐的美感。如对 称原则在页面设计中， 它的均衡有时会使页面显得呆板，但如果加入一些富 有动感的文字、图案，或采用夸张的手法来表现内容往往会达到比较好的效果。 点、线、面作为视觉语言中的基本元素，巧妙地互相穿插、互相衬托、互相补 充构成最佳的页面效果，充分表达完美的设计意境。 第第二二章章 新新技技术术的的使使用用 2.1 三三维维空空间间的的构构成成和和虚虚拟拟现现实实 网络上的三维空间是一个假想空间，这种空间关系需借助动静变化图像 的比例关系等空间因素表现出来。 在页面中，图片、文字位置前后叠压，或 页面位置变化所产生的视觉效果都各不相同。通过图片、文字前后叠压所构成 的空间层次不太适合网页设计，根据现有浏览器的特点，网页设计适合比较规 范、简明的页面，尽管这种叠压排列能产生强节奏的空间层次，视觉效果强烈。 网页上常见的是页面上、下、左、右、中位置所产生的空间关系，以及疏密的 位置关系所产生的空间层次，这两种位置关系使产生的空间层次富有弹性，同 时也让人产生轻松或紧迫的心理感受。 现在，人们已不满足于 html 语言编 制的二维 web 页面，三维世界的诱惑开始吸引更多的人，虚拟现实要在web 网上展示其迷人的风采，于是vrml 语言出现了。 vrml 是一种面向对象的语言， 它类似 web 超级链接所使用的 html 语言，也是一种基于文本的语言，并可以 运行在多种平台之上，只不过能够更多地为虚拟现实环境服务。 2.2 多多媒媒体体功功能能的的利利用用 网络资源的优势之一是多媒体功能。要吸引浏览者注意力，页面的内容可 北京理工大学 现代远程教育 学院毕业设计 (论文) 第 7 页 以用三维动画、 flash 等来表现。但要由于网络带宽的限制，在使用多媒体的 形式表现网页的内容时不得不考虑客户端的传输速度。 2.3 非非图图形形的的内内容容。 我们在必要时适当使用动态 “gif”图片，为减少动画容量，应用巧妙设 计的 java 动画可以用很小的容量使图形或文字产生动态的效果。但是，由于在 互联网浏览的大多是一些寻找信息的人们，我们仍然建议您要确定您的网站将 为他们提供的是有价值的内容，而不是过度的装饰。 第第三三章章 优优化化网网站站 3.1 结结构构清清晰晰并并且且便便于于使使用用。 如果人们看不懂或很难看懂您的网站，那么，他如何了解你的个人和服 务呢？使用一些醒目的标题或文字来突出您的产品与服务。并且即使您拥有最 棒的产品，如果客户从您的网站上不清楚您在介绍什么或不清楚如何受益的话， 他们是不会喜欢您的网站的。 3.2 导导向向清清晰晰 导航设计使用超文本链接或图片链接，使人们能够在您的网站上自由前进 或后退，而不会让他们使用浏览器上的前进或后退。我们在所有的图片上使用 “alt”标识符注明图片名称或解释，以便那些不愿意自动加载图片的观众能够 了解图片的含义。 3.3 快快速速的的下下载载时时间间。 很多的浏览者不会进入需要等待5 分钟下载时间才能进入的网站，在互联 网上 30 秒的等待时间与我们平常 10 分钟等待时间的感觉相同。因此，我们会 建议您尽量避免使用过多的图片及体积过大的图片。我们通常会与客户合作， 将主要页面的容量控制在 50k 以内，平均 30k 左右，确保普通浏览者页面等待 时间不超过 10 秒。 北京理工大学 现代远程教育 学院毕业设计 (论文) 第 8 页 3.4 方方便便的的反反馈馈及及订订购购程程序序 让客户明确您所能提供的产品或服务并让他们非常方便地订购是您获得成 功的重要因素。如果客户在您的网站上产生了购买产品或服务的欲望，您是否 能够让他们尽快实现吗？是在线还是离线？ 3.5 网网站站测测试试和和改改进进 测试实际上是模拟用户询问网站的过程，用以发现问题并改进设计。我们 通常与用户共同安排网站测试。 3.6 内内容容更更新新与与沟沟通通 个人 web 站点建立后，要不断更新内容。站点信息的不断更新，让浏览者 了解个人的发展动态和网上职务等，同时也会帮助 个人建立良好的好象。 在 个人的 web 站点上，要认真回复用户的电子邮件和传统的联系方式如信件电 话垂 询和传真，做到有问必答。最好将用户的用意进行分类，如售前一般了 解售后服务等，由相关部门处理，使网站访问者感受到个人的真实存在并 由此产生信任感。 注意不要许诺你实现不了的东西，在你真正有能力处理回复 之前，不要恳求用户输入信息或罗列一大堆自己不能及时答复的电话号码。 如果要求访问者自愿提供其个人信息，应公布并认真履行个人隐私保承诺。 第第四四章章 建建设设个个人人网网站站的的具具体体实实现现方方法法 4.1 确确定定网网站站主主题题 做网站，首先必须要解决的就是网站内容问题，即确定网站的主题。美国 个人电脑 杂志(pc magazine)评出了 99 年度排名前 100 位的全美知名网 站的十类题材：第 1 类：网上求职；第 2 类：网上聊天 /即时信息 /icq；第 3 类：网上社区 /讨论/邮件列表；第 4 类：计算机技术；第 5 类：网页 /网站开 发；第 6 类：娱乐网站；第 7 类：旅行；第 8 类：参考 /资讯；第 9 类：家庭 /教育；第 10 类：生活 /时尚。我们可以参看上面的分类，继续细分。如果自己 在某些方面有兴趣，或掌握的资料较多，也可以做一个自己感兴趣的东西，一 者，你可以有自己的见解，做出自己的特色；二者，在制作网站时不会觉得无 北京理工大学 现代远程教育 学院毕业设计 (论文) 第 9 页 聊或者力不从心。兴趣是制作网站的动力，没有创作热情，很难设计制作出优 秀的作品。 对于内容主题的选择，要做到小而精，主题定位要小，内容要精。不要去 试图制作一个包罗万象的站点，这往往会失去网站的特色，也会带来高强度的 劳动，给网站的及时更新带来困难。 4.2 域域名名的的选选择择 域名是网站在互联网上的名字。一个非产品推销的纯信息服务网站，其所 有建设的价值，都凝结在其网站域名之上。失去这个域名，所有前期工作就将 全部落空。 目前，做个人网站的很多都依赖免费个人空间，其域名也是依赖免费域名 指向，如网易的虚拟域名服务，其实这对个人网站的推广与发展很为不利，不 光是它“适时”开启的窗口妨碍了浏览者的视线和好感，让人一看就知道是个 人网站，而且也妨碍了网页的传输速度。所以，就我个人观点来说，首先花点 钱去注册一个域名，独立的域名就是个人网站的第一笔财富，要把域名起得形 象、简单、易记。 4.3 掌掌握握建建网网工工具具 网络技术的发展带动了软件业的发展，所以用于制作web 页面的工具软 件也越来越丰富。从最基本的html 编辑器到现在非常流行的 flash 互动网页 制作工具，各种各样的 web 页面制作工具，下面是几款具有代表性的网页制作 器： 4 4. .3 3. .1 1 h ht tm ml l 编编辑辑器器 虽然 html 代码复杂，编辑和调试要花费大量的时间，但因html 的稳定 性、广泛支持性及可创建复杂的页面效果，仍受高级网页制作人员的青睐。就 目前来说，有众多的编辑器供选择，这些编辑器广泛支持复杂页面创建及高级 html 规范，使用较为普遍的有 hotdog 等专业 html 编辑器。 4 4. .3 3. .2 2 所所见见即即所所得得的的网网页页编编辑辑器器 其中以 microsoft frontpage 为代表，它具有如 word 一样的操作界面， 熟知 word 功能的操作者，只要稍加培训就能轻松编制网页。而且， frontpage 还能解析网页的 html 源代码，并提供了预览支持。但frontpage 北京理工大学 现代远程教育 学院毕业设计 (论文) 第 10 页 的一些特殊显示功能并不能在其它非ie 浏览器下实现。所以 frontpage 是一 款非常适合初、中级网页制作人员使用的工具软件。 4 4. .3 3. .3 3 f fl la as sh h 互互动动网网页页制制作作工工具具 这是是一款功能非常强大的交互式矢量多媒体网页制作工具。能够轻松输 出各种各样的动画网页，它不需要特别繁杂的操作，也比java 小巧精悍！但 它的动画效果、互动效果、多媒体效果十分出色。而且还可以在flash 动画 中封装 mp3 音乐、填写表单等；并且由于flash 编制的网页文件比普通网页文 件要小得多，所以大大加快了浏览速度。这是一款十分适合动态web 制作的 工具。 另外，个人网站制作者还需了解w3c 的 html4.0 规范、css 层叠样式表的 基本知识、 javascript、vbscript 的基本知识。对于常用的一些脚本程序如 asp、cgi、php 也要有适当了解，还要熟练使用图形处理工具和动画制作工具 以及矢量绘图工具，并能部分了解多种图形图像动画工具的基本用法，熟练使 用 ftp 工具以及拥有相应的软硬件和网络知识也是必备的。 当然，互联网还是一个免费的资料库。编制网页需要多种多样的按钮、背 景还有各种各样图形、图片。如果这些都要靠自己完成，既浪费时间又浪费金 钱，而且还需要强大的图形、图片制作技术。所以，为了省却这些麻烦，网站 制作者完全可以从网上下载各种精美实用的图片、按钮、背景等网页素材。 4.4 确确定定网网站站界界面面 界面就是网站给浏览者的第一印象，往往决定着网站的可看性，在确定网 站的界面时要注意以下三点： 4 4. .4 4. .1 1 栏栏目目与与板板块块编编排排 构建一个网站就好比写一篇论文，首先要列出题纲，才能主题明确、层次 清晰。网站建设初学者，最容易犯的错误就是：确定题材后立刻开始制作，没 有进行合理规划。从而导致网站结构不清晰，目录庞杂混乱，板块编排混乱等。 结果不但浏览者看得糊里糊涂，制作者自己在扩充和维护网站也相当困难。所 以，我们在动手制作网页前，一定要考虑好栏目和板块的编排问题。 网站的题材确定后，就要将收集到的资料内容作一个合理的编排。比如， 北京理工大学 现代远程教育 学院毕业设计 (论文) 第 11 页 将一些最吸引人的内容放在最突出的位置或者在版面分布上占优势地位。栏目 的实质是一个网站的大纲索引，索引应该将网站的主体明确显示出来。在制定 栏目的时候，要仔细考虑，合理安排。在栏目编排时需要注意的是： 尽可能删除那些与主题无关的栏目； 尽可能将网站内最有价值的内容列在栏目上； 尽可能从访问者角度来编排栏目以方便访问者的浏览和查询；辅助 内容，如站点简介、版权信息、个人信息等大可不必放在主栏目里，以免冲淡 主题。 另外，板块的编排设置也要合理安排与划分。板块比栏目的概念要大一些， 每个板块都有自己的栏目。举个例子： enet 硅谷动力（ ） 的站点分新闻、产品、游戏、学院等板块，每个板块下面又各有自己的主栏目。 一般来说，个人站点内容较少，只要分个栏目也就够了，不需要设置板块。如 果有必要设置板块的，应该注意： 各板块要有相对独立性； 各板块要有相互关联； 各板块的内容要围绕站点主题； 4 4. .4 4. .2 2 目目录录结结构构与与链链接接结结构构 网站的目录是指建立网站时创建的目录。例如：在用frontpage 建立网 站时都默认建立了根目录和images 子目录。目录的结构是一个容易忽略的问 题，大多数站长都是未经规划，随意创建子目录。目录结构的好坏，对浏览者 来说并没有什么太大的感觉，但是对于站点本身的维护，以后内容的扩充和移 植有着重要的影响。所以建立目录结构时也要仔细安排，比如： 不要将所有文件都存放在根目录下。有网站制作者为了方便，将所有文 件都放在根目录下。这样就很容易造成：文件管理混乱，搞不清哪些文件需要 北京理工大学 现代远程教育 学院毕业设计 (论文) 第 12 页 编辑和更新，哪些无用的文件可以删除，哪些是相关联的文件，影响工作效率； 上传速度变慢，服务器一般都会为根目录建立一个文件索引，如果将所有文件 都放在根目录下，那么即使只上传更新一个文件，服务器也需要将所有文件再 检索一遍，建立新的索引文件，很明显，文件量越大，等待的时间也将越长。 按栏目内容建立子目录。子目录的建立，首先按主栏目建立。友情连接 内容较多，需要经常更新的可以建立独立的子目录。而一些相关性强，不需要 经常更新的栏目，例如：网站简介、站长情况等可以合并放在一个统一目录下。 所有程序一般都存放在特定目录，例如： cgi 程序放在 cgi-bin 目录，所有提 供下载的内容也最好放在一个目录下，便于维护管理。 在每个主目录下都建立独立的images 目录。一般来说，一个站点根目 录下都有一个默认地 images 目录。将所有图片都存放在这个目录里很是不方 便，比如在栏目删除时，图片的管理相当麻烦。所以为每个主栏目建立一个独 立的 images 目录是方便管理的。原因很简单，就是方便维护与管理。 其它需要注意的还有：目录的层次不要太深，不要超过3 层；不要使用 中文目录，使用中文目录可能对网址的正确显示造成困难；不要使用过长的目 录，太长的目录名不便于记忆；尽量使用意义明确的目录，以便于记忆和管理。 网站的链接结构是指页面之间相互链接的拓扑结构。它建立在目录结构基 础之上，但可以跨越目录。形象的说：每个页面都是一个固定点，链接则是在 两个固定点之间的连线。一个点可以和一个点连接，也可以和多个点连接。更 重要的是，这些点并不是分布在一个平面上，而是存在于一个立体的空间中。 一般的，建立网站的链接结构有两种基本方式： 树状链接结构（一对一），这类似dos 的目录结构，首页链接指向一级 页面，一级页面链接指向二级页面。这样的链接结构浏览时，一级级进入，一 级级退出，条理比较清晰，访问者明确知道自己在什么位置，不会“不知身 在何处”，但是浏览效率低，一个栏目下的子页面到另一个栏目下的子页面， 必须回到首页再进行。 北京理工大学 现代远程教育 学院毕业设计 (论文) 第 13 页 星状链接结构（一对多），类似网络服务器的链接，每个页面相互之间 都建立有链接。这样浏览比较方便，随时可以到达自己喜欢的页面。但是由于 链接太多，容易使浏览者迷路，搞不清自己在什么位置，看了多少内容。 因此，在实际的网站设计中，总是将这两种结构混合起来使用。网站希望 浏览者既可以方便快速地达到自己需要的页面，又可以清晰地知道自己的位置。 所以，最好的办法是：首页和一级页面之间用星状链接结构，一级和二级页面 之间用树状链接结构。关于链接结构的设计，在实际的网页制作中是非常重要 一环，采用什么样的链接结构直接影响到版面的布局。 4.4.3 进进行行形形象象设设计计 网站的设计可以从以下几点出发： 设计网站标志 (logo)。logo 是指网站的标志，标志可以是中文、英文字 母，也可以是符号、图案等。标志的设计创意应当来自网站的名称和内容。比 如：网站内有代表性的人物、动物、植物，可以用它们作为设计的蓝本，加以 卡通化或者艺术化；专业网站可以以本专业有代表的物品作为标志。最常用和 最简单的方式是用自己网站的英文名称作标志，采用不同的字体、字母的变形、 字母的组合可以很容易制作好自己的标志。 设计网站色彩。网站给人的第一印象来自视觉冲击，不同的色彩搭配产 生不同的效果，并可能影响到访问者的情绪。“标准色彩 ”是指能体现网站 型象和延伸内涵的色彩，要用于网站的标志，标题，主菜单和主色块。给人以 整体统一的感觉。至于其它色彩也可以使用，但应当只是作为点缀和衬托，绝 不能喧宾夺主。一般来说，一个网站的标准色彩不超过3 种，太多则让人眼 花缭乱。适合于网页标准色的颜色有：蓝色，黄/橙色，黑 /灰/白色三大系列 色。 设计网站字体。和标准色彩一样，标准字体是指用于标志，标题，主菜 单的特有字体。一般网页默认的字体是宋体。为了体现站点的“与众不同 ” 和特有风格，可以根据需要选择一些特别字体。制作者可以根据自己网站所表 达的内涵，选择更贴切的字体。需要说明的是：使用非默认字体只能用图片的 形式，因为很可能浏览者的计算机里没有安装特别字体，那么辛苦设计制作便 北京理工大学 现代远程教育 学院毕业设计 (论文) 第 14 页 可能付之东流了。 设计网站宣传语。也可以说是网站的精神、主题与中心，或者是网站的 目标，用一句话或者一个词来高度概括。用富有气势的话或词语来概括网站， 进行对外宣传，可以收到比较好的结果。 4.5 确确定定网网站站风风格格 “风格”是抽象的，是指站点的整体形象给浏览者的综合感受。这个 “整体形象 ”包括站点的 ci（标志，色彩，字体，标语）、版面布局、浏览方 式、交互性、文字、语气、内容价值等等诸多因素，网站可以是平易近人的、 生动活泼的也可以是专业严肃的。不管是色彩、技术、文字、布局，还是交互 方式，只要你能由此让浏览者明确分辨出这是你网站独有的，这就形成了网站 的“风格”。 风格是有人性的，通过网站的色彩、技术、文字、布局、交互方式可以概 括出一个站点的个性：是粗犷豪放的，还是清新秀丽的；是温文儒雅的，还是 执著热情的；是活泼易变的，还是墨守成规的。 总之，有风格的网站与普通网站的区别在于：在普通网站上你看到的只是 堆砌在一起的信息，你只能用理性的感受来描述，比如信息量多少，浏览速度 快慢等；在有风格的网站上你可以获得除内容之外的更感性的认识，比如站点 的品位，对浏览者的态度等。 在明确自己想给人以怎样的印象后，要找出网站中最有特色的东西，就是 最能体现网站风格的东西。并以它作为网站的特色加以重点强化、宣传。总之， 风格的形成不是一次定位的，你可以在实践中不断强化、调整、改进。 4.6 有有创创意意的的内内容容选选择择 好的内容选择需要有好的创意，作为网页设计制作者，最苦恼的就是没有 好的内容创意。网络上的最多的创意即是来自于虚拟同现实的结合。创意的目 的是为了更好的宣传与推广网站，如果创意很好，却对网站发展毫无意义，那 么，网站设计制作者也应当放弃这个创意。另外，主页内容是网站的根本之所 在，如果内容空洞，即使页面制作地再怎样精美，仍然不会有多少用户。从根 本上说，网站内容仍然左右着网站流量，内容为王（content is king）依然 是个人网站成功的关键。 北京理工大学 现代远程教育 学院毕业设计 (论文) 第 15 页 4.7 推推广广自自己己的的网网站站 网站的营销推广在个人网站的运行中也占着重要的地位，在推广个人网站 之前，请确保已经做好了以下内容：网站信息内容丰富、准确、及时；网站技 术具有一定专业水准，网站的交互性能良好。一般来说，网站的推广有以下几 种方式： 4 4. .7 7. .1 1 搜搜索索引引擎擎注注册册与与搜搜索索目目录录登登录录技技巧巧 注册著名的搜索引擎站点是在技术上推广网站的第一步。注册搜索引擎有 一定的技巧，像 altavista、搜索客这样的搜索引擎，它自动收录提交的网址。 另外，注意 meta 的使用，不要提交分栏 frame 页面，大部分搜索引擎不识别 frame，所以一定要提交有内容的main 页面。 而像 yahoo、搜狐等搜索目录网站采用手工方式收录网址，以保证收录网站 的质量，在分类查询时获得的信息相关性比搜索引擎站点（靠spider 自动搜 索的）更强。由于搜索目录网站收录网站的人为因素相对较多，因此在提交网 站时要注意遵守规则。如 yahoo 要求注册站点描述不超过 25 个单词。在此要 注意：将网址提交到最合适的目录下面，要认真详细的介绍网站，千万不要有 虚假、夸张的成分。 4 4. .7 7. .2 2 广广告告交交换换技技巧巧 很多个人站点在相互广告交换时都提出了几个条件：第一，访问量相当； 第二，首页交换。显而易见，这种做法是为了充分利用广告交换。以很多个人 网站的经验，当与一个个人站点交换链接时，对方把网站的logo 放到了友情 连接一页，而不是首页时，很少有访客会来自那里。通常在首页，广告交换才 会有很好的效果。 4 4. .7 7. .3 3 目目标标电电子子邮邮件件推推广广 使用电子邮件宣传网址时，主要有如下技巧：可以使用免费邮件列表来进 行，只要你申请了免费邮件列表服务，你就可以利用邮件列表来推广你的网站； 可以通过收集的特定邮件地址，来发送信息到特定的网络群体，在特定网络群 体中推广自己的网站；发送html 格式的邮件，即使其内容与接收者关系不大， 也不会被被当作垃圾信件马上删掉，人们至少会留意一下发送者的地址。不过， 北京理工大学 现代远程教育 学院毕业设计 (论文) 第 16 页 在进行邮件推广的时候要注意网络道德。 4.8 html 语语言言 4 4. .8 8. .1 1 h ht tm ml l 语语言言的的结结构构 html 文件是标准的 ascii 文件，它看起来象是加入了许多被称为链接签 (tag)的特殊字符串的普遍文本文件。 从结构上讲， html 文件由元素 (element)组成，组成 html 文件的元素有 许多种，用于组织文件的内容和指导文件的输出格式。绝大多数元素是“容 器”， 即它有起始标记和结尾标记。元素的起始标记叫做起始链接签(start tag)，元素结束标记叫做结尾链接签 (end tag) 4 4. .8 8. .2 2 构构成成网网页页的的基基本本元元素素 title 元素是文件头中唯一一个必须出现的元素，它也只能出现在文件头中。 title 元素的格式为： 文件题目 title 标明该 html 文件的题目，是对文件内容 的概括。一个好的题目应该能使读者从中判断出该文件的大概内容。文件的题 目一般不会显示在文本窗口中，而以窗口的名称显示出来。 除了标识窗口外，当将某一 homepage 存入书签或文件时， title 还用 作书签名或缺省的文件名。 title 的长度没有限制，但过长的题目会导致折行，一般情况下它的长度不 应超过 64 个字符。由于 title 的作用是标明文件内容，所以太短的title 也 是不可取的，比如： introduction 这个题目，读者不可能根据它判断出本文 介绍的是什么。一个好的例子是： 在头元素中还可以出现其他元素，如 ，等等。这些元素 都不是必须的，而且也不常用。这些元素的用法和它们的含义可以参考有关文 献。 4 4. .8 8. .3 3 超超文文本本链链接接指指针针 超文本链接指针是 html 最吸引人们优点之一。使用超文本链接指针可以使 顺序存放的文件具有一定程度上随机访问的能力，这更加符合人类的思维方式。 人的思维是跳跃的、交叉的，而每一个链接指针正好代表了作者或者读者的思 维跳跃。因而组织得好的链接指针不仅能使读者跳过他不感兴趣的章节(比如 北京理工大学 现代远程教育 学院毕业设计 (论文) 第 17 页 一些枯燥的数据 )，而且有助于更好地理解作者的意图。 1.统一资源定位器 url 统一资源定位器 (uuiform resource locator)是文件名的扩展。在单机系 统中，定位一个文件需要路径和文件名，对于遍布全球的internet 网，显然 还需要知道文件存放在哪个网络的哪台主机中才行。与单机系统不一样的是在 单机系统中，所有的文件都由统一的操作系统管理，因而不必给出访问该文件 的方法；而在 internet 上，各个网络，各台主机的操作系统都不一样，因此必 须指定访问该文件的方法。一个url 包括了以上所有的信息。它的构成为： protocol:/ :portdirectoryfilename 其中 protocol 是访问该资源所采用的协议，即访问该资源的方法，它可以 是： http 超文本传输协议，该资源是html 文件 file 文件传输协议 ,用 ftp 访问该资源 ftp 文件传输协议 ,用 ftp 访问该资源 gopher gopher 协议,该资源是 gopher 文件 news 表明该资源是网络新闻组 是存放该资源主机的 ip 地址,通常以字符形式出现 ,如 port 端口号，是服务器在该主机所使用的端口号。一般情况 下端口号不需要指定。只有当服务器所使用的端口号不是缺省的端口号时才指 定。 directory 和 filename 是该资源的路径和文件名。 一个典型的 url 为: 它表示中科院高能所 www 服 务器上的起始 html 文件。(文件具体存放的路径及文件名取决于该www 服务 器的配置情况 )。 与单机系统绝对路径，相对路径的概念类似，统一资源定位器也有绝对 url 和相对 url 之分。上文所述的是绝对 url。相对 url 是相对于你最近访问 的 url。比如你正在观看一个 url 为 /index.html 的 文件，如果想看同一个目录下的另一个文件china.html，你可以直接使用 china.html，这时 china.html 就是一个相对 url，它的绝对 url 为 北京理工大学 现代远程教育 学院毕业设计 (论文) 第 18 页 /china.html 2.指向一个目标 在 html 文件中用链接指针指向一个目标。其基本格式为： 字符串 href 属性中的统一资源定位器 (url)是被指向的目标，随后的 “字符串” 在 html 文件中充当指针的角色， 它一般显示为蓝色。当读者用鼠标点这个字 符串时，浏览器就会将 url 处的资源显示在屏幕上。例如： ihep china homepage 用户用鼠标点取 ihep china homepage，即可看到高能所编写的关于中国 情况的介绍。在这个例子中， 充当指针的是 ihep china homepage，下面我 们将看到用图象做为指针的例子。 在编写 html 文件时，需要知道目标的 url。如何才能得到目标的 url 呢？ 对于自己主机内的文件，它的url 可以根据该文件的实际情况决定。对于 interner 上的资源，我们在用浏览器观看时，它的url 会在浏览器的 location 一栏中显示出来，把它抄下来写到你的html 文件中即可。 在编写 html 文件时，对有能确定关系的一组资源 (比如在同一个目录中 ) 应采用相对 url， 这不仅简化你的 html 文件，而且便于维护。比如当你需要 将某个目录整个搬到另外一个地方或把某一主机的资源移到另一台主机时，用 相对 url 写的 html 文件用不看更新其中的 url(只要它们的相对关系没有改变 )。 但如果你用绝对 url 编写 html，你就不得不逐字修改每个链接指针中的 url，这是一件很乏味也很容易出错的工作。 对于各个资源之间没有固定的关系，比如你的html 文件是介绍各大学情 况的，它所指向的目标分布在全球的主机中，这时你就只能用绝对url 了。 在本章的末尾，作者给出一个完整的html 文件，该文件使用了前三章介 绍的全部元素，以便于读者理解。 3.标记一个目标 上节提到的链接指针可以使读者在整个interner 网上方便地链接。但如 果你编写了一个很长的 html 文件，从头到尾地读很浪费时间，能不能在同一 文件的不同部分之间也建立起链接，使用户方便地在上下方之间跳转呢？答案 北京理工大学 现代远程教育 学院毕业设计 (论文) 第 19 页 是肯定的。前面曾提到过一个超文本链接指针包括两个部分，一个指向目标的 链接指针，另一个是被指向的目标。对于一个完整的文件，我们可以用它的 url 来唯一地标识它， 但对于同一文件的不同部分，我们怎样来标识呢？下面 的内容将介绍链接指针元素的另外的一个用途，标识目标。 标识一个目标的方法为： text name 属性将放置该标记的地方标记为 “name”，name 是一个全文唯一的 标记串， text 部分可有可无。这样，我们就把放置标记的地方做了一个叫做 “name”的标记。 做好标记后，可以用下列方法来指向它， text url 是放置标记的 html 文件的 url name 是标记名，对于同一个文件，可以写 为text 这时就可以点取 text 跳转到标记名为 name 的部分了。 4.目标窗口 如果希望被指向的目标在一个新的窗口中显示，可以使用target 属性来 修饰链接指针元素。 text 将 url 代表的资源显示在一个新的窗口中，该窗口的名字叫window- name。 5.图象链接指针 图象也可以做为链接指针。格式为： 可以看出，上例中用 取代了链接指针中 text 的位置。 是图象元素，它表明显示 url 代表的图象文件，参见图 象一章。 下面是一个简单的图象链接指针。 china home page 6.图象地图 (image map) 上一节介绍的图象链接指针每幅图只能指向一个地点，而图象地图可以把 北京理工大学 现代远程教育 学院毕业设计 (论文) 第 20 页 图象分成多个区域，每个区域指向不同的地点。你可以用图象地图编出很漂亮 的 html 文件。 使用图象地图稍微复杂一点。图象地图不仅需要在html 文件中说明，它 还需要一个后缀为 .map 的文件，用来说明图象分区及其指向的url 的信息。 在.map 文件中说明分区信息的格式如下： rect url 左上角坐标，右下角坐标 poly url 各顶点坐标 circle url 直径两端点坐标 default url rect 指定一个矩形区域，该区域的位置由左上角坐标和右下角坐标说明。 poly 指定一多边形区域， 该区域的位置由各顶点坐标说明。 circle 指定一 圆形区域，该区域的位置由垂直通过圆心的直径与该圆的交点坐标说明。 default 指定图象地图其它部分的 url。 坐标的写法为： x,y ，各点坐标之间用空格分开。 图象地图需要一个特殊的处理程序 imagemap，imagemap 放在/cgi-bin 中。在 html 文件中引用图象地图的格式为： 可以看出这是一个包含图象元素的链接指针元素。图象元素指明用于图象 地图的图象的 url，并用 ismap 属性说明。需要说明的是链接指针中的href 属性，它由两部分组成，第一部分是 /cgi-bin/imagemap ，它指出用哪个程 序来处理