DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> AJAX入門 >> AJAX詳解 >> 整合配套才能發揮Ajax最佳效用
整合配套才能發揮Ajax最佳效用
編輯:AJAX詳解     

浏覽器相容性衍生新成本
雖然Ajax技術的局部更新與呈現控制效果有很多好處,實際上仍衍生了新的開發成本。 AJax是多種技術的集合,由於不同的浏覽器對不同技術的支援程度不一,呈現效果可能會差異甚大;而且,即使是同一種浏覽器,不同版本的支援也會差異很大,例如同樣的邊界值設定,IE 6.0和7.0顯示的效果就大不相同。開發人員必須針對不同浏覽器的呈現結果逐一調整。

友邁科技董事長卓政宏與網擎資訊研發經理張嘉淵不約而同地承認,浏覽器相容問題是開發AJax網頁最費力、也最麻煩的問題。網頁環境是開放的,不同於桌面應用程式的封閉性,開發人員無法百分之百預先針對各種可能的使用者浏覽環境進行完整的軟體測試,只能盡可能支援主流規格。

AJax開發不只是技術問題,經常需面臨技術與應用的雙重考量。網站開發人員經常面臨的兩難,是必須在網頁效果和浏覽器相容性中取捨。為Sony設計購物網站的Brix專案協理劉育廷無奈的表示:「為提供更細膩的效果,我們無法支援所有的浏覽器,最後只好忍痛放棄使用人數較少的Firefox。」針對特定浏覽器設計,比較能做出准確和豐富的呈現控制效果,但必須耗費時間成本追蹤和分析使用者的使用記錄,才能了解目標顧客的使用環境,這是比較有效率,但無法通吃的預判方式。

框架可解相容問題,但彈性受限
另一種策略是采用能專門解決浏覽器相容問題的AJax框架。例如Urmap下一版已經開始使用YUI(Yahoo! User Interface Library)進行開發,卓政宏指出:「應該把力氣花在產品內容,把繁雜的相容問題交給專家。」許多框架都會特別處理浏覽器問題,以維持框架的相容性。例如YUI有專責單位Yahoo! Presentation Platform team負責長期維護。在這種策略下,網站企業主可更專注於產品實質內容的開發,但就須和特定框架綁在一起。

但是對開發網頁應用程式的服務供應商而言,他們對資料傳輸量的要求比較嚴苛,技術客制彈性需求比較高,網擎資訊研發經理張嘉淵認為:「試過一些框架例如Dojo或YUI,因為支援太多功能而檔案太大,影響下載速度,客制彈性也不夠。」因此網擎資訊選擇不用框架,自行研發AJax應用。在浏覽器相容性勞務負擔與彈性客制化之間,網站企業主必須作一個選擇。

從表格走向物件,開發思維須轉型
雖然浏覽器相容性是外在影響因素,對網頁企業主而言,AJax技術也同樣會造成內部開發的結構性變革,最主要因素是網頁內容的物件化要求。網頁內容透過CSS或XML包裝成物件後,AJax才能透過Javascript精准的控制DOM來更新資料或改變呈現的方式。網頁內容物件化程度不夠時,會造成JavaScript執行失敗,或干擾原本已有效的控制程式。

物件化的設計思維其實是CSS的設計精神,但過去網頁開發人員或美工設計人員習慣采用表格對版面直接進行鋪排,直接視覺化的角度,安排網頁內容的架構。表格式的設計思維,造成內容的呈現方式和意義架構的混合,一旦要調整不同的呈現方式,或修改意義架構時,就必須重新設計網頁,造成許多重復工作。即使可以透過網頁范本套用,仍須為不同的呈現,設計不同的網頁范本,這仍是許多網頁開發人員拋不開的痛苦。

CSS采用物件化的設計精神,可以將內容和呈現分離,使得同樣的內容可以一再套用到不同的呈現樣式。局部樣式修改,也可以馬上反映到所有套用的內容上,不需逐一修改網頁,應用彈性和可用性可大幅提高。但CSS之所以過去難以普及的原因,在於內容與呈現分離的物件化設計概念,過於抽象,無法直接從視覺上看到效果。開發前置作業期程將會因此耗時更久,開發人員必須先分離出網頁內容的整體結構,考量未來可能呈現的樣式,進行規畫,不易像過去那樣邊做邊改。這是完全不同的設計思維與開發習慣的躍遷。

對設計人員而言,需要進行心態的轉換與相當時間的習慣調整。 AJax技術會迫使網站開發人員需重新檢視設計思維,調整過去直覺式的設計習慣,采取更嚴謹的開發規畫。最近也開始出現一些網頁物件化設計的框架,例如台灣Yahoo!奇摩使用的LSM(Layered Semantic Markup)框架,采取資料內容、呈現樣式與操作行為分開的設計,達到網頁結構化,以及開發與設計協同分工的目的。

網站開發需要更細膩的專業分工
更深一層的開發思維影響是互動設計的專業化。目前多數AJax網站的開發原因,對介面物件操控與互動效果的設計,多數仍由程式開發人員主導。不是因為開發人員擅長互動設計,而是設計人員害怕寫程式。台灣最大設計網站黑秀網下任站長(網路代號:火星人)表示:「設計人員連一行程式都不願意碰,這是難以跨越的鴻溝。」

設計人員多采逐頁畫面設計的思維,將頁面變化的截圖,交給程式人員處理成動態效果。但畢竟程式開發人員不見得能比設計人員更熟悉設計或美感呈現的考量,這樣截然二分的流程其實限制了動態效果的呈現方式,或者是局限在小地方互動的機制,從而缺乏整體性的設計。

透過Ajax技術的網頁,內容會依據使用者的操作動態產生,而介面互動方式,又會因產生的內容衍生,使得介面設計的難度更高。再加上動態更新的網頁內容,不利於搜尋引擎的索引,全面采用AJax技術,反而影響網站內容在搜尋引擎上的排名能見度。

Ajax方便性與搜尋引擎最佳化(Search Engine Optimization,簡稱SEO)的拿捏使得Ajax網站的介面設計,需面臨多種向度的綜合能力。已有大型網站,招募專責人員負責介面設計,例如Yahoo!的前端技術工程師(Front-End Engineer,簡稱F2E)、或是Yam天空網站的網頁工程師(Web Master)等,不再只是通稱網頁設計、視覺設計或美工。專門職位的設立,反映出Ajax介面設計的專業分工趨勢,網站企業主采用AJax技術時,對互動品質要求越高時,就不僅是選對技術框架,或找到專精的設計人員就足夠,而是需要專職介面設計人員。

網頁豐富應用各家爭鳴,企業需評估AJax采用時機
讓我們再從網頁豐富應用(Rich Internet Application)的角度來看,AJax也並非是唯一的技術。 Flash已經出現十年,可以提供更豐富的動態互動與影音效果。但Flash的設計難度更高,相較於懂JavaScript的人力,能夠充分運用ActionScipt的人力非常缺乏,Flash強於設計輔助,但對介面程式開發的支援和管理相對較弱。兼具開發人力與互動效果雙重優勢的AJax,仍有不可取代的價值。

但此一優勢現在也面臨極大的挑戰,Ajax正受到內在技術的局限與新興技術的競爭。 Ajax技術一方面引發越來越高的網頁安全問題,衍生新的資安控管與程式設計安全問題,使得技術框架需要更多復雜的程式碼來控管,進而影響效能和下載意願。另一方面,面對日益復雜的應用需求,AJax技術遇到瓶頸,也開始不勝負荷,例如無法快速處理商務網站所需的上千筆資料排序。

AJax有內憂,而次世代網頁技術也節節逼近,例如微軟新推出的Silverlight技術,兼具搜尋引擎最佳化與介面呈現效果,又擁有完整的開發與設計工具支援,來勢洶洶。升陽也預告將推出專攻RIA應用的JavaFX新語言,主打行動裝置的相容性等。

但技術優劣不等同於應用效益,最後何者勝出,端視應用的整合配套。網站企業主需評估Ajax技術與企業應用需求時,需考量整合效益,衡量長期維護與內容建置是否能配合,清楚了解采用後需調整的配套作為,而不是一昧追趕流行比效果,才能發揮AJax技術的最佳效益。 

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved