HTML5為提高手機網(wǎng)頁的體驗提供了諸多的可能性，交互效果越來越接近原生App，故而成為Web

App，有望將APP功能引向瀏覽器，讓移動平臺的競爭由系統(tǒng)平臺轉(zhuǎn)向了瀏覽器之間。

Web App比起原生App和wap有著自身的優(yōu)缺點，先簡單了解下其特點，掌握設計趨勢，也便于以后在設計中應用。

離線存儲

離線存儲的意思是第一次訪問是下載網(wǎng)頁，以后在無網(wǎng)絡的情況下也可以使用。一個離線應用程序就是一個URL列表–HTML，CSS，JavaScript，圖片，或者其他類型的資源。訪問時探測到服務器列表的緩存名單時，會觸發(fā)下載事件，根據(jù)名單下載指定的文件存儲到本地。

在下載的同時，瀏覽器將會周期性的觸發(fā)進度事件，此事件包含了諸如多少文件已被下載，多少文件仍然處于下載隊列等信息。當緩存名單中所有列出的資源被成功下載后，瀏覽器觸發(fā)下載完成事件。

當再次訪問時，瀏覽器會再次檢查網(wǎng)站的緩存名單，通過對比名單和本地的資源，得知是否需要加載新資源。新版本加載完成之后不會立即被使用。后臺可以下載新網(wǎng)頁，也不會強制用戶打斷當前操作流程，重新刷新頁面。

如果此過程中的任何一點出現(xiàn)可怕的錯誤，你的瀏覽器將會觸發(fā)一個錯誤事件，并立即終止。類似于安裝應用程序，中途不可以出錯。

Web App可以利用存儲的特性將重要和重復的數(shù)據(jù)保存在本地，避免頁面的重復刷新，減少重要信息在傳輸過程中被泄露，增量傳輸修改內(nèi)容。

而離線存儲但也不是Web

App特有的問題，瀏覽和閱讀類App也有離線的使用需求，用來應對隨時可能出現(xiàn)的網(wǎng)絡問題。如離線模式是利用網(wǎng)絡閑暇時間下載內(nèi)容，當用戶打開App時立即開始閱讀?；蛘呤蔷W(wǎng)絡不佳情況下保存用戶的操作記錄和加載相對重要的文字內(nèi)容，之后再依次上傳已更新的數(shù)據(jù)，如微博的發(fā)送隊列機制。

交互操作

手機網(wǎng)頁的操作發(fā)送只有點擊，點擊鏈接和控件，交互方式非常單一，而Web App 的操作將越來越接近應用程序。

1.Web App的建立離不開網(wǎng)絡速度的提升，加載更多的內(nèi)容，圖形元素更為豐富。同時更多的JS交互，便于用戶操作和形成扁平化的信息架構。

圖標取代文字鏈接，界面更為美觀，便于識別的。點擊區(qū)域不限于元素的視覺區(qū)域，便于用戶點擊。同時排版不受限制，可以達到原生App的視覺效果。

增加標簽欄，首頁呈現(xiàn)更為的內(nèi)容，減少界面的層級關系，頁面關系更為明確。

界面可以部分更新，在需要時再呈現(xiàn)，減少界面的刷新，保存視覺的穩(wěn)定性。

氣泡框可以減少頁面跳轉(zhuǎn)，適合消息提醒等微任務的處理。信息架構上越來越接近原生App，有利于扁平化層級關系和減少界面跳轉(zhuǎn)等設計元素將得到更多的應用。

2.識別更多的手勢操作，如下拉刷新和右滑存檔等平移手勢。操作不必全部呈現(xiàn)在界面中，和平臺操作保證一致。

3.調(diào)用系統(tǒng)硬件，如重力感應等傳感器，不過在手機端還鮮有應用案例，離大規(guī)模應用還有一定的距離。

總之，交互上可以按照原生App的設計方式，效果將越來越接近，主要區(qū)別在于：

設計中要考慮到瀏覽器地址欄和工具欄的占有空間，和其對App的操作存在一定的影響。

暫時不適合調(diào)用系統(tǒng)底層接口，更適合web網(wǎng)站適配手機做的分支版本。

由于HTML的限制，交互的細節(jié)上存在一定的差異。

動效還沒大規(guī)模的應用，但Web App界面操作將更為流暢，界面跳轉(zhuǎn)時的平滑移動已經(jīng)可以實現(xiàn)，以后還有更多的動效得到應用。

現(xiàn)階段信息架構還混雜著原生App和wap兩種架構方式

本文來源于成都網(wǎng)站建設公司與成都網(wǎng)站設計制作公司-創(chuàng)新互聯(lián)成都公司！

分享題目：談手機網(wǎng)頁應用的交互設計
網(wǎng)頁網(wǎng)址：http://www.rwnh.cn/news18/313818.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供定制網(wǎng)站、微信小程序、網(wǎng)站收錄、全網(wǎng)營銷推廣、網(wǎng)站設計、App開發(fā)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)