630 likes | 739 Views
网站建设思路及技术. 新疆西北星信息技术有限责任公司. 二〇一二年七月. 主要内容. 一. 网站建设入门例子. 二. 网站访问过程原理. 三. 建设网站的过程. 四. HTML 简单入门. 网站计数器代码. 五. 六. 常用搜索引擎. 政府网站建设特点. 七. 一、网站建设入门例子 — 猴子买报的故事. 从前猴子每天都读报纸,报纸上有很多文章与信息,还有一些讨厌的广告。每篇文章都是由标题与多个段落的内容组成的,而且可能还有一些图片,数据表格等。
E N D
网站建设思路及技术 新疆西北星信息技术有限责任公司 二〇一二年七月
主要内容 一 网站建设入门例子 二 网站访问过程原理 三 建设网站的过程 四 HTML简单入门 网站计数器代码 五 六 常用搜索引擎 政府网站建设特点 七
一、网站建设入门例子—猴子买报的故事 • 从前猴子每天都读报纸,报纸上有很多文章与信息,还有一些讨厌的广告。每篇文章都是由标题与多个段落的内容组成的,而且可能还有一些图片,数据表格等。 • 现在,猴子再也不买报纸了(可不是由于报纸涨价了),猴子每天都是通过新闻网站在线浏览,这种在线浏览方式与读报纸的方式是非常相似的。网上的每篇文章也都是由标题与内容组成,而且也会不时出现一些讨厌的广告!但是它们之间也有不同的地方,网络上通过链接的方式使很多篇相关的文章建立了联系,而且通常每个网页只有一篇文章,而不像报纸一样,一个页面总是多篇文章。 • 还有一点不同的地方是与用户交互的方式(比如抽奖,问答等),报纸使用了一个插页或报纸的一部分,我们填写好信息后,必须邮寄给报社。但是在网络上这个步骤将更加简单了,我们只需要在页面上输入用户名,联系方式,点击提交即可! • 网络上更加神奇的一点是:搜索!只要通过搜索就可以找到想要的内容,而且还可以找到以前的很多文章(不用再翻老报纸了),这的确比报纸好多了! • 使用网络还影响了环保(纸是由树木制作的,只要不断的读报纸我们生活的森林就会慢慢的消失,想想那没有新鲜的空气,没有了鸟语花香的生活;而且废纸总是要处理的垃圾;报纸上的油墨对猴的身体也不好)。因此猴子下定决心,再也不买报纸了,开始学做网页了。 提示: 制作一个网页有点像对报纸的排版(记住上面的几点不同,这些不同也体现了网络的优点)。我们也是建立一个标题,再建立文章的各个段落,经过美化,最后上传到网上,供用户浏览。而这里面使用的最基本的技术就是HTML。
二、网站访问过程原理 浏览器通常指 IE 、FireFox等客户端使用的程序。 每台连接互联网的机器都有一个唯一的IP地址,IP地址是由4个0到256的数组成的,比如:222.131.0.229,127.0.0.1,由于每台联网的机器的IP地址都是独立的,因此可以通过IP判断一台机器。网站所在的服务器通常有一个固定的IP地址,而我们浏览者每次上网的IP地址通常都不一样,IP地址是由ISP分配的。域名服务器(domain name server)的简称为DNS,它存储了域名与IP地址对应的列表。 浏览器得到域名指向的IP后,浏览器会把我们输入的域名转化为HTTP的服务请求,例如,输入 www.xjxbx.com,可以转化为 http://www.xjxbx.com/,通过这种方式浏览器向服务器发出了请求。由于输入的是域名,因此服务器接收到请求后,会查找域名下的默认网页(通常为index.jsp或index.html),如果直接输入http://www.xjxbx.com/index.html就直接查找这个页面。 返回的请求通常是一些文件,包括文字信息(.html .css .asp文件等),图片,flash等(每个文件都要有一个唯一的网址,比如http://www.xjxbx.com/fla/)。 浏览器将这些信息组织成用户可以查看的网页。 提示:1、查询网站的IP地址可以使用ping的方式,点击windows的开始 -- 运行 -- 输入“cmd” -- 回车 -输入 ping www.dreamdu.com 可以查看www.dreamdu.com的ip地址 2、查询自己机器的ip地址,可以使用上面的方式,输入 ipconfig 回车即可查看
三、建设网站过程 网站建设步骤: • 确定网站名称、分辨率、风格、色调 • 调研网站栏目,梳理网站栏目 • 设计网站版式、设计网站效果图 • 确定网站栏目静态页面、动态页面 • 网站页面搭建 • 网站栏目权限分配 • 数据添加、充实网站内容
三、建设网站过程 确定网站名称、分辨率、风格、色调 网站名称、域名; 分辨率,通常1000px宽度(以1024分辨率全屏显示为标准); 网站分类: 按性质分:政府网站、商业网站、专业网站、新闻网站、门户网站、个人网站; 按服务分类:信息类网站、交易类网站、互动游戏类网站、有偿信息类网站、功能性网站、综合类网站; 网站色调: 红色:强烈的色彩,常作为攻击性的、严格的、代表权力的色彩进行使用。它是充满活力的色彩,并且可以令人感到热情和力量的色彩,红色可作为主色调。 橙色:一种有食欲的色彩。橙色给人以温和、有能量、有律动的感觉,是快乐欢快的色彩,已高彩度的橙色为主色调给人即新鲜又充满活力的感觉,但是如果配色不好会像褐色那样粗俗、所以用灰色做主色调、橙色做辅色调。
三、建设网站过程 网站色调搭配 • 网页色彩搭配的原理 : • 色彩的鲜明性。网页的色彩要鲜艳,容易引人注目。 • 色彩的独特性。要有与众不同的色彩,使得大家对你的印象强烈。 • 色彩的合适性。就是说色彩和你表达的内容气氛相适合。如用粉色体现女性站点的柔性。 • 色彩的联想性。不同色彩会产生不同的联想,蓝色想到天空,黑色想到黑夜,红色想到喜事等,选择色彩要和你网页的内涵相关联。 • 色彩搭配技巧: • 用一种色彩。这里是指先选定一种色彩,然后调整透明度或者饱和度,(说得通俗些就是将色彩变淡或则加深),产生新的色彩,用于网页。这样的页面看起来色彩统一,有层次感。 • 用两种色彩。先选定一种色彩,然后选择它的对比色(在photoshop里按ctrl+shift+I)。我的主页用蓝色和黄色就是这样确定的。整个页面色彩丰富但不花稍。 • 用一个色系。简单的说就是用一个感觉的色彩,例如淡蓝,淡黄,淡绿;或者土黄,土灰,土蓝。确定色彩的方法各人不同,我是在photoshop里按前景色方框,在跳出的拾色器窗中选择“自定义”,然后在“色库”中选就可以了。 • 用黑色和一种彩色。比如大红的字体配黑色的边框感觉很“跳”。 在网页配色中,忌讳的是:不要将所有颜色都用到,尽量控制在三种色彩以内;背景和前文的对比尽量要大 (绝对不要用花纹繁复的图案作背景),以便突出主要文字内容。
三、建设网站过程 梳理网站栏目 网站栏目策划是在建站前的一道工作,做好网站栏目的构架能够很直观的看到整个网站的结构,涵盖的内容,也是对整个网站宏观的一个定位。 根据网站的定位,服务的人群,他们所关心的问题等来初步定下网站的栏目规划,通常这么做出来的初步规划是不完善的,后期还需要经过很多调整,细分等一系列工作的,但是这一步又必须得做,这可以使你的想法、定位很好的得到验证。一个网站通常都是金字塔型的,由页面、列表、栏目、频道再到首页,一层一层往上组成的。我们在做的时候则反其道而行之,根据网站的定位,划分最核心的几个频道、然后再是细分下去频道下的栏目,这里通常自己会写在表格上,每个频道的用意何在,面向的用户,分为哪些栏目,由哪些内容组成,每个频道都这样细化下去。 举例:北京市政府网站(频道举例)
三、建设网站过程 设计网站版式、效果图 • 版面的留白 • 版面留白量以40%为宜; • 背景色彩纯度过高会造成版面空白量感觉消失。 • 网站重要信息 • 重要信息的呈现方式有如下几种: • 重要信息应置于标题之后,首页链接点或内文之前; • 重要信息可以置于前端明显或突出的图像强调; • 重要信息可以运用不同颜色区块强调。 • 版式一般是在Photoshop上设计的,之后使用Photoshop或者ImageReady切图,再使用Dreamweaver排版,插入图片,完善内容,过程就是这样的。 • 一般的网站都是由网站头部,网站躯干,网站尾部组成的,其中躯干部分还可以再分,由不同的表格排版组成页面。
三、建设网站过程 设计网站版式、效果图 骨骼型 特点:类似于报刊的版式,规范理性 分割方式。竖向通栏、双栏、三栏、四栏及横向上的通栏、双栏等。一般竖向的比较常见,给人以和谐、理性的美。几种分栏方式结合使用,即理性、条理活泼又富有弹性。举例:腾讯读书网 分割型 特点:把整个网页分成上下或是左右两部分,分别安排图片或者文字。两部分形成对比:有图案的部分感性而具有活力,有文字的部分平静而严肃。通过文字或者图案把分割线进行虚化处理,会和谐而自然。 对称型 特点:给人以稳定、严谨、理性、庄重的感觉。一般采用相对对称,可以避免呆板。实例:http://www.cwnj.cn/ 自由型 特点:自由型的页面具有轻松活泼、轻快的风格。
三、建设网站过程 静态页面、动态页面 静态页面: 纯粹的HTML格式网页通常被称为“静态页面”,早期的网站一般都是静态网页组成的。特点:网页不论何时浏览,都将显示相同的形式和内容,且仅能供浏览,无法与网站互动。 动态页面: 指网页的内容可以根据某种条件的改变而自动改变。如腾讯公司的Qzone空间里,常常会有一些使用者嵌入一个小小的计数器功能,当有人单击设计者的网页时,计数器的值会自动增加。动态网页是以.asp、.jsp、.php、.cgi等形式为后缀,并且在动态网页网址中有一个标志性的符号“?”。一个典型的动态网页的URL(Uniform Rsource Locator,即统一资源定位器)形式为:http://www.sina.cn/ip/index.asp?id=1
三、建设网站过程 静态页面与动态页面的区别 静态网页是由浏览器直接从服务器下载到浏览者所在机器上浏览的。 动态网页需要服务器执行(运算)成静态网页的内容,然后由浏览器下载到浏览者所在机器上浏览。 静态网页是任何网站的根基,因为浏览者浏览的内容永远是从服务器传回的静态网页的内容。 动态与静态网页并不矛盾,网站设计中往往是先使用DreamWeaver等工具设计静态网页,之后将PHP等程序嵌入静态网页中完成网站设计。 动态网页中一般会包含静态网页的内容,比如:PHP代码中通常包含HTML或CSS。静态网页中不能包含动态网页的内容。比如:如果HTML中包含PHP的内容,那就是动态网页了。 动态网页通常与数据库相连,来完成页面的显示。比如:一个文章显示系统,可以只通过一个动态网页Display.php显示数据库中的多篇文章。而静态网页无法实现此功能。
三、建设网站过程 静态页面与动态页面的区别 采用动态网页可以实现很多动态功能,比如Blog登录,BBS讨论,购物车等。 由于动态网页需要服务器执行(运算),因此将消耗服务器资源,访问速度会慢于静态网页。 当网站有大数据量时,应该使用动态网页管理,减少网站维护工作量。 当网站服务器压力过大或者访问量太大时,应该使用静态页面显示。 当网站有大的数据量而且访问量很大时,应该使用动态页面管理维护网站内容,同时生成静态页面用于显示。 动态网页的网址显示方式通常带有"?",比如http://www.sina.cn/ip/index.asp?id=1 动态网页是需要服务器端执行的程序,由于人的原因可能使动态网页程序产生漏洞,这些漏洞可能会被黑客利用。比如我们常说的"挂马"。
三、建设网站过程 页面搭建 工具: 网站后台管理系统(如:西北星资源管理平台、青峰网站管理后台管理系统等。) 网站后台管理系统主要是用于对网站前台的信息管理,如文字、图片、影音、和其他日常使用文件的发布、更新、删除等操作,同时也包括会员信息、订单信息、访客信息的统计和管理。简单来说就是对网站数据库和文件的快速操作,以使得前台内容能够得到及时更新和调整。 Dreamweaver、Photoshop、Flash等网页编辑、图片制作工具。
三、建设网站过程 网站栏目权限分配 网站管理员分配栏目权限(栏目权限:是指网站前台的栏目的管理,网站栏目包括了比如公司简介、产品介绍、新闻等栏目,可以在后台通过选择相应栏目授权,用户在添加内容的时候只能选择被授权栏目,没有被授权的内容无法管理。) 举例:西北星资源管理平台
三、建设网站过程 数据添加,充实网站 通过网站后台管理系统维护网站数据。对网站各栏目数据进行添加、修改、删除。同时设置数据的相关属性(标题、子标题、加载日期、失效日期、附件、发布栏目等。)
四、HTML简单入门 HTML(Hyper Text Markup Language超文本标示语言) —是一种用来制作超文本文档的简单标记语言。 —用HTML编写的超文本文件称为HTML文件,也称Web文件。 编写方法: 手工直接编写—记事本,存成.htm .html格式。 使用可视化HTML编辑器—Frontpage、Dreamweaver等。 由Web服务器(或称HTTP服务器)一方实时动态地生成。 网页文件命名: *.htm或*.html、无空格、无特殊符号(如&符号),只可以有下划线“—”,只可以为英文、数字。 区分大小写、首页文件名默认为:index.htm或index.html。
四、HTML简单入门 HTML文件结构 <html>…</html> <head>…</head> <body>…</body> 元素:是HTML语言的基本部分。元素总是成对出现,每一对元素一般都有一个开始的标记(如<body>),也有一个结束的标记(如</body>)。元素的标记要用一对尖括号括起来,并且结束的标记总是在开始的标记前加一个斜杠。
四、HTML简单入门 简单学习HTML代码:文字布局、文字与段落格式控制、表格标签、超链接标签、表单的定义 文字布局: 行的控制—段<p>:自动在其前后创建一些空白;空白占位符 ; HTML的<br>标签是一个简单的换行符。<br>标签可以使所在的位置出现换行。这种换行和浏览器的自动换行的效果类似。<br>标签不是成对出现的。<br>标签这是简单地开始新的一行,而当浏览器遇到<p>标签时,通常会在相领的段落之间插入一些垂直的间距。 不换行<nobr>禁止换行。通常在浏览器上显示的文档会在到达浏览器的横幅底端时自动换行,但是如果文字被包含在<nobr>…</nobr>标签里的话,则不会换行。
四、HTML简单入门 文字与段落格式控制 <body>…… <i>倾斜文本</i>:显示斜体文本效果 <b>粗体文本</b>:显示粗体文本效果 <u>下划线文本</u>:为文本添加下划线 ……</body> 居中—<center>标签 ——<center>元素师一个独立的使所标记的字符居中的元素。它的作用与使用<p>元素里的align=“center”类似,对其所包括的文本进行水平居中。 例如:<center>居中段落</center> 标尺线(水平线)<hr>在HTML页面中创建一条水平线 <hr size=#>:设定线宽 <hr width=#>:设定线长 <hr align=#>:设定对齐方式 #=left,right <hr color=#>:设定线的颜色
四、HTML简单入门 表格标签: <table></table>创建表格 <tr></tr>创建表格中的一行,一般包括一个或多个列元素 <td></td>创建表格中的一列 <caption></caption>标签,定义表格的标题 <th></th>可以是表格中的第一个<td>标签,作为表格内的标题行 <table>标签的属性
四、HTML简单入门 <tr>标签的属性 <td>标签的属性
四、HTML简单入门 • 利用表格进行网页布局: • 表格标签除了绘制文本表格外,还经常用来进行网页布局。 • 表格是最常用的页面元素,可以用来固定文本或图像的显示位置。 • 通常我们使用<table>、<tr>、<td>标记及其属性对网页内容进行分块显示。 • 在Internet上浏览的许多页面都大量使用了表格,很多较复杂的页面布局就是利用表格来完成的。
四、HTML简单入门 • 超链接标签: • 根据目标页面的位置不同,href属性的URL信息构成分为以下3种情况: • 目标页面位于另外的主机或采用非http协议,此时URL采用绝对路径,即使用如下格式: • 协议名://主机名[/目录信息] • 若目标页面位于本主机,此时URL采用相对路径: <a href="des1.htm">超链接文本</a> 或<a href="/des2.htm">超链接文本</a> • 超链接的目标不仅可以指向HTML文件的头部,也可以指向某个文件的特定位置(称为“锚点”,anchor),其格式如下: <a name="定位标记">文本或图像等页面元素</a>
四、HTML简单入门 什么是表单? 表单是实现图形用户界面的基本元素,它包括按钮、文本框、单选框、复选框等,它们是HTML实现交互功能的主要接口。用户通过表单向服务器提交数据。表单的使用包括两个部分:一部分是用户界面,提供用户输入数据的元件;另一部分是处理程序,可以是客户端程序,在浏览器中执行;也可以是服务器处理程序,处理用户提交的数据,返回处理的结果。 表单的定义: • 定义表单的语法如下: <form method="get|post" action="处理程序名"> [<input type=输入域种类 name=输入域名>] [textarea定义] [select定义] </form> • <form></form>标签对用来创建一个表单,即定义表单的开始和结束位置,具有action、method、target、title、enctype等属性。
四、HTML简单入门 表单的输入域: 常用表单的输入域: 不同类型的输入域为用户提供灵活多样的数据输入方式。表单的输入域有如下3大类: • 以标记<input>定义的多种输入域,包括text,radio,checkbox,password,hidden,button,submit和reset等。 • 以标记<textarea>定义的文本域。 • 以标记<select>和<option>定义的下拉列表框。
四、HTML简单入门 <input>表单输入标记: • <input>标记在表单中使用频繁,大部分表单内容需要用到此标记。其语法如下:<inputname=name value=value aligh=left|center|righ valign=top|middle|bottom type=text|password|checkbox|radio|submit|reset|hidden|button maxlength=n size=n checkedonclick=function onselect=function> 其中value:用于设定表单默认值; checked:表示选择框中,此项被默认选中;maxlength:表示在输入单行文本的时候,最大允许字符数; size:用于设定表单框的尺寸; onclick:表示在按下按钮时调用指定的子程序; onselect:表示当前项被选择时调用指定的子程序。
四、HTML简单入门 <select>标签: • 用<select>标记可以在表单中插入一个下拉菜单,其语法如下:<selectname=name size=n multiple> <option value=设定值 [selected]>表项内容 </option> <option value=设定值 [selected]>表项内容 </option> …… </select> 其中name:设定下拉菜单的名称;size:设定菜单框的高度,也就是一次显示几个菜单项;multiple:是可选项,若定义该属性,则下拉列表中的内容允许进行多选。
四、HTML简单入门 <textarea>标签: • <textarea></textarea> • 在<form>表单中创建一个能够输入多行文本的文本框 • 属性:cols(列数),rows(行数),单位是字符数 • 标签语法如下: 此处显示在文本框外的提示信息 <textarea name=name cols=x rows=y> 此处显示在文本框里的预留信息 </textarea>
四、HTML简单入门 举例:一段简单的包含多行文本框的页面代码 <body> <table width="50%" border="0" cellspacing="0" cellpadding="0"> <tr> <td align="center">您的意见对我很重要:</td> </tr> <tr> <td align="center"> <textarea name="yijian" cols="60" rows="10"> 请将您的建议输入到此区域</textarea></td> </tr> <tr> <td align="center"> <input type="submit" name="ok" value="提交"> <input type="reset" name="reset" value="重置"></td> </tr> </body>
五、网站计数器代码 对一个网站的站长而言,站上网页的累计浏览次数,是一项很有用的信息。通过浏览次数的统计,就可以看出用户的偏好,提供网站改进发展的方向。本小节将介绍一个简单的网页浏览次数统计范例。 本范例所使用的文件如下: frameset.htm:框架页主文件,本范例使用的是一个一行两列的框架页。 pagecount.asp:累计浏览次数 menu.htm:左框架选取 mainFrame.htm主框架 main.asp、page1.asp、page2asp、page3.asp、page4.asp、page5.asp:这些文件用来当作测试网页,其目录放在左框架menu.htm中,结果显示在主框架mainFrame.htm中。 allcount.asp:显示所有网页的浏览次数
五、网站计数器代码 下面列出各程序源代码: frameset.htm:框架集主文件: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>框架页主文件</title> </head> <frameset rows="*" cols="154,*" framespacing="1" border="2" bordercolor="#000000"> <frame src="menu.htm" name="leftFrame" scrolling="NO" noresize> <frame src="mainFrame.htm" name="mainFrame"> </frameset> <noframes><body> </body></noframes> </html>
五、网站计数器代码 • 程序pagecount.asp清单: <!--pagecount.asp--> <% set pcnt=Server.CreateObject("MSWC.PageCounter") pcnt.PageHit %> 说明: • 我们使用ASP的默认组件PageCounter来做网页计数。这个组件没有属性,有三个方法: * Hits([passInfo]) PassInfo为网页的虚拟路径,这个方法返回网页被浏览的次数。若PassInfo省略的话,则返回目前网页被浏览的次数。
五、网站计数器代码 说明: * PageHit 将目前网页的浏览次数增加一次。PageCounter组件并不会自动累加,我们必须使用PageHit方法手动累加。 * Reset([PassInfo]) PassInfo代表网页的虚拟路径,这个方法将网页的浏览次数设为0。若未指定 PassInfor,则将目前网页的浏览次数设为0。 pagecount.asp这个文件就是把PageCounter组件取出,并将目前网页的浏览次数加1。这个文件必须被包括在每个网页的开头,如下面的main.asp、page1.asp、page2asp、page3.asp、page4.asp、page5.asp等文件代码所示。
五、网站计数器代码 • main.asp文件代码如下: <!--main.asp--> <!--#include file="pagecount.asp"--> <center> <h2>这是首页</h2> <hr> 本页累计浏览次数:<% =pcnt.Hits()%> </center> 说明: 这个网页一开头就使用 <!--#include file="pagecount.asp“> 将pagecount.asp包括进来。如此一来当用户浏览这个网页时,浏览次数就会自动累加。
五、网站计数器代码 • page1.asp文件代码如下: <!-- page1.asp--> <!--#include file="pagecount.asp"--> <center> <h2>这是测试网页一</h2> <hr> 本页累计浏览次数:<% =pcnt.Hits()%> </center> • page2asp文件代码如下: <!--page2.asp--> <!--#include file="pagecount.asp"--> <center> <h2>这是测试网页二</h2> <hr> 本页累计浏览次数:<% =pcnt.Hits()%> </center>
五、网站计数器代码 • page3.asp文件代码如下: <!--page3.asp--> <!--#include file="pagecount.asp"--> <center> <h2>这是测试网页三</h2> <hr> 本页累计浏览次数:<% =pcnt.Hits()%> </center> • page4.asp文件代码如下: <!--page4.asp--> <!--#include file="pagecount.asp"--> <center> <h2>这是测试网页四</h2> <hr> 本页累计浏览次数:<% =pcnt.Hits()%> </center>
五、网站计数器代码 • page5.asp文件代码如下: <!--page5.asp--> <!--#include file="pagecount.asp"--> <center> <h2>这是测试网页五</h2> <hr> 本页累计浏览次数:<% =pcnt.Hits()%> </center> • allcount.asp文件代码如下: <!--allcount.asp--> <!--#include file="pagecount.asp"--> <h2 align=center>本网站各网页浏览次数统计</h2> <hr size="2" noshade> <center> <table border="1" cellpadding="1" cellspacing="0" bordercolor="#666666">
五、网站计数器代码 <tr> <td align=center>网页</td> <td align=center>浏览次数</td> </tr> <tr> <td><div align="center">首页</div></td> <td align=center><%=pcnt.Hits("/chapter6-03/pages/main.asp")%></td> </tr> <tr> <td><div align="center">测试网页一</div></td> <td align=center><%=pcnt.Hits("/chapter6-03/pages/page1.asp")%></td> </tr> <tr> <td><div align="center">测试网页二</div></td> <td align=center><%=pcnt.Hits("/chapter6-03/pages/page2.asp")%></td> </tr> • allcount.asp文件代码(续)如下:
五、网站计数器代码 <tr> <td><div align="center">测试网页三</div> <td align=center><%=pcnt.Hits("/chapter6-03/pages/page3.asp")%></td> </tr> <tr> <td><div align="center">测试网页四</div> <td align=center><%=pcnt.Hits("/chapter6-03/pages/page4.asp")%></td> </tr> <tr> <td><div align="center">测试网页五</div> <td align=center><%=pcnt.Hits("/chapter6-03/pages/page5.asp")%></td> </tr> <tr> <td><div align="center">本页</div></td> <td align=center><%=pcnt.Hits()%></td> </tr> </table></center> • allcount.asp文件代码(续)如下:
五、网站计数器代码 • 说明: • 这个网页也列入统计,所以一开始也要包括pagecount.asp文件。 • 使用PageCounter组件的Hits方法,取得各网页的浏览次数并显示出。需要注意的是:Hits方法的参数是网页的虚拟路径。 • menu.htm:左框架 • <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" • "http://www.w3.org/TR/html4/loose.dtd"> • <html> • <head> • <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> • <title>左框架</title> • </head>
五、网站计数器代码 menu.htm:左框架(续) <body> <div align=“center”><a href=“main.asp” target=“mainFrame”>首页 </a><br><br> <a href="page1.asp" target="mainFrame">测试网页一</a><br><br> <a href="page2.asp" target="mainFrame">测试网页二</a><br><br> <a href="page3.asp" target="mainFrame">测试网页三</a><br><br> <a href="page4.asp" target="mainFrame">测试网页四</a><br><br> <a href="page5.asp" target="mainFrame">测试网页五</a><br><br> <a href="allcount.asp" target="mainFrame">本站浏览次数统计</a> </div> </body> </html>
五、网站计数器代码 mainFrame.htm主框架 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>主框架</title> </head> <body> <img src="../images/zhishi.jpg" width="100" height="150" align=“absbottom”>单击左侧框架中目录,便可在本主框架查看不同网 页的浏览次数! </body> </html>
五、网站计数器代码 • 以上我们已将本范例所有文件的源代码写出,现在看一下其执行结果。首先,在IE浏览器中浏览框架页主文件frameset.htm,如下图所示。
五、网站计数器代码 • 单击“首页”测试页,显示“首页”的累计浏览次数,如下图所示。单击“刷新”按钮或左框架中的“首页”,主框架中显示的该页累计浏览次数会增加。
五、网站计数器代码 • 单击其它测试页,会显示相应页的累计浏览次数,如单击“测试网页三”,显示效果如下图所示。
六、站内搜索代码 • 搜索引擎(search engine)是指根据一定的策略、运行特定的计算机程序搜集互联网上的信息,在对信息进行组织和处理后,并将处理后的信息显示给用户,是为用户提供检索服务的系统。 • 分类:全文索引、目录索引、元搜索引擎 • 工作原理:
六、站内搜索代码 Google搜索引擎 <!--Google站内搜索开始--><form method=get action="http://www.google.com/search"><input type=text name=q><input type=submit name=btnG value="Google 搜索"><input type=hidden name=ie value=GB2312><input type=hidden name=oe value=GB2312><input type=hidden name=hl value=zh-CN><input type=hidden name=domains value="www.williamlong.info"><input type=hidden name=sitesearch value="www.williamlong.info"></form><!--Google站内搜索结束-->
六、站内搜索代码 Baidu搜索引擎 <!--Baidu站内搜索开始--><form action="http://www.baidu.com/baidu"><input type=text name=word><input type="submit" value="Baidu 搜索"><input name=tn type=hidden value="bds"><input name=cl type=hidden value="3"><input name=ct type=hidden value="2097152"><input name=si type=hidden value="www.williamlong.info"></form><!--Baidu站内搜索结束-->