IBM站一个网页到底包含了多少技术--看分析

IBM首页源代码浅析----转
一、浏览器兼容性
作为一个国际大公司的站点,保证能在不同浏览器下的可浏览性是必须考虑的,这点IBM的做法不得不令人佩服。它巧妙的利用一个javascript(ibmcss.js)根据不同的浏览器选择不同的样式表,这也就是为什么我们直接打开保存在硬盘上的IBM页面不能看到用样式表定义的原因。
打开ibmcss.js,分析一下代码,我们就可以发现IBM一共设计了四个样式表: ie1.css , ie6.css , r1.css , ns1.css 。这四个样式表大部分都相同,主要的区别在于字体大小(font-size)的单位:ie6 里用%,r1里用px,ns1里用pt。下面是同样的一条样式在不同css里的定义:

ie6.css: body { font-family: Arial, sans-serif; font-size: 78%; }

r1.css :body,p,b,i,strong,em,dt,dd,dl,sl,caption,th,td,tr,u, blink,select, option,form,div,font,li { font-family: Arial, sans-serif; font- size: 12px; }

ns1.css: body,dt,dd,dl,sl,caption,th,td,tr,select,option,form,font { font-family: Arial, sans-serif; font-size: 9pt; }

而从对ibmcss.js里程序逻辑的分析可以得到下面样式表和浏览器的对应关系:

r1.css : Macintosh IE4.0以上,Macintosh Netscape4.0以上,Netscape5.0以上,
X11 Netscape5.0以上 (Xwindows for linux or unix,I guest )
ie6.css: Windows IE4.0以上,
ns1.css: 其他操作系统Netscape4.0以上
ie1.css: 其他操作系统IE4.0以上

我分别在Windows XP+IE6.0和Linux Rat hat 7.1+NS4.7两个环境下测试了这四个样式表,在IE6里四个样式表

都可以正常显示,只是字体大小略有区别;而在NS4.7里,用ie1.css和ns1.css定义的页面字体模糊不清,而用

r1.css和ie6.css显示的页面可以正常显示。

同时,IBM也考虑到了部分浏览器不支持javascript的情况,在ibmcss.js后紧跟了一句

1<noscript><link href="r1.css" rel="stylesheet" type="text/css"/></noscript>

,对于不支持javascript的浏览器将统一采用r1.css。不过这里有一点我不能理解的是为什么在head里面用了两句同样的

 1<noscript>语句,是为了保险起见还是设计者没有精简掉呢,希望大家能一起探讨。   
 2  
 3二、规范全面的META内容   
 4  
 5作为一个规范的页面,详尽的META内容是必不可少的,这一点IBM一直做得很好,我们可以回顾一下其99年页面里的META内容:   
 6<meta content="ibm international business machines internet" name="keywords"/>
 7<meta content="http://www.ibm.com/" name="alias"/>
 8<meta content="[email][email protected][/email]" name="owner"/>
 9<meta content="The IBM corporate home page, entry point to information about IBM products and services" name="description"/>
10<meta "1997.07.05t21:46-0500"="" ";="" "[email][email protected][="" "http:="" "rsaci="" (n="" 0="" 0))"="" america="" by="" comment="" content="(PICS-1.1 " email]";="" for="" gen="" http-equiv="PICS-Label" http:="" l="" north="" on="" r="" ratingsv01.html";="" s="" server"="" true="" v="" www.ibm.com="" www.rsac.org=""/>
11<meta ";="" "[email][email protected][="" "http:="" (ss~~000="" 1="" 1))"="" by="" content="(PICS-1.0 " email]";="" for="" gen="" http-equiv="PICS-Label" http:="" l="" r="" safesurf="" ss~~100="" true="" www.classify.org="" www.ibm.com=""/>   
12  
13今天的IBM页面META内容更是丰富,从下面的一些例子我们就可见一斑:   
14  
151、基本信息   
16<meta content="text/html; charset=utf-8" http-equiv="content-type"/>
17<meta content="no-cache" http-equiv="Pragma"/>
18<meta content="[email protected]" name="Owner"/>
19<meta content="Copyright (c) 2001 by IBM Corporation" name="Copyright"/>
20<meta content="us" name="IBM.Country"/>
21<meta content="index,follow" name="Robots"/>
22<meta content="public" name="Security"/>
23<meta content="Franklin/IPC" name="Source"/>
24<meta content='(PICS-1.1 "http://www.icra.org/ratingsv02.html" l gen true r (cz 1 lz 1 nz 1 oz 1 vz 1)   
25  
26"http://www.rsac.org/ratingsv01.html" l gen true r (n 0 s 0 v 0 l 0)   
27  
28"http://www.classify.org/safesurf/" l gen true r (SS~~000 1))' http-equiv="PICS-Label"/>   
29  
302、scheme   
31<meta content="en-us" name="DC.Language" scheme="rfc1766"/>
32<meta content="2001-08-09" name="DC.Date" scheme="iso8601"/>   
33  
343、描述与关键词   
35<meta content="The IBM corporate home page, entry point to information about IBM products and services" name="Description"/>
36<meta content="The IBM corporate home page, entry point to information about IBM products and services" name="Abstract"/>
37<meta content="ibm,international business machines,internet,e-business,ebusiness,personal   
38  
39computer,personal system,e-commerce,ecommerce,pc,workstation,mainframe,unix,technical   
40  
41support,homepage,home page" name="Keywords"/>   
42  
43内容详尽全面,完全符合一个规范页面的要求,这点我想是挺值得我们学习的。   
44  
45三、Web数据流分析   
46  
47作为一个国际大公司的站点,仅通过简单的点击计数是远远不能达到营销目的所需的详细程度,从下面的代码我们大致可以猜测出IBM站点使用了Keylime Software公司的Web数据流分析方案(在随后对Keylime Software公司网站访问中证实了这一点):   
48  
49<script language="JavaScript" type="text/javascript"><!-- Keylime Software 09/16/2001var kl_version = "1.1.0";var kl_startLoadTime = new Date();var kl_companyId = "23";var kl_siteId = "77.78.0.774";var kl_sessionCookieVisibility = "; domain=ibm.com";var kl_sessionCookiePathVisibility = "; path=/";//--></script><script language="JavaScript1.2" src="stats.js" type="text/javascript"></script>   
50  
51引用:   
52\--------------------------------------------------------------------------------   
53  
54在电子商务早期阶段时,Web 站点数据流分析通常不过是指在你的主页上安装计数器以及在一个外部日志文件上运行简单的统计程序以记录点击率。但是,业界领导们很快意识到简单的点击计数既不准确也远未达到营销目的所需的详细程度。因此,各公司开始寻找更先进的分析工具,这类工具可以提供谁在访问公司Web 站点以及访问者一旦进入站点后将做些什么的全面信息。...   
55一些ASP已经开始将基于服务的分析工具包括在他们提供的多种服务中,希望能减少一定的先期技术与财务负担。像Keylime Software公司的i</noscript>
Published At
Categories with 网页设计
Tagged with
comments powered by Disqus