文章

強韌網頁設計—第七章:挑戰

超文本的第四屆會議 1991 年 12 月在德州聖安東尼奧舉辦,添.伯納斯-李的萬維網專案剛剛成形,心想會議的搞手和參加者應會欣賞他的專案,他給超文本91(Hypertext’ 91)提交了一份提案,結果被退回。

超文本社群覺得萬維網專案太過於簡單,當時幾乎其他的超文本系統都有雙方連結的概念,若一資源被移除,其他指向此資源的連結會被自動更新。網頁卻無這種保證,連結的系統簡單得多-單單連向一些東西,僅此而已,對於超文本91的搞手來說這實在無可救藥地幼稚,他們不明白網頁的簡單其實是其強大之處,因為連結是如此直接,所以人人可連,這在萬維網的應用與成功中可見。

我們很容易就會說某方法過於幼稚、過於簡單和不切實際。一個網站可以同時給予所有人普遍取得,同時為有能力的裝置提供豐富而令人投入的體驗…也看似無可救藥地幼稚。

在網絡的歷史裏,這類判斷一直保留著。

「這太簡單了」

當網頁標準專案(Web Standards Project)開始時,鼓勵設計師由 TABLES 轉過去 CSS 做佈局,引來不少反彈,每一次他們都批評說這太天真,「或者 CSS 佈局適合簡單的個人網站,但就是沒有辦法應用到大型複雜專案的規模」。

當道格‧鮑曼(Doug Bowman)率先以 CSS 佈局重新設計 Wired.com,麥克‧大偉森(Mike Davidson)以 CSS 佈局重新設計 ESPN.COM 後,大門就打開了。

當伊凡·佐克曼示範響應式設計的威力時,也有反對意見,「或者響應式設計適合簡單的個人網站,但就是沒有辦法應用到大型複雜專案的規模」。

然後波士頓環球推出其響應式網站,微軟使其首頁變成響應式,大門又再打開。

今天也有相似的故事,「或者漸進增強適合簡單的個人網站,但就是沒有辦法應用到大型複雜專案的規模」。

大門已經打開了,我們需要你一起創建強韌網頁設計的典範。

「這太困難了」

建立強韌網站甚具挑戰,需要時間去將功能和特性去分層次實作,結果是網站能夠對意外環境有更好反應-諸如非一般的瀏覽器、薄弱網絡連接、過期裝置。雖然如此,對很多設計師來說,這樣作時間成本似乎太高。

但謹記以漸進增強方式建立不等於要將所有東西提供給所有人,而是有用的核心功能。提供所有功能給所有裝置所有瀏覽器,會是不可能艱距工程,所以排優先次序很重要,只要核心功能可以以最簡單的可能科技呈現,你可以-問心無愧地-層層加入更多高級功能。

這方法依然會有可能導至重複工作,如果你建立一個老舊的客戶伺服式(client-server)表單提交過程,然後以 JavaScript 增強,可能最後會在客戶端重復了伺服器端的表單處理工作,在伺服器端使用 JavaScript 減緩這情況,理論上是可以寫一個通用的 JavaScript 讓客戶端和伺服器分享同一段程式碼。但即使沒有通用 JavaScript,我仍然覺得值得花時間去增加這個技術信用。

英國政府服務設計手冊提供一個比我的三步曲更短的流程:

  1. 首先,使之僅僅可用
  2. 然後使之運作得更好

設計手冊亦有解釋:

如果你將 HTML 以外的部份都當成選項,你能建立更好更強壯的網頁

這種韌性意味著你最初所花的時間是一項好好的投資,你還可能發現一個有趣的趨勢,就是你越多使用這流程,它花的時間就越小。

TABLES 轉至 CSS 看似一項不可能的理想目標,設計師早安於使用 TABLEFONT 元素做佈局,何需再學新方法?我猶記多年都使用黑技後,第一次使用 CSS 佈局時是如何棘手,但第二次就不用那麼多時間了,過一段時間後成為常態了。

安於使用定寬佈局的設計師很難應用響應式設計,第一個彈性佈局將無可避免地需要花一些時間去建立,但第二個就會快得多,過一段時間就成為常態了。

對於強韌網站所需的層次方法也是一樣,如果你不習慣,起先會花你一些時間去做,第二次就不用那麼多時間,過一段時間就成為常態了。

或許有些情況不適用於三步曲,但並不如你所想般常見。如果你在瀏覽器打造一個 3D 遊戲,其核心功能的最簡單的可行科技仍會蠻複雜。雖然如此,我是很想看到一個純文字的冒險遊戲,被增強到一個第一身射擊遊戲。

「我怎麼說服…」

才華橫溢的電腦科學家葛麗絲·霍普(Grace Hopper)牆上掛有一件非一般的鐘,是逆時針行走的。問到這個鐘時,她指出那是一種隨意的慣例,她說:

人對變化過敏,愛說:「我們一向如此做」,我試與之對抗,所以掛一個逆時針的鐘在牆上

美國海軍準將葛麗絲·霍普
美國海軍準將葛麗絲·霍普

改變行為很難,就算你被強韌的網頁設計方式的好處所說服,你仍然要爭取說服你的同事、上司和客戶。事情往往如此。從網頁標準和響應式設計的歷史看,最後採用那些方法的人開始時都是反抗的。

要展示漸進增強的好處可以很棘手,因為要在意外環境才看到成果,這難以推銷分層方法。很多人永遠都不會知道一個網站是否以強韌方式建造。對於在新裝置上使用當今瀏覽器兼有高速網絡連接的人來說,這是個隱藏的質素。

所以基於同樣理由,你可以就這樣開始實作這個層次方法,而不用說服你的同事、上司和客戶。如果他們不在乎,他們也不會發覺。就如葛麗絲·霍普也這樣說:「尋求原諒比取得批準容易」。

工具

改變工作流程或過程可以很具挑戰,尤當這些流程與所使用的工具有所衝突。工具理應幫助人們工作得更有效率,而應當服從工作流程,但工具經常主宰某種偏好的工作方式。無論是 WYSIWYG 編輯、圖像設計程式、內容管理系統或 JavaScript 框架,工具無可避免地影響工作流程。

如果你對這影響有所覺察,就能認出這些影響,作出更好的選擇,選取最適合的工具。選取框架時會有很多考慮因素:「寫得夠好嗎?」「背後社群夠活躍嗎?」「文檔清晰嗎?」但或許最重要的問題是「其方法配合我的哲學嗎?」。

每個框架都有其哲學,因為始終是由人寫的。如果其哲學與你配合,能使你做事更有效率。但若哲學上有衝突,你每一步都要與之對抗,甚至可能放棄你的哲學,任由框架主載你的工作流程,本末倒置了。

明智地選擇你的工具,只因為一個軟件的不同意見而放棄強韌網頁設計的方法,實在令人遺憾。

通常意見之别在於優先次序的不匹配,漸進增強的中心是以人的需要為優先,而不是科技。工具、框架、程式庫,則是以設計師或開發者的需要為優先而建造,這未必是件壞事,令開發者夠方便有很大的價值,但我個人認為,用戶需要應優於開發者之便。

當我面對這類問題,要選擇令這成為用戶的問題還是我的問題,我每次都選我的,那是我的工作。

面向未來

在 2011 年 9 月,我在田納西州一個會議上演講,那裏有很多比我聰明的人。當官方活動完了,我們在郊外租了間房子住了幾天,一起想想網絡的未來。

一些可上網裝置
一些可上網裝置

坦白說,我們很害怕,流動裝置的增長改變了所有事,平板正在掘起,人們在談論互聯網電視。我們希望弄清楚下一波巨浪是甚麼,或許,是可上網的雪櫃?

到最後,我們只可以確定我們不確定:

分裂只會加速,連線裝置的數量與種類會爆增,有很多我們想都想不到,而使用它們的人的數量與種類亦同樣爆增

我們不應絕望,反要慶祝。我們可以對抗或擁包這未來,了解到這要在未來永不出錯是不可能的,我們轉向面向未來的友好設計:

  1. 確認與擁抱未知
  2. 以面向未來的友好方式思想與做事
  3. 幫其他人同這樣做

第一步最為重要:確認擁抱未知,是強韌網頁設計的驅動力,面向未來的最好方法是向後支援。

面向未來標誌
面向未來標誌

假設

「我們需要一個嚴格定義的疑問和不確定的範圍!」道格拉斯·亞當斯(Douglas Adams)的《銀河便車指南》(Hitchhiker’s Guide To The Galaxy)裏的哲學家們呼叫著。

身為模式辨認的機器,我們很快就能認出潮流並將此編成假設。以下是我們在網頁設計史上的曾經有過的假設:

  • 每個人的螢幕都是640像素闊
  • 每個人都裝了 Flash 插件
  • 每個人的螢幕都是800像素闊
  • 每個人都有一隻滑鼠一個鍵盤
  • 每個人的螢幕都是1024素闊
  • 每個人都有高速網絡連接

流動裝置的增長將以上所有假設摧毀,流動之掘起並非製造新的不確定-而是照亮已經存在的不確定。

這理應是寶貴一課,但新假設很快就取代了舊的:

  • 有些活動人們永遠不會在電話上做
  • 每個電話皆有觸碰螢幕
  • 每個用電話的人總是在忙碌之中
  • 每個電話上的瀏覽器都支持 JavaScript

這類假設常常讓我想起老物理笑話,「假設有一個完美球形的網絡瀏覽器…」

假設總是騙人的,若我們一開始就在某些限制上有共識,網頁設計豈不是易於控制?

儘管動聽,卻搞錯了這個永恒變幻的網絡的真正本質,卡爾‧沙根(Carl Sargan)在他的書《THe Demon-Haunted World》(惡魔出沒的世界)說得最好:

了解宇宙的真相比起堅信錯覺,更令人滿意與心安

未來

但願我能知未來,但我唯一能知的是世事必會改變。

我不知人們會用甚麼裝置來上網,也不知人們會用甚麼軟件來上網。

未來,正如網絡,是未知的。

未來,正如網絡,是由你編寫的。

參考資料


本文是《Resilient Web Design》繁體中文翻譯的其中一部份,以該書的相同的姓名標示-相同方式分享 CC 4.0 國際授權

*