IE8災難來了,設計師吐血了

Untitled-1

有客戶已經開始使用IE8 (好羨慕…貴公司好有錢...電腦得先跑得動Vista才能安裝IE8的)。

網頁設計師要驚慌了,萬一客戶來幹譙說在IE8下有地方跑版了,又要改到死。

不過,最終極快速的解決方法(該站連不上只有頁庫存畫面)轉貼於此:

嗯,應該說IE8 CSS Sxcks。

不要耗費精力去跟IE8 CSS搏鬥了…,直接加入meta data讓IE8以IE7模式顯示比較實在!

將下面這行放入HTML head標籤中,意思是告訴IE8瀏覽器我要用IE7模式來顯示頁面:

<meta http-equiv=”X-UA-Compatible” content=”IE=EmulateIE7″ />

如果你有興趣跟IE8好好搏鬥,那也可以加入下面這行明確告訴IE8瀏覽器我要用IE8模式來顯示頁面:

<meta http-equiv=”X-UA-Compatible” content=”IE=8″ />

至於IE8的CSS Hack就利用米字號吧「*」,*屬性:值,IE7以下都會吃,但IE8不理。

微軟官方說法則是這樣:如何立即修正我的網站?

如果網站是自架的,設定Web.config檔案,也能達到自動讓網頁告訴客戶端瀏覽器都以IE7模式瀏覽,更是方便快速。

若這樣做好像很沒格調,死硬派(hard-core?)的設計師就是要針對各家瀏覽器寫完美的CSS hack,那就來看看這位歪果仁美女網站最新的CSS支援一覽表(90 CSS Properties, Values and Browser Support) ,然後可以瘋狂地寫到死…寫到天荒地老…

等等…好像有些弔詭的事情。

那Firefox和其他瀏覽器怎麼辦?


會有這篇文章的誕生,一來是客戶真的提出問題,二來這case是由公司的HTML/CSS新手D所負責與撰寫,所以我就擔起除錯、解決方案諮詢的責任。D採用了X-UA-Compatible作法,耶!真的在IE7和8都沒跑版了,可是Firefox卻出問題了。
其實,您應該讀一讀這篇的:Please don’t X-UA-Compatible me like that
然後再痛心地看這篇:Meta Madness
為何FF會跑版,我還沒深入研究,我會覺得是D最基本的web標準沒掌握好的關係,倒不全然是那tag害的。可是這讓我深入思考,市面上瀏覽器何其多,Firefox、Safari、Chrome…大家卻無法發揮力量去要求IE「盡量」符合W3C標準,卻反過頭接受肥大的IE8(因為要向下往IE7、IE5相容)還使用只有IE8看得懂的X-UA-Compatible。這樣下去,IE永遠只會找網頁設計師的麻煩。

安全性有問題?

IE8為了安全性問題,不再支援CSS expression(←這怪物本來就非W3C標準),但是…因為IE8出現的如此措手不及,微軟自己也提出那套「嗨,我是偽IE7」模式讓網頁設計師前仆後繼地轉告這個快速解決跨瀏覽器版本的方案,知名大站也採取了同樣作法,網路駭客就開始暗自偷笑:誰在看我的噗?第二回:IE執行模式 vs 跨網站腳本漏洞(XSS),以meta X-UA-Compatible來作為滲透方法之一。雖然有javascript的配套措施防堵漏洞,安全問題永遠擾人。
去年我為了解決png無法在IE6保持透明的問題,上網搜尋解決方案,CSS expression就是方案之一,幸好,我打死都不想用這個作法,另外找了能維持W3C標準的替代方案,不然多年後的今天,IE8蹦出來,不再支援expression,我又要回頭修正網頁?而這也延伸出另個問題:

「你們應該義務(=free)把我網站調成跨瀏覽器的啊?」

這是客戶的心聲,說出來只會讓我滴血。產生網站的當下我當然會盡量顧慮各大瀏覽器的相容,就算跑版也不能太離譜,可是計畫趕不上變化,IE7都還溫溫的,IE8就熱騰騰出爐了。有些結案的case就會回籠要求修正,免費修也是多少耗費工時,收費又好像說不過去…非‧常‧尷‧尬。因為我比較怕死又懶,向來少用CSS hack或少見的tag,所以回籠修改的地方並不多…但是那些只會操作Dreamweaver卻不懂網頁標準的設計師會落得怎樣的下場呢? 無法想像了。我只替他們心痛,因為台灣的教育環境就是教導軟體操作而已,學完就變成連html tag都不熟的網頁設計達人,真是奇蹟式的教育啊…

結論

技術上的解決方案在網路都有淺顯的說明,但這都只是表面。就像捷運內湖線和木柵接通後,相關人員很天才的把車廂換成小的,很聰明的讓兩段不相容的系統能串連,結果忽略都市成長與人口變化(《荒謬捷運大現形》),通車後反而抱怨連連。在使用這些技術時,請思考一下它對未來的影響吧!不然我們就像黑心商人,賺黑心錢,把微軟巨獸養得更巨大,永遠高高在上不屌什麼W3C標準。
0 Shares:
發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

You May Also Like

速度,是一種生活態度。

創意課程進入了第三週。 上週的發想主題是「光」,我表現的很遜…太保守,老師直接對我說,想法要再更放開一些,這裡是自由發揮的地方,不是在我那個小小的、封閉的公司裡。為了補強,改善,我檢討了自己,這一週很認真地思索主題「速度」到底是什麼。每個人至少要有三個作品(不限手法)呈現主題,我已經準備好兩個,還在苦思第三個。 就在上課前一天的週五晚上,老妹約我去永康街附近買精油保養品,順便吃吃飯。沒想到這趟旅程讓我振奮了起來,首先,販售天然保養品的小店還有脈輪精油可以當占卜般抽選,看看自己的身體狀況,和藹的店員還幫我們免費測驗自己屬於印度阿育吠陀平衡精油中哪種屬性的人,把適合的芳香精油滴到身上,我們兩隻手臂都是好香的味道,塗滿了各種保養品或精油,害我回家都不想洗澡洗掉。在店內逗留了快一小時,兩人都還沒吃晚餐,走到了一家上海點心叫做高記,享用了叉燒包、腸粉、清爽的豆腐細粉、美味的蘆筍牛肉炒糕以及非常鮮甜的蟹黃燒賣,真的好滿足、好享受。最後老妹去買好吃的芋頭冰,一起走到旁邊的公園邊吃邊休息。於是這張照片,成為我的作業之一。

前端技術之難:CSS Hack之哈克歷險記

HTML是架構,CSS是表現。於是有人誤會,CSS只是一種美化網頁的手段,沒錯,是一種手段,但美不美還是得看你的圖像處理能力,然後,徹底發揮CSS語言編排出如你Photoshop所規劃出來的完美畫面。HTML和CSS都是基本的網頁語法,不論你用哪套網頁編輯軟體(Dreamweaver, NVU, Namo Web editor…),通通都只是輔助,不管拖拉什麼現成的元件,當你檢視原始碼,通通都是一行行難以消化的編碼(code),只是它們相對於PHP/ASP/JAVA而言又異常簡單,有了輔助編輯軟體,人人都可以把玩網頁,然後,入門門檻低的網頁設計,顯得沒什麼價值。 客戶或他人就因此輕忽了網頁設計師。

用CSS解決Chrome字體最小值12px

製作網頁時,必經流程之一是隨時開啟IE、Firefox、Chrome甚至Opera和Safari檢視自己的html/css有沒有跑版。最近我遭遇到的一個問題是:明明把font-size調到75%,IE和Firefox都很乖乖的顯示小小的字,偏偏Chrome就是硬不鳥我。原來,是Chrome本身預設最小字型為12px (關於px、%與em等等的差別請見此),75%絕對比12px小,但撼動不了Chrome預設值。