Web app
出自 MBA智库百科(https://wiki.mbalib.com/)
目錄 |
Web app是指基於Web的系統和應用,其作用是向廣大的最終用戶發佈一組複雜的內容和功能。
從一個簡單的幫助消費者計算汽車租借費用的網頁,到為商業人員和度假者提供全套旅游服務的大型複雜的WEB站點,都是WebApp。它包括一些完整的WEB站點,WEB站點的專門功能以及在Internet、Intranet或ExtraNet上的信息處理應用。
Web app框架是一種簡單的與WSGI兼容的網路應用程式框架,可以與App Engine配合使用。不必為了使用App Engine而使用 webapp:網路伺服器支持任何使用CGI的Python應用程式。webapp提供一種簡單的方式來開始為App Engine開發應用程式。響應式網頁設計的大部分技術,是可用在WebApp開發中的。
移動端Web App和WAP最直接的區別就是功能層面。WAP更側重使用網頁技術在移動端做展示,包括文字、媒體文件等。而Web App更側重“功能”,是使用網頁技術實現的App。總的來說,Web App就是運行於網路和標準瀏覽器上,基於網頁技術開發實現特定功能的應用。
當用戶登錄一個網站(如Pixlr),大家很容易理解這是在訪問一個Web App。但是對那些僅僅提供基礎服務(如電話查詢或是信息查詢)的網站,區分用戶是否在訪問Web App就變得相當困難了。
其實這些服務大多都是Web App。即便它只完成了某個非常小的任務,那麼它也是一個Web App。Google的搜索引擎就是一個Web App,它本質上和電話查詢服務沒有什麼區別。
也並非所有的網站都是Web App。如果這個網站並沒有執行任何任務,那麼它就並不是Web App。
力求簡潔明瞭是用戶界面設計的重要原則。在同一時間給用戶展示的功能越多,用戶需要尋找和思考的時間也就越多。同樣,界面中存在的選項越少,可用功能就越明顯、越容易瀏覽。不過簡化界面並非輕而易舉,尤其是你不想減少應用程式功能的情況下。
將高級功能隱藏起來是一種有效的簡化方法。搞清楚在界面中用戶最經常用的是哪些功能,然後把其他功能隱藏處理。這些可由下拉式菜單和控制項完成。例如,搜索欄中的高級過濾器可以做成尾部的特殊下拉菜單樣式。當用戶需要這些過濾器的時候只需要幾次點擊就可以使用。決定哪些功能保留展示哪些需要隱藏起來,並不是一個簡單的工作,需要取決於功能控制項的重要程度和被使用的頻繁程度。
彈出式菜單和視窗周邊的陰影不僅僅是為了視覺美觀。陰影一方面增大了菜單或視窗的尺寸,有助於將菜單或視窗從背景中區別開來;另一方面通過灰度化的邊緣陰影可以屏蔽背景內容的噪音干擾。
這個技巧根植於傳統桌面程式,幫助用戶將註意力集中在彈出的視窗。由於很多模態視窗不容易從桌面程式內容頁面中凸顯出來,陰影可以使它們看起來具有立體效果、仿佛懸浮於其他內容之上,於是拉近了模態視窗與用戶的距離。
為實現這樣的效果,設計師往往將透明的PNG背景圖片作為容器,再把內容填充到容器中,同時等距離填充彈出框各邊緣。或者使用具有透明邊框的背景圖片,並將內容框絕對定位在其中。另外,也可以使用基於JavaScript的lightboxes命令或者CSS3中的drop shadows命令,但需要註意瀏覽器是否支持。
當設計web app的時候,不僅需要關心一般情況下的信息展示,還要確保界面在空白狀態時表現良好、具有指引作用。頁面中還沒有產生任何信息的時候,可以在空白區域放置一條幫助信息告訴用戶如何開始。
例如,一個項目管理的應用程式主頁會列出用戶的項目,假如還沒有什麼項目信息,可以為用戶提供一個項目創建頁面的鏈接。即使這個頁面上已經存在了這樣一個功能按鈕,一個額外的幫助並不會有什麼妨礙。這個技巧可以有效地鼓勵用戶試用該服務,併在註冊後立即進行使用。通過應用程式的單一操作步驟可以幫助用戶理解這個應用的優勢以及對他們是否有用。
此外,只為用戶展示最重要的功能選項也很關鍵。一股腦的將眾多功能傾瀉給用戶並沒有什麼實際意義。需要牢記的是,用戶通常想從應用中獲得或多或少的信息,但卻不想跳進細節中,用戶沒有時間也沒有興趣。在空白狀態中激勵用戶,可以顯著地降低用戶的流失率,並幫助潛在的用戶更好的理解程式系統是如何工作的。
許多web app擁有自定義樣式的按鈕。預設的輸入按鈕可能不適合某些情景,文字鏈接有時候看起來又太含蓄。需要註意的是,把鏈接做成Button樣式的時候,它們就應該有button的表現形式。
比如,在點擊button的時候它們應該會出現被“壓”過的樣子。這不僅僅是純粹的視覺變化。及時反饋給用戶,可以使web app感覺起來更靈敏,與桌面應用程式的用戶體驗更接近。可以使用CSS添加按鈕的“pressed”等狀態,實現在不同狀態下顯示不同背景圖片的功能。
在既定的情境下考慮用戶希望看什麼、需要什麼是非常重要的。不需要在每一個地方都放置相同的導航控制項,因為用戶不是在任何情況下都需要它們。
上下文情境導航最好的一個例子就是Office 2007中,原先預設的工具欄集合被換成了帶狀控制項形式。每一項tab控制著一組相關聯的功能,如編輯圖形、校對或者簡單書寫。Web app可以從這種上下文情境導航中獲益,僅展示用戶需要的、而不是所有可用的功能,從而保持用戶界面的整潔清爽。
並不是所有的控制項都擁有相同的重要性。例如創建一個新的條目,頁面中會有“創建”“取消”兩個button. 這裡的“創建”就要更加重要些,因為這是大多數情況下用戶即將要做的事情。極少的情況下用戶才會去點擊取消。雖然這兩個控制項併排放置,但是不要給予相同的重視程度。
為了將註意力引導到“創建”上,我們可以嘗試使用不用的風格或樣式。一種方式是將“創建”設計成button樣式,“取消”設計成文字鏈接樣式。另一種方式是在視覺上使用使用不同的顏色,並使button略有凸起的效果。這樣便於抓住用戶的目光。
第一、使用W3C標準的HTML(標準通用標記語言下的一個應用)語言開發,能夠輕鬆實現跨平臺,移動應用開發者不再需要考慮複雜的底層適配和跨平臺開發語言的問題。與此同時,使用HTML來開發的Web App在投入上會大大的低於傳統的Native App。
第二、基於當下開始普及流行的HTML5,Web App可以實現很多原本Native App才可以實現的功能,比如LBS的功能、本地數據存儲、音視頻播放的功能,甚至還有調用照相機和結合GPU的硬體加速功能。
第三、移動應用的迭代周期平均不到1個月,用戶需要頻繁的重新下載與升級。而Web App則無需用戶下載,並且和傳統網站一樣可以動態升級。
第四、Web App有App的特性,更有Web的特性。每一個Native App在當前的用戶使用場景下是相對孤立的,而Web App則可以像傳統互聯網網頁那樣相互鏈接,從一個Web App直接跳轉到另外一個Web App。這無論是從用戶的使用體驗層面還是從應用之間的數據傳輸來看都是非常不錯的選擇。
ASP,PHP,HTML,JAVA等。使用這些常見的網路開發工具,可以製作絕大部分的webapp程式,使其在網站頁面上實現傳統的C/S架構軟體的功能,也就是我們常說的SaaS模式。
CBX,AthTekWebAPPKit等。CBX和AthTek WebAPP Kit都是國產軟體,它們的主要功能就是以將使用傳統編程語言如C,C++,Delphi等開發的C/S架構客戶端軟體工程,以所見即所得的方式,快速部署到網路伺服器上,讓傳統的編程語言也能夠實現基於web的互聯網應用程式開發。
百度SiteApp是致力於為開發者、站長提供從生成WebApp到流量、用戶引入再到變現的綜合服務平臺,亦是國內首家的WebApp線上生成服務平臺。
Web APP就是一個針對Iphone、Android優化後的web站點,它使用的技術無非就是HTML或HTML5、CSS3、JavaScript,服務端技術JAVA、PHP、ASP。
需要註意的是web app開發還是比較有限的。因為Web APP開發不能整合設備的核心功能,比如發文本信息,也不能充分使用APP Store進行銷售和更新。但是Web APP開發也有其優勢所在。
首先它解決了iphone APP的可擴展性問題,因為它是可以跨平臺使用的。比如你開發了一款Web App,那麼它既可以在手機iphone上使用,也可以在平板ipad上使用,而不像iphone APP那樣只針對某個平臺。
其次web APP也繞開了APP store嚴格的提交和更新審查規則。眾所周知,隨著APP store中的APP逐漸增多,APP store也推出了一系列的提交和審查規則,可謂相當之嚴格。而web APP則繞開了這些提交和更新審查規則,從而使得web APP的升級和維護變得更容易。因為它是一個獨立的站點,而不是依附於app store上的,不管是升級還是維護在客戶端進行即可,無需提交審核。
最後則是開發語言了。相比較Objective-C而言,HTML、CSS以及JavaScript學起來要容易多了。且對於傳統開發者來說,HTML、CSS以及JavaScript基本都是可以直接上手的,省去了前期的培訓工作。