這可不是什麼寶島鐘錶眼鏡公司新推出的鉻合金輕質框架, 這個框架是由知名的搜尋引擎google所推出的,眾所週知的google 不只是僅有搜尋引擎,本身它也有推出一款名為 chrome 的瀏覽器.這個名字的中文翻譯就是鉻合金

Google 公司推出的 chrome 跟Mozilla 基金會推出的 firefox 及 apple 公司推出的瀏覽器 Safari
及Opera Software ASA 軟體公司的 opera 皆是支援CSS 3 HTML5 等新技術的次世代網路瀏覽器

看到這裏.有沒有發現一個知名的瀏覽器似乎不在筆者列出的次世代網路瀏覽器之列?

沒錯. 它就是舉世聞名的微軟公司推出的瀏覽器 Internet Explorer 是也. 底下的文章引述自維基百科正體中文版 全文的連結如右: http://zh.wikipedia.org/wiki/Internet_Explorer

Windows Internet Explorer(舊稱Microsoft Internet Explorer,簡稱Internet Explorer,縮寫IE),是微軟公司推出的一款網頁瀏覽器。截至2010年9月止,統計的數據顯示Internet Explorer的市場佔有率高達55.1%[1]。雖然它依然是使用最廣泛的網頁瀏覽器,但與2003年最高峰時相比,市場佔有率相差超過30%。

它是所有網頁程式開發者的夢魘, 以測試網路瀏覽器相容性的ACID 3.0 而言 連目前最新的 IE 9 也無法取得 100分 右側是 ACID 3.0 測試網頁的網址 http://acid3.acidtests.org/

很不幸的仍然有許多的使用者或是公司行號仍使用著舊版的瀏覽器. 例如 IE6 ,IE7 ,IE8 ,這些瀏覽器也就是造成網頁開發者夢魘的源頭.

更不幸的是 Internet Explorer 9瀏覽器不再支援Windows XP及其以前版本,對Windows Vista SP1和RTM版本亦不支援,這意謂著目前仍在使用 Windows XP 及 Windows Vista SP1 的使用者將無法享用 IE9. 此外最初隨 Windows XP 一起捆綁出貨(意指不管你要不要用IE它都內建在WINDOWS XP 作業系統)的 IE 它卻是惡名召彰的 IE 6.0 版

我們來回顧一下 IE 6 做了什麼好事

雖然每一個版本的IE都會改善基本支援,包括在版本6中引採用的「符合標準模式」,
其中用來建立網頁(HTML和CSS)的核心標準卻仍然是以不完全且不正確的方式來實作的。

舉例來說,它不支援 元素,但這是HTML 4.01 標準的一部份,而且它對CSS1標準中的float-margin 部份的實作有缺陷。Internet Explorer盒模型錯誤 是Internet Explorer 對CSS標準的實作中,最為人熟知的缺陷之一。

網頁標準的支援Internet Explorer使用了Trident排版引擎,幾乎完整支援HTML 4.01,CSS Level 1,XML 1.0和DOM Level 1,只是有一些排版錯誤。它亦部份支援CSS Level 2和DOM Level 2。

它內建的XML直譯器支援XHTML,但是微軟從IE 5.0以後取消了這一支援,使它變得難以存取。如其它瀏覽器一樣,當MIME型別標識為「text/html」,它能解釋為XHTML。當MIME型別標識為「application/xml」和「text/xml」時,它也能解釋把XHTML解釋為XML,但需要一個小的XSLT度量[9]來重新啟用XML對XHTML的支援。當把它定義為偏好型別如「application/xhtml+xml」時,它假裝不理解XHTML,相反把它當成一種不了解的供下載的文件型別來對待。

Internet Explorer依靠DOCTYPE判斷一個網頁應該按老版本渲染還是按W3C標準渲染(在列印中,Internet Explorer總使用W3C標準。)。根據MSXML的版本不同,它可以完全支援XSLT 1.0或1998年12月的XSL草案。Internet Explorer有一個自己的ECMAScript變體,名為JScript。

最新版的Internet Explorer(版本9),支援了部份全新的HTML5新標準以及CSS3,於The HTML5 tset當中,獲得了130/400分,不過相較於其他流行的瀏覽器而言,支援度仍屬於偏低。

要測試您現在用的 IE 對於最新的 HTML 5 的測試請列用下列的測試網址

http://www.html5test.com/

IE 8 目前在Windows XP 上能安裝的最高版本,在ACID 3 及 HTML5 測試中得的分數真是非常的難看

以下是ACID 3 測試



以下是 HTML5 測試



好囉. 數落了 IE 的罪名後. 大家大概能明白 IE 不能被敬列於次世代瀏覽器之列的原因有所了解了
而廣大還在使用 IE6 , IE7 ,IE8 以致於 IE9 的客戶怎麼辦? 對於網頁開發人員一邊被客戶要求要最新的技術.最好的畫
面呈現一邊又被要求舊瀏覽器上面即使看不到正確的畫面至少要做到不能歪斜. 這真是陷入兩難

一般的做法是先來段 CSS RESET 修正 IE 6 重大缺陷盒模型錯誤, 再使用 CSS HACK 再來修正 PNG 透明背景的問題, 再利用 JS 來迫使 IE8 認得 SVG .這對每一個網頁開發人員來說都是惡夢.

無數的網頁開發人員深陷其中不能自拔. 如果上述的做法你都還不明白或能熟悉掌握
那麼你將來要面對它時.得有心理準備



反觀 Google Chrome 及其他的次世代瀏覽器根本沒這些問題.而Google 公司推出了
Google Chrome Frame 簡稱 GCF 來解決廣大的網頁開發人員的惡夢.
它的做法是安裝這個軟體到IE 去.適用的版本是 IE 6,7,8 適用的版本 WINDOWS XP2 VISTA SP1 RTM

並如下圖勾選用並按下接受並安裝

稍待數分鐘即可完成安裝.
安裝完後對用者來說算是 "無感安裝" 因為它完全不會影嚮您的日常操作,也不會因為裝了它而導致一些 IE ONLY 的網頁無法運作
例如某些網頁本身開發之初就僅考慮到IE 是否能正常運作或正確顯示的特定網站.
因為安裝好GCF 預設上它並不工作.

除非它偵測到您現在開啟的網頁中有底下的這行指令


<meta http-equiv="X-UA-Compatible" content="chrome=1">
或偵測到您開啟的XHTML 網頁中有底下的這行指
<meta http-equiv="X-UA-Compatible" content="chrome=1"/>
它才會把現在您的IE 瀏覽器的網頁引擎換為Google Chrome 來觀看網頁這對網頁開發者的意義是什麼呢? 這表示利用Google Chrome Frame 後,您就可以放心發揮您的創意例如加上特別的創意字形並以SVG格式顯示及儲存.也可以安心使用HTML5 及 CSS3 (當然這要看Google Chrome 支援的程度而定) HTML 5 與 CSS3 能為您帶來什麼視覺上的震撼那就要勞駕您去研究一下了
不過還有一個情況就是你大概不可能一一告之用戶要安裝 GCF ,那麼用幾道指在令寫在網頁裏吧假設一個情境:一般的公司網站大概會有一個以FLASH 做的導引頁面 也幾乎會設計一個 SKIP 按鍵對吧?那麼建議您在Flash 導引動畫底下加上那麼一句話"若您的Internet Explorer 網頁瀏覽器過於老舊為了您的最佳視覺體驗強烈建議您安裝使用 Google Chrome Frame或其它次世代的網頁瀏覽器"再來的動作就是就是在 index.html
<body> 
<!--[if IE]>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/chrome-frame/1/CFInstall.min.js"></script>

<style>    
     #prompt
     {
       width: 100%;
       margin:0px auto;      
       text-align:center;
       border: 2px solid orange;
     }   
    </style>

<div id="prompt">
<p>
您的網頁瀏覽器太過老舊請安裝Google Chrome Frame 才能得到最佳的顯示效率及最美觀的效果</p>
</div>
<script>    
     window.attachEvent("onload", function() {
       CFInstall.check({
         mode: "overlay", // the default      
          destination:"http://localhost/ohmytest.html"
       });
          });   
    </script>
<![endif]-->
</body>
下來的文章是針對網頁管理者,稍後再補上這篇文章

Copyright 2010 Yita電腦調校日誌
Lunax Free Premium Blogger™ template by Introblogger