我爱水煮鱼» 浏览器

苹果发布 Safari 5 浏览器

Denis — Tue, 08 Jun 2010 06:37:21 +0000

苹果发布了最新的 Safari 5 浏览器，新推出的 Safari 5 浏览器加载网页速度非常快，由于改善了 DNS 预提取速度和页面缓存速度，因此与上一代的 Safari 4 相比速度提升达 30%，即使与最新发布的 Chrome 5 浏览器相比，Safari 5 速度也高出了 3%，而与 Firefox 3.6 相比速度更是超过了两倍。除此之外 Safari 还是以下非常不错的特点：

Safari Reader

Safari Reader 是非常棒的一个功能，也是我个人最期待的功能，它能够分辨出页面中文章主要内容，通过点击地址栏的阅读按钮，就会使用一个弹出框弹出主要内容方便你阅读，并把烦人的广告和其他干扰阅读的内容移除了，这样你就能专注阅读文章的内容，并且这个弹出框里还有一个控制工具，能让你 email，打印，放大或者缩小里面的文章内容。目前不支持所有的网站，但是这样屏蔽广告不知会不会引起广告媒体的抗议。

Safari 5 浏览器

支持 HTML5

网页标准是互联网的未来，Safari 5 开支支持 HTML5，Safari 5 支持非常多的 HTML5 功能，使得开发者能够不用第三方插件就能在浏览器里面创建交互是内容和媒体体验。Safari 5 支持 HTML5 Video，不用 Flash 直接在浏览器里面播放视频，Safari 支持 GEO，可以在浏览器里面就能分享你的位置等等。

更好的性能

Safari 5 使用的 Nitro JavaScript 引擎大大提高了 Safari 5 的性能，与上一代的 Safari 4 相比速度提升达 30%，即使与最新发布的 Chrome 5 浏览器相比，Safari 5 速度也高出了 3%，而与 Firefox 3.6 相比速度更是超过了两倍。

微软 Bing 搜索

Safari 5 除了内置 Google 和 Yahoo 搜索引擎之外，还内置了微软的 Bing 搜索引擎，给用户更多选择。

Safari 开发者计划

Safari 5 支持扩展，开发者通过开发者计划可以定制 Safari 浏览器和开发各种插件。

浏览器速度越来越快，功能也越来越多，各种插件的使用，使得我们使用的桌面也越来越少，在线应用和云计算最近在影响我们。

下载：Safari 5 浏览器

>>>继续阅读全文 ...

Adobe BrowserLab：在线跨浏览器页面预览工具

Denis — Sat, 16 Jan 2010 16:14:53 +0000

Adobe BrowserLab 是 Adobe 推出一款基于 Flash 的在线跨浏览器页面预览工具。通过 Adobe BrowserLab 我们可以生成到网站或者博客在不同浏览器下的网页的快照，从而很方便测试网站的兼容性。

BrowserLab 支持 Windows XP 和 MAC OS X 上的绝大多数主流浏览器（目前支持 Windows 平台的 IE 6, 7, 8, Firefox 3.0, 3.5, Chrome 3.0。Mac 平台上的 Firefox 2.0, 3.0, 3.5, 以及 Safari 3.0, 4.0）

Adobe BrowserLab 提供了水平两栏对比和洋葱皮（onion skin）对比（可以在不同网页渲染模式下将结果重叠在一起，以便看看网页的什么地方在不同浏览器下是有区别的），下图就是我爱水煮鱼在 Mac OS X 下的 Safari 4.0 和 Windows XP 下的 IE 6 的两栏对比：

Adobe BrowserLab：在线跨浏览器页面预览工具

除此之外 Adobe BrowserLab 还提供了如下的功能：

支持标尺和标线：这样就能够很精确定位到页面在不同浏览器中的有差别的位置。
支持快捷键：方便操作。
截屏延迟：这样就可以让页面完全渲染之后再截图。
支持 Dreamwaver：Adobe 已经为 Dreamwaver 制作了 BrowserLab 扩展，这样直接在 Dreamwaver下就可以使用 BrowserLab。
保存到本地：在网页截图上点击右键就可以看到 Save Locally 的选项，点击即可保存到本地。

网页在浏览器下的兼容一直是非常困扰的问题，所以也有很多工具可以帮忙进行调试，如 IE Test 和我以前介绍的微软出品的 SuperPreview for IE，在线工具除了今天介绍的 Adobe BrowserLab，还有 BrowserShots 这个服务。从上图可以知道，我的博客在 IE6 下还是有一些问题的，虽然目前博客的访客还有 30% 左右是 IE6 的用户，但是我始终认为博客是实验各种新的 Web 技术的最好舞台，IE6 这样的落后的浏览器，很多新的 Web 技术根本没法体现，所以我只需保证能够布局不要乱了就基本可以。。

>>>继续阅读全文 ...

给博客增加 IE 8 的 Web Slice 功能

Denis — Mon, 05 Oct 2009 17:04:25 +0000

什么是 Web Slice

Web Slice 是微软牌最新浏览器 IE 8 的一个新功能，Slice 是切片的意思，Web Slice 指的是网页上某一部分内容，比如你关心我爱水煮鱼上的最新留言，或者在我爱水煮鱼留了言希望得到回复，但是又不想时刻打开网页去查看，这个时候怎么办？Web Slice 就是为了解决这样的问题而推出的功能，它能让你订阅页面上的某一部分，让你直接在 IE 8 的收藏栏获得你关心部分的更新，而不用打开页面去查看。Web Slice 并且可以让你选择多久自动刷新更新，在 IE 8 收藏栏邮件点击你的 Web Slice，选择属性就可设置更新的频率了。

我爱水煮鱼最新日志 Web Slice

如何创建 Web Slice

微软网站有对 Web Slice 的详细介绍，并且 MSDN 网站上还提供了一个开发文档详解介绍如何开发 Web Slice。你只要查看这两个部分的内容就基本可以制作的 Web Slice 了。

Web Slice 的基本机制是：

<div class="hslice" id="webslice">
    <h1 class="entry-title">Web Slice Titleh1>
    <div class="entry-content">
        web slice Content
    div>
div>

IE 8 浏览器希望你把 Web Slice 放在一个 class 属性为 “hslice” 的标签里面，然后根据这个标签的 ID 的属性来定义这个 Web Slice 的 ID，然后通过 class 属性为 “entry-title” 和 “entry-content” 的标签来定义 Web Slice 的标题和内容，所以我们只要把修改下主题，把相关的内容放到 class 属性为 “entry-content” 的标签中即可，比如把最新日志的列表放入 class 属性为 “entry-content” 的标签中，然后把相关日志的标题放到前面的 class 属性为 “entry-title” 的标签中，最后使用把它们放入一个 class 属性为 “hslice” 的标签中，定义这个 ID，就是一个最新日志的 Web Slice。

Web Slice for WordPress

给 WordPress 添加 Web Slice 功能其实非常简单的，现在已经有了现成的插件：

webslicer 这个插件可以产生最新日志，最新留言，当前日志内容等 Web Slice，甚至可以设置手工更新的 Web Slice，这个插件支持 Widget，允许你在 Sidebar 插入添加 Web Slice 到 IE 8 收藏栏的按钮，非常方便。

WordSlice这个插件就弱一些，它目前只能产生最新日志的 Web Slice，如果没有很特殊的需求，也基本够用了。

Web Slice 在我爱水煮鱼上的应用

目前我在我爱水煮鱼添加了两个 Web Slice：

一个是最新日志的 Web Slice，如果你使用 IE 8 浏览器，那么当你鼠标移过日志页面的日志内容下面最新日志列表的时候，就会注意最新日志列表周围都会出现一个绿色的矩形框，这就是 IE 8 发现 Web Slice 的提示，点击那个绿色的 Web Slice 图标即可添加我爱水煮鱼的最新日志的 Web Slice 到你 IE 8 收藏栏。

我爱水煮鱼最新日志 Web Slice

你也可以直接在 IE 8 中订阅我爱水煮鱼最新日志的 Web Slice：

另外一个是留言回复的 Web Slice，你把鼠标移到留言区的每条留言，就可以看到和上面同样的绿色的 Web Slice 图标，这样你在博客上留言需要获取回复的时候，即使博主没有安装留言回复通知 Comment Reply Notification 这样的插件，你也可以通过 Web Slice 功能获取更新。

我爱水煮鱼留言回复 Web Slice

订阅之后在 IE 收藏栏查看的效果：

我爱水煮鱼留言回复 Web Slice

>>>继续阅读全文 ...

在 Internet Explorer 中使用 Google Chrome

Denis — Thu, 24 Sep 2009 16:57:25 +0000

随着 JavaScript 性能的提升以及 HTML5 对 HTML 的加强，现在在线程序基本上可以做以前桌面软件做的事情了，不过现在所面临的问题是这些最新 Web 技术依旧不能得到 Internet Explorer 这个市场占有率最高浏览器的支持，但是开发人员又不能忽视 IE 的用户，因为绝大多数用户都在使用某个版本的 IE，所以前段程序员最大的痛苦就是要做很多额外的工作使他们的程序能够在 IE 上运行。

为了能够让 IE 用户也能顺畅跑 Web 程序，Google 开发了 Google Chrome Frame 这个开源插件，它会自动让 IE 使用 WebKit 渲染引擎来解析网页，这样 IE 浏览器就可以和 Chrome 浏览器一样拥有一个更快 JavaScript 引擎，并且支持最新的 Web 技术，如 HTML5 的离线功能，Canvas 和 audio，video 等标签，以及 CSS3 技术等。

对于开发人员来说，为了让你的网站支持这个插件，你只需要在页面的 Header 部分加入以下代码：

这插件使用使用 IE=EmulateIE7 这个标签来进行浏览器引擎转换的，原本 Microsoft 在 IE 8 使用这个标签来保证兼容一些老的，表现怪异的网站。如果用户使用安装了 Google Chrome Frame 插件的 IE 浏览器，这个插件会检测到这行，并启用 Chrome 浏览器的 WebKit 引擎来解析网页，另外 Google 也提供如下一段 JavaScript 代码来提示 IE 用户安装这个插件（效果如下图 Google Wave 提示 IE 用户安装插件）：

这个是非常好的一个插件，随着云计算的发展，在线应用的成熟，Google 已经开始让大家尽快使用 HTML5 了，即使是 IE，Google 也通过 Google Chrome Frame 这个插件来 Hack IE 实现。相信 Google 发布这款插件，也是为即将发布的实时沟通工具 Google Wave 做准备，因为 Google Wave 广泛使用了新的 Web 技术。

在 IE 中使用 Google Wave 需要安装 Google Chrome Frame

Google Chrome Frame 插件对于开发者来说也是一个福音，现在开发者在使用最新 Web 技术的时候可以更多考虑开发本身，而不是 IE hack，如果使用了很多最新 Web 技术，开发者可以通过上面介绍的 Javascript 代码来提示 IE 用户安装者款插件来使用它的在线程序。我相信这款插件发布之后，IE 用户会慢慢减少。Chrome 以及其他浏览器的用户会慢慢增加，现在就看 Web 公司是否会有魄力要求用户安装了者款插件了，。

下面是关于者款插件介绍的一个视频：

>>>继续阅读全文 ...

Microsoft SuperPreview for IE：最好的 IE 调试工具

Denis — Mon, 21 Sep 2009 17:46:14 +0000

Microsoft Expression Web SuperPreview for Internet Explorer 是微软发布的一款免费软件，它可以让我们在各个版本 IE 浏览器下调试网站，使得网站在各个版本 IE 浏览器下兼容。通过 SuperPreview For IE，我们可以迅速升级你的网站到 IE8，并且同时兼容 IE6 和 IE7。

SuperPreview For IE 可以展示网站在 IE6, 7, 8 各个版本的 IE 浏览器中渲染情况，该软件还提供尺子，平移，变焦等工具去准确区分布局上的不同。如下图就是我爱水煮鱼在 IE6 和 IE8 上面的比较情况：

SuperPreview for IE 除了显示各个版本 IE 浏览器对页面渲染不同之外，它还能展示出元素的标签，大小和位置，应用的样式，和在 DOM 树中的位置，所以我们可以通过 SuperPreview for IE 很快找出错误。

SuperPreview for IE 是微软提供的免费软件，你可以在这里下载 SuperPreview for IE，如果你想同时在 IE 和 Firefox 浏览器中调试页面，你可以下载 60 天免费试用的 Microsoft Expression Web 3。另外 SuperPreview for IE 需要 Windows 系统已经安装了 Microsoft .NET Framework 3.5 Service Pack 1 。

从上面我爱水煮鱼的截图可以看到我爱水煮鱼博客在 IE6 下还是有蛮多的 Bug，我也懒得改，我一直相信博客是实验各种新的 Web 技术的最好舞台，IE6 这样的落后的浏览器，很多新的 Web 技术根本没法体现。但是 SuperPreview for IE 对于商业网站制作和调试来说，还是有相当大的帮助的，毕竟还有蛮多用户使用 IE6，不知道 Window 7 系统发布之后，这样的局面是否有大的改观。

>>>继续阅读全文 ...

Google 浏览器 Chrome 主题

Denis — Wed, 05 Aug 2009 09:57:02 +0000

以前给 Goolge 浏览器 Chrome 换个主题是非常麻烦的事情，需要把下载的主题文件替换 Google Chrome 目录下默认的主题文件，这样就无法恢复默认的主题，除非你做了备份。

不过现在 beta 版的 Google Chrome （3.0）已经改变了状态，已经开始默认支持主题功能，就是说无需做任何额外的工作就可以很容易在浏览器内给它更换主题，并且现在浏览器选项菜单当中也有一个简单的主题管理器，它可以让用户在安装新主题之后返回默认的主题，但是目前这一功能还不完善，不能查看和选择自己安装的主题，不过相信应该在以后的版本当中会添加。

Google Chrome 主题管理器

现在 Google Chrome 还推出一个 Google Chrome Themes Gallery 站点，提供了 28 个设计很漂亮的主题，当然了前提是你使用的 Google Chrome 是 3.0 beta 版本，或者 Developer Preview 的版本。

Google Chrome 主题

所有提供的主题都是 .crx 格式，所以你可以像安装 Google 扩展一样安装它，只需点击 Apply Theme，主题就会自动被安装。并且你可以通过在地址栏输入 chrome://extensions/ 来查看现在安装的主题和卸载它们。

>>>继续阅读全文 ...

Firefox 3.5 试用

Denis — Tue, 04 Aug 2009 09:04:48 +0000

自从 Google 发布 Google 浏览器 Chrome ，我就放弃了 Firefox 而投向了 Chrome。不过最近 Mozilla 基金会发布了 Firefox 3.5 RC 版（正式版将在 6 月底推出），又一次引起了我的眼光。

Firefox 3.5 是 Mozilla 在 Firefox 3.0 版本（2008年6月）发布一年之后最重要的更新，Mozilla 称 Firefox 3.5 将具有更快的渲染引擎，Firefox 的稳定性也得到了很大的提高，并且 Firefox 3.5 采用了新的 JavaScript 引擎，这使得大部分 Web 程序性能都得以提高。并且 Firefox 3.5 也将支持 HTML 5，允许离线数据访问，增强 Web 图片解析，以及无需插件即可播放视频。

1. 如果你不小心关闭一个你并不想关闭的标签页，那么 Firefox 3.5 已经提供了 Undo 的功能，在菜单 History 下有 Recent Closed tabs 和 Recent Closed Windows 功能，让你快速恢复不小心删除的标签页。

2. 一般浏览器删除历史记录的时候只能删除全部或者一段时间的记录，但是有时候我们仅仅想删除某个站点的记录，Firefox 3.5 就提供了一个功能，在历史记录里面选择某个站点的记录，然后点击右键，选择 “Forget this site“，就可以选择删除该记录对应站点的所有历史记录，不过这不包括子域名，并且你的缓存中还会保留一些数据。

3. 现在 Firefox 也可以和 Chrome 一样，拖出一个标签成为一个新的浏览器窗口，也可以拖回去。

4. 浏览器崩溃之后，Firefox 3.5 会有恢复工具，并且让用户选择恢复那些 Tab，并且会给你提示什么原因造成了浏览器崩溃。

5. Firefox 3.5 也提供了 Private browsing 模式，让你在公共电脑上浏览网络的时候更加安全，你可以通过 Tool => start Private browsing 开始 Private browsing 模式。

6. 在 Web 上，图片都是经过浏览器优化使得能够快速显示，所以大部分颜色看起来是一样的，Firefox 3.5 引入了一种 Dynamic Color Profile 的机制，这样你在浏览看到的图片的效果和设计师和摄影师制作的时候看到的效果是一样的。

7. Firefox 3.5 使用了新的 JavaScript 引擎 TraceMonkey，据 Mozilla 层 TraceMoney 比 Firefox 3 中用的 JavaScript 引擎 SpiderMonkey 快 20-40 倍，我这里没法测试，但是在实际使用中，确实 Firefox 3.5 要快很多。

8. Firefox 3.5 最重要的更新是对 HTML5 的支持，其中最好的体现就是无需插件就能查看视频，如果你在一个 HTML5 编码的页面观看一个采用 Ogg Vorbis 或者 Theora 这些开源格式的视频，Firefox 3.5 会把它简单当做页面的一部分，而不会当做单独的 Flash 文件，这样意味着可以在视频上即时留言，也意味着视频中可以提供链接，显示你当前查看的内容的更详细介绍，是的，一个视频和文字无缝融合的网络正从我们走来。

>>>继续阅读全文 ...

为什么是 Google Chrome OS

Denis — Sun, 12 Jul 2009 11:02:07 +0000

Google 宣布它将推出用于上网本的操作系统 Google Chrome OS，那么 Google 为什么要推出操作系统呢？为什么是 Google Chrome OS？Chrome OS 会有什么问题？

云时代已经来临？

Google 推出 Google Chrome OS 操作系统预示着云计算时代已经来临。现在我们电脑上必装的软件已经越来越少了，办公软件，如果没有特别的需求，Google Docs 已经足够使用，FTP 软件我可以使用 Firefox 扩展 Fireftp ，甚至我们连图片编辑软件我们都可以在线编辑了。是的，如果你不是一个专业人员，一台便宜的上网本和快速畅通的网络就足够你进行所有的工作了。这样说明云计算时代已经逐渐来到我们的身边。

在线的应用越来越来多使用了 Javascript 技术和新的 Web 标准（如 CSS3 和 HTML5），而 IE 浏览器对标准的支持总落后于时代，在云计算时代，我们需要更好的浏览器，对 Javascript 更快的解析，对新的 Web 标准能够有更好的支持。而 Google 推出的浏览器：Chrome，使用 Webkit 内核，对 Web 标准支持良好，并且使用 Javascript V8 引擎，对 Javascript 解析速度超快，所以基于 Chrome 的操作系统能够足够并且更好满足在线应用。

在线应用的跨浏览器性

Google Chrome OS 或者说现在 Web 应用的最大问题是跨浏览器性。是的，如果为了 Google Chrome OS 而采用最新的 Web 标准制作的在线应用程序，是否能够跨平台（跨浏览器）呢？CSS 和 Javascript 问题，我们可以通过 Hack 基本解决，那么其他问题呢？比如离线存储，Google 推出的浏览器插件 Gears 已经可以支持离线存储，但是在最新版的 Firefox 和 Safari 不能工作，另外 HTML5 也提供流线存储机制，但是 IE8 对 HTML5 支持有非常少，这个问题怎么解决呢？那么以后在线应用开发人员要分别为支持最新 Web 标准的现代的浏览器和不支持 Web 标准的浏览器各自维护一套应用呢？

隐私和垄断

我们在使用搜索引擎的时候，Google 已经在跟踪我们的搜索行为，跟踪我们搜索的关键字，跟踪我们的点击的链接，访问的网站，我们在使用 Google Reader 的时候，Google 在跟踪我们在看什么文章，我们使用 Gmail 的时候，Google 在跟踪我们发送的邮件，使得，我们在使用 Google 免费服务的时候，Google 都在跟踪我们，虽然 Google 使用匿名的方式存储这些数据。那么你是否会使用 Google Chrome OS 呢，是否准备好让 Google 跟踪你所有的数据，

我们一直诟病通过 Windows 捆绑 IE 浏览器，造成 IE 的垄断地位，阻止了浏览器技术的发展，那么 Google Chrome OS 是否会只支持 Chrome，如果采用这样的捆绑行为，是否更加 evil 呢？

但是无论如何，我相信 Google chrome OS 都会是跨时代的革命性的产品，Chrome OS 的推出会对我们使用互联网进行工作和学习都会产生很大的影响。

那么你怎么看 Google 推出 Chrome OS 操作系统呢？

>>>继续阅读全文 ...

Google 浏览器：Chrome

Denis — Sat, 11 Jul 2009 19:15:18 +0000

很久之前就有传闻说 Google 会推出浏览器，但是一直没有实际的东西流出。但是 Google 总是以出人意外的方式推出新产品，让大家免费为他宣传，这次以漫画书的方式来个预告，展示了 Chrome 的细节，并且很快今天今天就推出 beta 版。当然我也很快下载使用。

Google Chrome 是 Google 最新推出的一款开源浏览器，目前只有 Windows 版本，但是很快会推出 Mac 和 Linux版本。Chrome 借鉴了苹果的 WebKit（Safari 浏览器使用的引擎）、Mozilla 的 Firefox 及其他相关应用，Google 也将开放Google Chrome的全部源代码。

Google Chrome 支持多标签浏览，每个标签页面都在独立的”沙箱”内运行，在提高安全性的同时，一个标签页面的崩溃也不会导致其他标签页面被关闭。Google Chrome 基于更强大的 JavaScript V8 引擎，这是当前 Web 浏览器所无法实现的。

Google 浏览器：Chrome

Google Chrome 给我第一印象是快，嗯，非常快。第二是非常的间接和灵巧，这可能是 JavaScript V8 引擎的关系吧！Chrome 浏览器最大限度的展现了网页的内容。地址栏和搜索集成到了同一个文本输入框，动态显示的状态栏等等这些都让 Chrome 浏览器最大限度的展现了网页的内容。

在互联网时代，用户的终端就是一个浏览器，所以占据浏览器的用户，重要性不亚于占据操作系统，所以 Google Chrome 浏览器的发布让 Google 在互联网个人数据处理方面迈出了更大的一步。

Google Chrome 下载地址：http://www.google.com/chrome/

PS：这篇文章就是在 Google Chrome 浏览器下写的，

>>>继续阅读全文 ...

使用 Google 浏览器 Chrome 的扩展

Denis — Mon, 18 May 2009 11:45:05 +0000

Google 浏览器 Chrome 是我现在主要使用的浏览器，Chrome 更新到 2.0 之后，除了支持 Greasemonkey 之外，也开始支持扩展。

要让 Google 浏览器支持扩展，你首先要把 Chrome 升级到 2.0 最新版本，然后找到 Chrome 的快捷方式，右键单击它，然后选择属性，然后在 target 输入框里面添加这个参数： –enable-extensions，重启浏览器就可以了。

启用 Google 浏览器 Extensions

现在目前 Chrome 官方已经提供了两款 Google Chrome 的扩展：

Chrome Extensions: Gmail Checker and Subscribe in Google Reader

1. Gmail Checker

这个扩展可以显示你的 Gmail 中还有多少邮件没有读取。

安装 + 下载源代码。

2. 在 Google Reader 中订阅

这个扩展能够让你非常容易和快速使用 Google Reader 订阅当前网页的 Feed。

安装 + 下载源代码

当然对于那些想自己动手写 Chrome 扩展的同学，这里有一个教程教你如何创建一个非常简单的 Chrome 扩展。

目前删除 Chrome 的扩展比较麻烦，需要手工到你的用户数据目录（user data directory ）下找到相应的扩展，然后删除它，不过 Chrome 承诺以后会更加容易删除扩展。

>>>继续阅读全文 ...