為什么說H5現(xiàn)在越來越火，主要是因為H5以其較高的趣味性和良好的交互性受到越來越多用戶的青睞。

今天，25學(xué)堂的小編結(jié)合自身的一些在APP上面的H5頁面交互設(shè)計心得。跟大家討論下H5頁面交互設(shè)計的四大缺點與解決方案。

目前居多的APP應(yīng)用里面嵌入了H5頁面。

從使用場景上，H5頁面的交互使用與原生APP相比，缺乏以下四個方面的不足：

1、頁面跳轉(zhuǎn)更加費力，不穩(wěn)定感更強。而且頁面之間的跳轉(zhuǎn)也不是很流暢，很多時候出現(xiàn)卡頓或卡死現(xiàn)象。

思考點：如何減少跳轉(zhuǎn)（扁平結(jié)構(gòu)、頁面布局技巧），增加數(shù)據(jù)及展示的流暢流程及穩(wěn)定性（技術(shù)）

2、更小的頁面空間（由于瀏覽器的導(dǎo)航本身占用一部分屏幕空間），更大的信息記憶負擔(dān)

移動設(shè)備的屏幕要小得多。這種如同透過門縫進行的閱讀增加了認知的負擔(dān)。

人腦的短期記憶是不穩(wěn)定的，用戶在滾動屏幕的過程中需要臨時記憶的信息越多，他們的表現(xiàn)就會越差?！顿N心設(shè)計：打造高可用性的移動產(chǎn)品》

思考點：排版更清晰、信息更簡練 （可在原生APP基礎(chǔ)上去掉一些豐富、復(fù)雜的視覺表現(xiàn)）

3、導(dǎo)航不明顯，原有底部導(dǎo)航消失，有效的導(dǎo)航遇到挑戰(zhàn)等。

思考點：如何有效的提供導(dǎo)航？有哪些形式？

4、交互動態(tài)效果收到限制，影響一些頁面場景、邏輯的理解。

思考點：比如登錄注冊流程的彈出、完成及異常退出，做好文字提示。

針對以上困境，解決方法總結(jié)如下。首先，從APP到H5版，在產(chǎn)品上，最明顯且核心的：

以下三點就是目前我們常見的解決方案：

1、精簡功能，只將核心的任務(wù)實現(xiàn)，非核心的枝節(jié)可考慮刪減。

2、做好新的WebAPP（h5）交互導(dǎo)航.

3、補充從WebAPP（h5） 對?下載原生APP?的引導(dǎo)。

4、減少頁面層級的數(shù)量和輸入操作。

5、H5版上只做查詢、瀏覽、顯示結(jié)果等操作。