雜談網頁親和力（七）語意與尺寸的親和力兩難

截至目前為止，我們已經連續討論了六期親和力相關議題，並且實際說明了許多用來增進親和力的網頁標記。現在，該是讓我們來面對另一個兩難的時候了。

循序思考過親和力的讀者，不難發現親和力的重點之一，在於表達網頁內容的語意；因此我們採用了恰當的方式，運用各種符合網頁標準的標記，來加強網頁內容的意涵──藉由這樣的做法，就算使用者代理程式（例如瀏覽器）只能剖析部分的網頁內容，還是能拼湊出完整的語意。

這其實跟磁碟陣列 (RAID) 的哲學是相同的：放置冗贅 (redundant) 的內容，犧牲空間來換取強猛 (robust) 的資訊傳播。磁碟陣列的做法是把同樣的數位內容放置在多個磁碟空間，而網頁親和力則是把同樣的意義表達成多種型態；同一份媒體內容，可能還會有同步、對應的字幕、聲音描述、其他語言的配音、替代文字、描述網頁等。

但是這種做法所要付出的代價就是，同樣的「意義」將佔據更多的空間─在網際網路的世界中，不僅是儲存的成本提高了，下載所需的成本也提高了。傳輸內容會耗用更多的頻寬，使用者下載頁面也得花上更多時間。

等一下，當我們思考網頁親和力時，其中一個常被提倡的優勢，不就是讓網頁能更快被下載嗎？有的讀者此時可能會問，為什麼現在又要說，增進網頁親和力的同時，會讓網頁變得更肥大呢？這樣豈不是自相矛盾了？

事實上親和力在追求的，並不是一味地減少網頁尺寸，而是要把資源花在刀口上；同時，如果還能夠把成本降低，那再去做。舉例來說，如果某個網頁中，不具語意的標記如 ＜span style="text-decoration: line-through;"＞＜/span＞、＜span＞＜/span＞ 等佔據了 20%，那麼單純把這些不具語意的標記清掉，可以把網頁尺寸降為原來的 80%。另一方面，如果把這些內容以具語意的標記重新處理過，也許會使得整體的尺寸變成原來的 120%，看起來好像反而增加了 20%，可是由於語意的冗贅，使得網頁只要下載完 40% 就能夠表達充分的意義─因此使用者實際上只要下載原網頁尺寸的 48% (120%×40%=48%) 就夠了，這比從 100% 降到 80%的降幅還要大。

親和力並不是要剝奪使用者的使用經驗，反而是要讓使用經驗更為紮實且豐富；這一點也是許多誤解親和力的人所不明白的。許多製作網頁的人，常常會以為「只要另外製作一個純文字版的網頁，就可以符合網頁無障礙的規範了」；但是從前面的說明中，我們可以明白，像這種做法僅是把網頁檔案尺寸從 100% 降到 80%─然後再繼續把網頁的語意一併刪減，讓網頁的尺寸降到 40%，結果網頁尺寸的確變小了，可是網頁的意涵也只剩下 50%，親和力則剩下不到 10%。

那樣子單純只是想減少網頁尺寸、只提供平坦而無深度的內容的做法，實在是邪門歪道，帶來的只有更多的歧視與偏見；因為那種網頁設計在向使用者說：「我（網頁設計者）不管你的情況如何，也不管你還有哪些優勢，對我（網頁設計者）來說你們就是低等公民，我（網頁設計者）就是要無差別地剝奪你的使用經驗與樂趣。」

要讓網頁更有親和力，就應該要讓使用者能運用他們各自所擁有的任何優勢與能力，盡可能地傳達網頁意義，並讓使用者能享受到最多的使用經驗。

具備親和力的設計，之所以能辦到這件事，是因為設計師能夠以「意義」為核心，然後就跟洋蔥一樣，一層一層地把額外的意義附加到核心外。這種分明的層次，讓網頁的不同部分─結構、樣式、功能、協定等─各自獨立，而且都能重視「意義」，因此接下來就可以針對網頁的不同部分，運用各式各樣的技術來改善。

舉例來說，雖然用 CSS 來處理樣式，乍看之下會比直接在 HTML 內使用視覺性的標記要來得麻煩，但是我們可以用一條 CSS 規則來處理所有共同的樣式，讓不同的網頁部件能在語意上相連，並讓實際的檔案總尺寸減少；同時，我們可以針對不同的使用者代理媒體類型，分別提供不同的 CSS，讓使用者實際需要下載的 CSS 檔案尺寸也變小。這麼一來，我們在大幅增加靈活性與適用性的同時，仍能將下載網頁所要耗費的 HTTP 請求數量控制在一定的範圍內。

同樣地，藉由調整網頁的結構部分，雖然使用者要完整地看到網頁的每個細節，仍然要花同樣的時間，但是在網頁還沒整個載入前，使用者就能夠獲得整個頁面中最重要的資訊；甚至那些比較岔題、較旁枝末節的部分，也能夠在此分離到另一個單獨的網頁去，等使用者有需求時再載入。藉由重視親和力的設計，就能夠分別針對這些不同部分逐一處理，而不用擔心他們會互相牽制。

不只是網頁的檔案尺寸而已，為了達成具有親和力的網頁設計，所要投入的人力及資源成本、所該規劃的組織規模等，也都會增加。但是這種投資，都可以減少不必要的浪費，並且獲得更多的優勢。

下一期，就讓我們來探討，該如何來投入這樣的人力成本吧。

You may be interested in the following articles:

• 雜談網頁親和力（六）其他與語言相關的網頁親和力實務 - 2007-07-13
• 雜談網頁親和力（五）多語環境中的網頁親和力 - 2007-06-10
• 雜談網頁親和力（四）自然語言的親和力原則 - 2007-05-16
• 雜談網頁親和力（三）親和力的非技術性層次 - 2007-04-16
• 雜談網頁親和力（二）網頁內容親和力與無障礙 - 2007-03-11
• 雜談網頁親和力（一）淺談網頁親和力方針 - 2007-02-10