容我织梦

Lifehacker又对各浏览器进行了一次对比评测，本次测试加入了新面孔FireFox 3.1，Internet Explorer 8 beta2，Chrome，Opera 9.6 beta，Safari几乎都是最新的产品。到底谁的兼容性更好，谁的执行效率更高。

　　此测试共进行三轮，其中“8页面负载”测试可能是最容易被影响的变数，一些网页的内容变化相当快，例如视频和图片内容都可能影响到加载时间，除此之外，进行的测试内容包括Sean Patrick Kane的JavaScript测试，页面载入时间，Vista任务管理器中的内存使用率等等。

　　结果显示，Opera是启动速度，读取速度均为最快的双料王，而FireFox在无扩展的前提下可以做到最省资源

　　测试1：页面载入测试，冠军Opera 9.5

　　Opera 9.6 beta版的速度和正式版一样好。其中Cold Start代表第一次启动，而Warm Start则代表第二次或多次启动后的结果。

[align=center]
冷启动浏览器速度测试[/align]

　　下一项测试则是关于多标签页加载速度，现在的浏览器普遍具有标签页功能。这代表的是在同一浏览器中打开一组页面所需时间。

[align=center]
多标签速度测试[/align]

　　测试2：JavaScript和CSS测试 赢家Safari浏览器

　　其中Safari浏览器的CSS和JavaScript性能表现很难被撼动。大多数浏览器包括都不是很擅长JavaScript，在CSS测试中，仅有Chrome能和Safari展开竞争。

[align=center]
CSS处理速度测试[/align]

[align=center]
JS速度测试[/align]

　测试3：内存使用量 赢家Firefox浏览器

　　值得宽慰的是，Mozilla基金会的Firefox 3把主要精力放在了内存节约上。无论Firefox 3 RC3还是Firefox 3.1b，内存使用量均不高。即便打开8个标签页的情况也是如此。喜欢标签页浏览方式的用户，推荐使用Firefox。

[align=center]
资源占用测试[/align]

做为一个网站开发者，这五大浏览器都是必须要熟悉的。这方面的知识还需要进一步了解，这些远远还是不够。还有更另很多朋友头疼的兼容问题，每一个浏览器都有自己的特性。所以希望在不久的将来，我们只使用一个浏览器就可以解决全部问题！

相信对搜索引擎优化感兴趣的人，都听说过Google网页级别。英文是Page Rank，缩写是PR。

所谓网页级别，是由 Google的两位创始人Larry Page 和 Sergey Brin 在斯坦福大学开发的衡量网页重要性的一个指标。简单的说，你的网页导入链接越多，你的网页级别就越高。实际上网页A链接到网页B时，Google就认为网页A投了网页B一票。网页B所得的票数越多，网页级别也就越高，也就是在Google眼里，网页B就越重要。

Google的工程师吴军在Google中文博客(他们取名叫黑板报)写了一篇关于Google PR的文章。
下面主要谈谈他们不会告诉大家的个人观察。

Google在排列搜索结果的时候，网页级别是排名算法当中很重要的一个因素。当然，随着技术的改进，网页级别的重要性在一点一点的下降。

想要提高网页级别，只有一个方法，就是获得更多的导入链接。同时要注意两点：一是链接到你的网页的网页A本身的网页级别有多高。网页A本身的网页级别越高，当然他所投的票的价值就越高，网页B所能获得的级别也才越高。

二是在网页A上一共有多少导出链接。导出链接的数目会稀释所投票的价值。也就是说如果网页A链接到你，而网页A本身网页级别很高，而且它只链接到你的网页B，那么你的网页B就会得到最高的网页级别价值。

要想查看网页级别，你可以到Google的网站上，下载Google工具栏。Google工具栏的绿色显示条，指示的就是你的网页级别。

网页级别是从0至10，0是最低级别，10是最高级别。只有最重要的几个网站达到了网页级别10，比如Google本身。

如果PR条当中完全是白色的，那么你的网页级别就是0。如果是灰色的，那么你的这个网页还没有被Google所收录，或者这个网站是被惩罚或已被删除的。一般来说，PR5应该被认为是不错的网页级别。要想达到6，7以上是很困难的。

真正Google PR的计算和更新是动态的不间断的过程。我们在工具栏看到的PR值只是”可见的PR值”，大致三个月更新一次。所以你现在看到的PR值很可能是几个月以前的数据了。真正的当前的被用来计算排名的网页级别我们是无法知道的。因此，想判断PR和排名之间的直接数量关系是没什么意义的。

网页级别是以网页为单位的，而不是整个网站，所以每一个网页本身都有它自己的网页级别。很可能你的主页是PR5，但是里面的内容页就会降为PR4，PR3，甚至PR0。

对网页级别PR一个很大的误解是网页级别的名称来源。实际上在英文当中，网页级别原译应该是佩奇级别。这个名字来源于它的创始人拉里佩奇Larry Page，是以创始人本人的名字来命名的。这一点Google内部的人已经澄清过很多次。但巧合的是，在英文中Page (佩奇)与网页是同一个词。所以在翻译成中文的时候，似乎绝大部分站长都直接翻译成网页级别。虽然意思对，但实际上不符合Google的原意。

那么网页级别在Google的搜索引擎排名当中的重要性又如何呢？应该说网页级别到目前为止还是Google排名算法的基石。当其他因素相同的时候，你的网页级别就成了一个最关键的因素。

但是我们也经常看到，PR值低的网页比PR值高很多的网页要排的更靠前。这种现象现在越来越明显，也就是说PR值在排名当中所占的比重越来越低了。或者说Google排名算法越来越复杂了。

在考虑PR值的同时，Google会考虑与链接相关的很多其他因素。比如说链接页本身的年龄，链接页内容更改的频率，链接文字前后的上下文，链接页 还连向其他哪些页等等，等等。Google所考虑的与链接有关的因素，就不下二，三十项。相应的，网页级别PR的重要性也就相对降低了。

因为PR本身是一个很硬性的数值，只要你有更多的链接，你的PR值就会增长。但是，随着作弊的人越来越多，网页级别高有时候并不能说明你的网页与关键词相关，甚至有时候并不代表你的网页有多重要。

现在越来越多的人认为PR已经不重要了。我个人觉得网页级别还是很重要的因素，某种意义上它起着门槛的作用。

Google对买卖PR深恶痛绝。并不是每个网页都能传递网页级别的，有的网页看起来PR很高，但实际上没有投票能力了。这是对买卖PR者的惩罚。

作者: Zac@SEO每天一贴
原载: 中新虚拟主机
版权所有。转载时必须以链接形式注明作者和原始出处及本声明。
注：此文顶部图片属本站站长。

自1996年以来，我曾经指出了很多网站中的设计错误，参见底部我的系列文章列表，本文将重点介绍的是，这些问题当中十个最为严重的网站设计错误。

　　1、搜索引擎不友好

　　搜索引擎对于难以处理和识别的打字稿、复数、连字号等等各种各样的问题，搜索的准确度会降低。显然，如果搜索引擎刻意去迎合这种错误使用的话，会伤害到所有的搜索使用者。

　　一个相关的问题是，搜索引擎区分结果是依靠文档的重要性，而只是按照内容关联次数简单地进行结果区分。

　　当找不到信息的时候，搜索是用户的救生索。即使有高级搜索功能，建议还是使用简单搜索，搜索形式应该是一个简单的录入框，就像我们常见的那一种。

　　2、使用PDF文件做为在线阅读

　　用户讨厌在浏览的时候跳出PDF文件，因为那会打断用户的浏览过程，因为普通的浏览器按钮无法工作，因此即使如打印或保存文档这样简单的事情也会变得复杂。由于其版面设计是基于纸张优化的，因此文字的字体很少会和用户的流量其窗口相适应。没有了平滑的滚动浏览，有的只是超小号的字体。

　　更糟糕的是，PDF文件内容是分块的，很难浏览。

　　PDF是对于印刷及发行手册等和其他需要打印的大文件来讲是很合适的，使用它的目的只是为了保留它的信息使其网页上浏览成为现实。

　　3、未改变已访问链接的颜色

　　一个好的浏览历史能够帮助你了解目前的位置，因为那是你浏览的起点。知道过去和现在的位置反过来使得决定下一步去哪里变得容易了。链接是这些浏览过程中的一个关键因素。用户可以不去访问那些没有用处的地址，相反，他们会访问那些对他们有帮助的链接地址。

　　最重要的是，他们知道哪些网页已经访问过了，这样就不必一次又一次访问同一个历史页面。

　　但是这些好处只是基于一个重要的假设：由于网站提供不同的颜色显示，用户可以分辨出哪些链接访问过，哪些链接没有访问过。如果访问一个链接后颜色没有发生变化，那么用户很可能会感到迷惑并无意中反复访问同一历史页面。

　　4、文字未排版

　　将所有文字堆积在一起是一种可怕的体验，浏览这样的文字将是痛苦的经历。

　　在线写作，并不是为了打印，需要让用户能很好地阅读，下面是几个改进的要点：

　　使用子标题

　　使用列表

　　突出关键字

　　使用小段落

　　反金字塔结构

　　简单的写作风格

　　5、固定字体大小

　　CSS样式不幸让网站有权禁止浏览器的“改变字体大小”的功能，并使得网站有一个固定的字体大小。对于大多数人的年龄超过40岁的人来说，这个固定地文字大小实在太小了。

　　尊重用户的喜好，让他们按照自己的需要修改文字的大小，同时，明确字体大小是相对的，而非绝对显示像素的数量多少。

　　6. 网页标题搜索引擎不友好

　　搜索是用户发现网站的最重要途径，搜索用户找到一个独立网站的最重要的方法。网页的标题是你吸引新用户或老用户从搜索列表中定位到你网站的主要工具。

　　网页的标题文字是在

图片作为网页的内容是非常普遍的现象。一个图片，在图片下面放置一段文字。以此作为对内容的索引。这种形式是非常常见的。[breakheart]

先看效果：

HTML代码：
1.首先是H3标题的代码
[code]

青蛙扑满的个人池塘 www.sonyes.com

[/code]
2.整个UL列表
[code]

• 青蛙扑满的个人池塘 ￥500
• 青蛙扑满的个人池塘 ￥500
• 青蛙扑满的个人池塘 ￥500
• 青蛙扑满的个人池塘 ￥500
• 青蛙扑满的个人池塘 ￥500
• 青蛙扑满的个人池塘 ￥500
• 青蛙扑满的个人池塘 ￥500
• 青蛙扑满的个人池塘 ￥500

[/code]

css代码：
1.设置BODY的样式
[code]body {
margin:0;
padding:0;
font-size:12px;
}[/code]
2.设置标题H3的样式
[code]
h3 {
width:416px;
height:28px;
margin:20px auto 0 auto;
border:1px solid #ccc;
border-bottom:none;
font-size:14px;
color:#669900;
text-indent:8px;
line-height:30px;
background:#f1f1f1;
overflow:hidden;
}
h3 a {
color:#669900;
text-decoration:none;
}
h3 a:hover {
color:#4a4a4a;
}[/code]
3.设置UL列表的样式
[code]
ul {
width:400px;
margin:0 auto;
padding:16px 0 0 16px;
border:1px solid #ccc;
border-top-style:dotted;
list-style:none;
}
ul li {
float:left;
margin:0 16px 16px 0;
}
ul li a {
display:block;
width:84px;
height:148px; cursor:pointer;
text-decoration:none;
text-align:center;
overflow:hidden;
}
ul li a img {
padding:1px;
width:80px;
height:80px;
border:1px solid #ccc;
}
ul li a strong {
display:block;
width:82px;
height:30px;
line-height:15px;
font-weight:100;
color:#333;
overflow:hidden;
}
ul li a span {
display:block;
width:82px;
height:20px;
line-height:20px;
color:#333;
}
ul li a span em {
font-style:normal;
font-weight:800;
color:#f60;
}
ul li a:hover img {
border-color:#333;
}
ul li a:hover strong {
color:#333;
}
ul li a:hover span em {
color:#f00;
}[/code]
>>猛击这里看效果< <

要想页面上所有的链接都在新窗口打开，在页面中加入：

注意事项：< base >必须写在< head >标记里

比较流行的一种效果，今天就MSN中文网的这个效果整理出来，贴上来~

XHTML以及CSS，JS代码太多，这就不贴代码了，有兴趣的朋友可以下载。。。

点击这里下载

到了WEB2.0的时代了，有人说还用表格布局已经过时了，偶尔论坛上和群里的朋友们也说到这个，其实我觉得虽然用DIV来排版了，但是表格也不是要为空而避之不及的那么可怕[illness]，比如有用到统计的列表时候，表格会简便很多~[smile]，当然了，合理运用才是上上之策，抛开书本，做好每一个例子，积累经验，我想得心应手的时日也就不远了~[Belial]，有点跑题了。先看图吧

HTML代码如下:
[code]

[/code]

样式很简单：

[code].table { border-collapse:collapse; margin:10px 0;}
.table td { border:1px solid #BABABA;}[/code]

其实还有其他办法，不过还是不要学会五种“回”字的写法了~[Belial]，知其一而精炼之，则事成矣

XHTML规范中有一条标准就是“每个XHTML标签都有一个结束标记”。那么对于HTML中原来不带结束标记的元素，则在该结束前加上“/”来关闭这个标签，如，标签原来在HTML中的写法：

到了XHTML中，就应该在“>”前增加一个“/”来关闭这个标签，为了防止某些老式浏览器不认识这种写法，因此要在“/”前加上一个空格（HTML兼容性标准）：

这似乎是说在开始标记中加上一个“/”就可以关闭掉这个标签。特别是对于空内的标签来说，似乎使用这种写法更简洁了。比如说，

这是在清除浮动（闭合浮动元素）中经常用到的一段代码。那么它似乎可以样写：