我们常说的客户端里的i版页面或H5页面，是通过webview控件展示的网页。一个native页面可以有多个webview入口，点击webview入口，打开的就是i版页面。我们可以从i版页面跳转到另一个i版页面，也可以跳转到native页面，因此，如果流程中融合了native页面和i版，如何加以区分并针对性地设计是设计师遇到的一个问题。
iOS和Android两个平台的webview的情况不完全一样，以下会分开举例。
iOS：
1.看导航栏。原native页面返回旁无返回文字，打开i版左上角新出现“返回”两字（第一个i版页面是“返回”，第二个页面及往后的多了“关闭”，这是未经处理的i版状况）
第一个i版页面.png
第二个i版页面.png
2.长按内容列表，出现链接弹层，一定是i版
长按时.png
长按后.png
** 3.使用位置信息的提示说明当前页是i版**
提示使用当前位置.png
4.i版一般没有下拉加载，也可单独处理为其增加
（下图1是客户端加载样式，图2没有加载样式的i版页面，图3为单独增加加载的i版页面）
客户端加载样式.png
未经处理的i版.png
单独增加加载的i版.png
** 5.长按可以选择内容区的文字，若是iOS则一定是i版。这点不同于Android，Android不论客户端还是i版都可以选择文字**
长按选择文字.png
Android：
1.看导航栏。
一种导航模式：打开i版返回按钮变成关闭按钮，下图1；
另一种导航模式：右侧有“关闭”，一定是i版（因为Android没有“返回”了，所以有“关闭”的前一页也是i版），下图2和3
返回变成关闭.JPG
第一个i版无关闭.png
第二个i版有关闭.png
2.导航栏下方有加载进度条的，一定是i版
这点iOS同理，因为iOS的i版之前未做进度条，所以没有加上这个例子。
加载进度条.png
3.Android的i版页面下拉时有阈值限制，移动不了
下拉受限.png
以上只从能观察到的表象去对webview页面做一个区分，不涉及两个平台不同逻辑上的说明。webview页面目前还有很多体验上的问题，后续会总结出一系列的解决方案。
网友评论