網站互動技術的進展

CNET授權採用NYTimes文章：James Fallows‧郭文興譯　　2005/05/26

每個上網的人一定都有過這種讓人喪氣的類似經驗。

上星期我在美國明州阿坡里市，由於飛機誤點而要多等三個小時，這還不是讓人喪氣的地方。真正令人喪氣的，是我想用手提電腦連上機場提供的無線網路。要連上這個無線網路，必須要在螢幕上填寫一個註冊表單，要填上姓名、住址、電話、電子郵件、信用卡訊息，以及在網路上要使用的名稱。

我按下「送出」鍵──兩秒以後系統回應說已經有人使用這個使用者名稱，可能是其他人用了，也或許是自己上次來過這個鬼地方可是我忘了。但因為表單的所有欄位又變成空白，我必須把整個填過的表單重填一次，然後祈禱下次我選的名字可以用。

這種不便在某種程度上反映了網頁設計的怠惰與未完成。多年前程式設計者就已經知道要使用
「系統快取」或「系統暫存」功能。輸入的資訊裡面，除了那些造成問題的欄位之外，比如我選的使用者名稱，與需要保護的欄位，比如密碼或信用卡號等等之外，都應該要存到快取跟暫存裡面。不使用這種快取功能，而草率製造的網頁，數量多到令人沮喪。你一定也碰過這種要改任何輸入文字時需要整個重來的網頁。

但是在機場遇到的這個小問題，讓人聯想到使用網頁的基本概念。一直以來，網頁的使用都是網際網路的最大限制之一，但已經有很不錯的跡象顯示目前的狀況將要改變。

網站的互動功能，可以說是一種古早時代冗長流程的現代快速版本。舉例來說，如果你到公家機關或銀行辦事，你填好一張表格拿給職員或出納，最終會得到一些回應。這就是目前大多數網站的工作方式。你在網頁上輸入資料，借由按下「輸入」或「繼續」，或是按下某個連結，將資料送給遠端的電腦。最後電腦會回傳一些資訊。所送回的網頁往往像是你從職員那裡拿回的表格一樣是靜態的。如果你想要更多其他資訊-比如新的搜尋結果，或在其他日期的其他航班-你就必須要送出另一個要求，等待另一個回應。

這些浪費的時間雖然並非真的很多。但在只有幾項資料要改變，就必須要重傳整頁資料的這種情況下，的確會消磨使用者上網的動力。這種問答式的流程會讓人想到古早時期，將資料送到大型工作站等待其處理的情形。在目前的網站上，至少有一半以上放在「購物籃」裡的商品從未結帳。原因之一便是傳統的網站結帳流程十分累贅麻煩。

最近這三個月來，一些現存的相關技術，給予了網站全新感受，因而造成網路上一些騷動。要看看這些騷動所為何來，最簡單的辦法就是上Google Maps去看看。

在網站maps.google.com上，你可以看到美國境內任何一處的衛星照片。然後你可以按住地圖，往東邊或西邊捲動，也可以使用左右鍵達到同樣效果。大多數的地圖程式裡，當你捲動範圍超出原來地圖邊界時，就必須要暫停等待網站傳回該區域的資料。但如果使用Google的地圖程式，你可以持續向東或向西捲動，可以超出任何範圍，也可以在任何地點縮放。雖然該地圖的精密度依地點而異，但使用的經驗讓使用者感覺像是在登入時就已經收到所有地圖一樣的流暢。
當然該網站並不可能真的如此做。這個系統其實使用了兩個基本的技巧，讓他看起來像是你在電腦上擁有所有的地圖資訊。第一個技巧是非同步的資料更新-就是在系統等待你送出新的要求時，會將你可能要求的資料都先預存至你的電腦，比方目前地圖的邊緣部份。另一個技巧就是選擇性的更新資料，系統只更改跟目前資料不同的部分，而不是重新讀取整個網頁。

以這兩個技術作為主體，然後再與其他元件整合的網頁設計方法，在二月時，被顧問公司Adaptive Path的Jesse James Garrett命名為Ajax技術。然而該名稱本身就有極大的爭議。雖然該名稱在三月的華爾街日報上就已眾所皆知。但軟體公司Macromedia的副總David Mendels表示應該要叫「Rich Internet Applications」(多樣化網際網路應用)，而Google的專案管理總監Georges Hank認為應該要叫「Rich Web Application」。微軟平台策略部的總經理Charles Fitzgerald則表示，這樣一個聰明的工程師早已使用多年的工具，並不需要一個特定的名稱。不管名稱為何，所有相關的軟體陣營似乎都同意兩件事。

第一件事就是，「較多樣化的」網站可以提供更加滿意的使用經驗，不只限於給線上購物使用。Macromedia公司提供類似於Ajax的Flash技術，該公司的副總Mendels舉了幾個實例，比如油漆公司Serwin-Williams的網站，使用者在網頁上調出顏料的各種色調，看看這些顏料塗到他們房子的門窗上面後看起來如何。

總而言之，他強調使用這些「較多樣化的」網站的感受，會變得愈來愈像在你自己的電腦上面執行程式一樣。舉例來說，Gmail，也就是Google的電子郵件服務，現在可以執行更多複雜的郵件編輯功能，而購物網站也可以在使用者更新資料時，立即重新計算總價跟運送的費用，就好像電腦裡的試算表一樣。這個技術的關鍵就在於網頁會自動的更新，而且只有特定的部分會改變。而對在機場的我來說，若網頁使用了該種技術，便可以在我嘗試使用者名稱時立即顯示該名稱是被允許或拒絕，而不會影響到螢幕上其他欄位的資料。

大家所同意的另一點，就是瀏覽器市場的差異性──Internet Explorer，Firefox，Opera跟其他的瀏覽器，讓設置一個可以在每種瀏覽器上運作的「多樣化」工具難上加難。而Mendels認為解答就是他們公司可以在任何平台上執行的Flash技術。而微軟的Fitzgerald則表示解答是被包含在下一版視窗Longhorn的一組執行工具Avalon裡面。接下來一定會有愈來愈多關於這種競爭──不管是使用者方面或是公司方面的競爭──的新聞報導。

最後則是關於Google空照圖的相關資訊。上個月我提到有小部分的美國國土照片反常的模糊。模糊的地方並不是美國中情區的總部（中情區總部的照片清楚到可以看到停車場車輛的顏色）。也不是堤防或是電廠等等神秘的區域。地圖的有些地方比較清楚，有些地方比較模糊，是因為衛星照片的品質會依地點而有所不同。

而美國白宮與兩棟相鄰建築的屋頂，的確被使用影像軟體Photoshop處理過，以隱藏保護系統的所在位置。而州議會大廈的外觀也經過模糊處理，但整個輪廓還是相當清楚。但是如果你想看看真正的偽裝長什麼樣子，可以將華盛頓特區的Observatory Circle部分放大，那是副總統Dick Cheney的住所。