
不知道有多少人看過這本 Bulletproof Web Design(無懈可擊的網頁設計)?本書主要是教大家用 XHTML 及 CSS 去設計一張無懈可擊的網頁。哪究竟甚麼是無懈可擊呢?
無懈可擊的網站是指無論網頁在何種環境下,包括被禁止顯示圖片、停用JavaScript、無樣式(即無CSS)及字體大小被改後的瀏覽器下,網頁都不會殘殘破破、阻礙讀者閱讀。一般嚴格依照網頁標準制作的網站都能輕易做到前三項。但對於最後一項,幾乎所有網站在字體放大好幾倍後或多或少都會有些走樣,或者在 IE6 下跟本無法放大字體。
一個無懈可擊的網站應該是怎麼的樣子呢?請在宜家傢私的網站上試試放大瀏覽器的字體,你可以在工具列上的 View > Text Size 中調較。我第一次看到這種效果時,曾有一種驚艷的感覺。但再看真一下,發現原來它們並沒有嚴格遵照網頁標準去制作…所以呢,在整個網路上稱得上無懈可擊的網頁設計,大概只有 Yahoo! 一家而已。Yahoo! 的首頁在 Firefox 下可以放大 3 次,相等於 Internet Explorer 6 中的1 Largest Font Size。但無懈可擊的也僅僅是首頁,Yahoo! 內頁還是老樣子。
無懈可擊很難做到嗎?談不上難,但這是一項極花時間的工作:
- 需要加入一堆無意義的 <span> Tag。雖不能說這是違反 Web Standard (Span 本來就無特別意義),但讓 HTML 變得冗長難讀卻是事實。
- 相應地令 CSS 變得冗長複雜,日後維護工作變得麻煩。
- 原本一張圖片可以搞定的事情,現在要兩、三張圖才搞定。
- 以上各項都增加了網站的大小,拖慢了下載速度。
- 會改變文字大小的用戶肯定是少數中的少數。
- Internet Explorer 7 提供 Zoom 的功能,幾乎所有網頁在 IE7 下都是無懈可擊的。
- 有其他更好的方法去改變文字大小,例如 JavaScript。
- 無懈可擊的設計需要花上比一般網頁多兩至三倍的時間,而實在有太多的事情比無懈可擊更值得花時間了。
- 其實只要做到不影響基本瀏覽就好了。
總的來說,無懈可擊的網頁設計可謂多此一舉。當一個設計理念連 Yahoo! 這樣精益求精的大公司都覺得沒有意義的時候,這個理念大概可以被所有網路公司所忽略。
(全文完。碎碎念始。)
每次遇到可讀性極差的網頁的時候,一般家儒我都會直接用 Firefox 的 No Page Style 再 Ctrl ++ 放大字體。
但遇到一些設計不良又不開全文RSS的網站,例如 Mr.6 的 Blog,仍然會讓我很煩。都用到了 CSS 去排版了,為甚麼不把正文放到 Sidebar之上呢?無論在 SEO 還是 Web Standard 的角度去看都應該這麼做啊。我們提倡依 Web Standard 做事不是因為這個技術看上去很酷很 Web 2.0…
還是把提供個全文 RSS 吧。
想不到有人和我一樣對 Mr.6 不提供全文感到煩厭,當其他 RSS 都提供全文 RSS,方便使用像 Google Reader 的人,尤其在 iphone 上的 google reader , 還要 click 一個 link 去看全文實在是反潮流的事,真的使人覺得很納悶
To 家儒:
雖然我贊同你的說法,但是…
「Internet Explorer 7 提供 Zoom 的功能,幾乎所有網頁在 IE7 下都是無懈可擊的。」
這個推論怎麼忽略了你在第二段的介紹的其他特色?這樣會讓整篇文章感覺上只要能 Zoom 就是無懈可擊耶?
re jaceju:
我的確犯了錯,無懈可擊的確不光指 Zoom。
感謝指証。 ^^
贊同。其實一個網站設計得多美觀,沒有具水準的內容也是徒然。我寧願用RSS去看有用的純文字資訊,也不看美麗浮誇的廢話。
請問一下,你所指的”把正文放到Sidebar之上”是什麼意思呢?
因為我瀏覽 Mr6 網站時,看起來感覺還滿正常的,Sidebar有乖乖待在文章右邊不是? @_@
另外不提供RSS全文的確是有點困擾沒錯。
另外有個疑問:當文章長度過長時,不用more tag的話會使得首頁內容過長,但是使用more的話,在RSS中也看不到全文了。應該選擇什麼方式比較合適呢?
Re 半路:
>>”把正文放到Sidebar之上”是什麼意思呢?
用 Firefox 的 No Style 一看你就知道是甚麼意思了 ^^
>>不用more tag的話會使得首頁內容過長,但是使用more的話,在RSS中也看不到全文了。應該選擇什麼方式比較合適呢?
請見:
http://blog.tinyau.net/archives/2006/06/13/solution-of-full-text-feed-and-more-tag-in-wordpress-21-alpha/
無懈可擊中,應不應該加上這點??「無論在Resolution800x600或1024×764的時候都能做到設計者期望的效果。」
我的Blog是以800×600設計,我經常在想有沒有辦法可以令訪客的電腦自動變成800×600來閱讀我網,哈~
CO2
CO2
這裡也是基於 800*600 設計的,但在 1280 * 800 (甚至更寬)下仍能獲得不錯的效果 ^^。
很不錯的看法,為了做出無懈可擊的網站似乎不合經濟效益比
真不錯。不過我這裏還有個更精彩的網站,希望能和大家一起分享其中的樂趣,一起去看看網頁設計
我是做網上產品銷售的,想找一個網站行銷服務,將我的網站進行SEO搜尋引擎最佳化,將網站設計,網頁設計做的更加具有市場競爭力,促使搜索引擎及更多的客戶能夠查看到我的網站。哪位朋友介紹個好點的網頁設計公司吧!謝謝啊!
不動産
我們是在做雞排加盟的加盟總部,如果你有需要可以找我唷.
有豐富的理論基礎,我在未上市股票市場大賺一筆,無往不利~~
多多交流設計方面的資訊,可以增加自己的知識唷
網路開店