Web Authoring Tips 之二
Oct 25
Web Authoring Tips CMS website No Comments
(續上集)
筆者找到一個很方便的 Firefox Add-on,它可以協助您快速地察看 HTML 碼的問題,且對於 iFrame 或是利用 JavaScript 輸出的 HTML 碼都同樣有效。
它常駐在視窗的右下角,可以隨時提醒您正在觀看的網頁能否符合 (X)HTML 格式。 希望大家覺得有用。
Serving Commuters on the Tsuen Wan Line
Oct 25
Web Authoring Tips CMS website No Comments
(續上集)
筆者找到一個很方便的 Firefox Add-on,它可以協助您快速地察看 HTML 碼的問題,且對於 iFrame 或是利用 JavaScript 輸出的 HTML 碼都同樣有效。
它常駐在視窗的右下角,可以隨時提醒您正在觀看的網頁能否符合 (X)HTML 格式。 希望大家覺得有用。
Jun 12
Web Authoring Tips design, web, web authoring No Comments
簡介及瀏覽器大比拼
——-
很多人從小就學懂編網頁,但是「能寫出一些東西」跟「能寫出一些好東西」卻差很遠。老師們常說,在電腦裏工作(不論是文書、網頁、還是圖像設計)都是 WYSIWYG(一組很奇怪的詞語,意即 What You See Is What You Get,所見即所得)。在文書世界中,大家有一種共通的文件格式 *.doc ,在大部分的平台上都暢通無礙。如果對於文件格式有更嚴格要求,則 *.pdf 是不二之選。它能將文件分毫不差地表達出來,唯一遺憾之處就是無法容易地修改文字。
網頁編寫上的 WYSIWYG 就難達到得多了。感謝偉大的 Microsoft,寫了「偉大的」排版引擎 Trident ,讓十分多的網頁編寫者感到頭痛萬分。Trident 是 Internet Explorer 家族所使用的排版引擎,所以同樣的網頁(不計算 JS 等互動元素)在 IE5 到 IE7 內顯示出來的相當類似。看下去,IE 是挺好的瀏覽器,於網頁支援上也不錯。可是這是一個錯覺。為何 IE 能夠運行那麼多的動態網頁,但我卻在批評它呢?IE實在太神通廣大了。它被綑綁在所有 Windows 系統上,自然成為了很多人所選的瀏覽器。根據 W3 Consortium 發表的最新報告[^1],IE 家族仍然穩佔市場佔有率高達 54.8%。所以大部分的網站都是為了 IE 而設計的。但是, IE 的設計卻十分爛,又大量自創網頁標準,導致網頁顯示的結果根本不可以預計。
小弟就曾經有過這樣的經歷。話說「豈有此理」寬頻送了一個月免費的 now.com 服務給我,可以免費觀看電視劇集及新聞資訊節目。我把 Firefox 打開,然後輸入網址、登入、選擇心儀的節目,一按「播放」,做好心理準備去看電視的時候,網頁彈出了一個錯誤畫面:「本功能只支援 Internet Explorer 5.5 或以上」。喔,只支援 IE ,再嘗試用 IE 開一次。「 Internet Explorer 發生問題,必須關閉」!結果,我要到另一台電腦才能看到影片,不致把免費優惠浪費了。
正正是 IE 的自創花款(甚至連 patent 也拿了),令很多其他瀏覽器競爭對手無法還招。但是,IE 自己把版面顯示又不達標準。曾經試過寫了一整頁完全達標(符合 XHTML 1.0 Strict 、 CSS 2.1 亦通過測試)的網頁,拿到 IE6 去跑,卻是空白畫面。喔!原來 IE6 讀 UTF-8 [^2] 的檔案時,可能會發生錯誤,導致整個版面變成空白。
就算版面能夠顯示,亦未必是 WYSIWYG。一些網頁編輯器,如 Frontpage 和 Dreamweaver,它們始終是機器,在編輯網頁時往往會加入不必要或「政治不正確」(已被淘汰或把關不嚴)的標籤,這樣子在瀏覽器中顯示的結果可以大大不同。在網上,人們把這個現象稱之為 WYSINWOG (WI-SIN-WOG,What You See Is Not What Others Get)。無論是根據網頁標準而寫,還是根據自家標準而寫,都一樣帶來煩惱。
所謂網頁標準,是指由 W3 Consortium 編定的 XHTML 格式。這個格式由 HTML 上發展,刪去了不少純標格式的標籤,亦套用了 XML (eXtensible Markup Language)的表達方式(例如:單獨的標籤要使用 `/>` 來關閉,這是 HTML 中沒有的)。網頁尚有其他的標準(例如 CSS、JavaScript DOM)。要測試瀏覽器的支援程度,可以用 Acid 3 Test [^3] 來作測試。雖然 Firefox 在網頁顯示上仍未算得上是 perfect(在測試標準的 Acid 3 Test 上,只得 53 分),但已經比 IE7 的 14 分來得好很多。雖然說根據標準寫的網頁,理應在絕大部分的瀏覽器中正常顯示,但是連標準網頁也弄得如斯田地,難道 IE 還要靠這些 Windows 的忠實粉絲嗎?
做網頁設計,拿着 IE 看到運行正常就認為網頁完成了的話,大概都是很傻很天真了。如果真的有意讓全世界的人分享資訊,還是拿着 Firefox 或者 Opera 去做吧。
好,拿着一個好的瀏覽器,已利其器,下一集將要開始善其事,談到底網頁是用來幹甚麼。
[^1]: http://www.w3schools.com/browsers/browsers_stats.asp
[^2]: 文件編碼格式。以往多數中文網頁採用 BIG5 大五碼作編碼,現在很多網頁都改用了 UTF-8 來將網頁編碼。採用 UTF-8 的好處是可以顯示任何語言的文字。[維基百科 UTF-8 文章](http://zh.wikipedia.org/wiki/UTF-8 “外部連結 – 維基百科”)
[^3]: http://acid3.acidtests.org/