对于手机网站WAP页面的跳转设计的一些建议

对于手机网站WAP页面的跳转设计的一些建议

有一天

跳的太多了，理解不了。

PC上的网页不断在网页之间跳转是很正常的。从首页到百度搜索页面，再到详情页，再到相关内容的详情页……但是到了手机端，过度跳转就有点难了。

从首页列表->:每个新浪微博详情页->；个人中心->:每个新浪微博详情页->；个人…可以一个接一个的深入，但是跳了三四次之后，再看左上方的“后退”按钮，你就说不清自己可能会回到哪里了。

如果是传统的PC网站，跳转到其他频道时可以显示层次导航栏，解释清楚。这样的情况自然要尽量避免，但终究还是可以解释清楚的。

页面很小，没有太多空间放双层标签导航栏或者导航，只在左上方留了一个“后退”按钮作为导航栏。对于新浪微博来说，这种情况，可圈可点是不够的。如果你想像传统的PC网站那样错综复杂地连接，那就更容易混淆。

大量的等级，大量的实际 *** 作，降低了申请效率。

即使没有光环，大量的层次，大量的深层次，大量的实际 *** 作，应用效率也降低了。

挖安卓版手机，在列表页面立刻可以看到照片和播放视频:

毫无疑问，你被上面的化学老师吸引了。其实我在我的普通高中就见过化学老师拿500ml量杯喝水。我这里说的是:这个手机网站的安卓版不用去详情页，直接访问列表就可以了。当你看到一个非常有趣的视频，马上点击它，打开哪个全屏视频播放页面。

如果每章内容只显示了列表页前面的一小部分信息，那么到了详情页就只能看整篇文章，播放视频了。虽然那样没什么不好，但是用起来会太累。

相比一些网站的手机安卓版，只是把网页做小了一些。挖安卓手机版考虑到了移动用户的应用场景，不仅看起来简单，而且使用起来高效。

要理解的层次太多了；就算能看懂，关卡多了用起来也不方便，所以:手机能不跳不跳吗？那我们就来讨论一下有没有办法减少跳跃…

对于从列表页打开详情页的情况，之前的Googlereader方法比较典型:

马上在网页里，没有进入详情页，当然也不会有人工进入然后返回。

Google把进入详情页的问题，网页之间的导航栏问题，变成了网页内部的导航栏问题。所以它的网页导航栏有一个小问题:打开一篇文章后，好不容易看到一半，不想看了，想往下滚或者往上滚。(自然，这也来源于原本为PC设计的网页。)还可以。没必要解决这个问题。谷歌阅读器将被关闭。

然而，这种设计方案并不是谷歌阅读器独有的。在同类网页中进行的产品，或许可以在自己的网页中独立进行一些独特的导航功能，让客户在进行文章滑动到中间的时候，可以立即折叠文章。

将“转到详情页”改为“在当前页面继续”，这是专业列表-->:详情页用于这种情况。前面提到的新浪微博，用这种方法似乎解决不了任何问题。其实很难保证你处理的大部分产品都能在单页上拿下。

不会跳就尽量不要跳。如果一定要，一定要跳吗？

如果非要跳，可以假装不跳。

还有很多这样的案例:

假装不跳。例1:Feedly的细节浮动。

点开之后就闪了出来。点击左箭头按钮，或者在详细信息页面上点击所有未连接的部分将其收起。

把这种方法理解为打开d出对话框，也许还行，那就是十恶不赦的简化对话框。实际上，传统的进入详情页的方式可以看作等同于简化对话框，也就是说，简化对话框的定义在今天的设计方案中已经没有那么有意义了。(诶，这个话题的讨论好像很复杂，要独立拿出来好好聊聊。这里就不说了，这里括号里的就不理解了。)

如果把这种方法理解为一种更艺术化的呈现细节信息的方式，那么看起来还是挺赏心悦目的。原来的列表页好像没有褪色，只是被遮住了。详情页的打开就没那么让人担心了。

这种方法更像是点开手机新浪微博里的一张图片，马上闪现出来，再点开图片还原。

假装不跳。在示例2:路径中上下拖动。

点击一个标签，把右边的网页拖回来，实际上跳转到了那个网页，但是那样的话跳转看起来更像是滑动，而不是离开当前页面来到另一个页面。

另外，滑动到feeds网页，点击某张照片，就是新浪微博中照片浮动的实际效果，也就是说feedly的浮动细节。x，组合策略~

假装不跳例3“我”的旋转。

“我”网页的外观是翻过来的，而不是当前页面的反面。

这种特殊的方法，虽然不能减少网页之间的跳转，但是让跳转不那么粗糙，更生动，更好理解。他们共同的想法是让当前页面和整体目标页面的连接更加相似。整个目标页面覆盖当前页面；整体目标页面将当前页面推到边上；整个目标页面位于当前页面的反面。

重要的是，商品的结构要更简单。

如果应用这种主要的表达方式，能否解决最初新浪微博的连续跳转问题？也许有些帮助，但是到了极端，也许也开始怀疑人生。

再次点击feedly详情页的链接，还是要按照规则打开html页面。上面的其他例子也类似。换句话说，这种巧妙的设计方案只能解决相对有限的网页关联层面。

我自然不同意用现在的局限性作为设计产品的依据。产品该做什么，不该做什么，还是要根据总体目标，应用场景，客户的日常任务。手机的局限性或许可以理解为:在这样的局限性下，我们别无选择，只能做出“以客户为中心的设计方案”。

关于锚点的文本

锚文本通常用于长网页，内部链接应该用于创建页面内文件的目录。点击文件目录跳转到文本的相对部分，如“回到顶部，在控制模块之间跳转”等。

关于锚文本，可用性研究大师雅各布·尼尔森(JakobNielsen)看过一篇名为《避免页面内链接》的文章，文章对锚文本进行了反驳，认为其损害了网页的身心健康。最典型的例子就是“重回巅峰”。抵制的原因大致可以概括为:

影响客户对网页的访问；

我觉得没必要。一个电脑浏览器或键盘就足够了；

实际 *** 作结果不成立，客户对“顶”的认知能力不固定；

就手机WAP页面而言，由于很多手机不兼容脚本，很多情况下只有客户期待的电脑浏览器才能快速跳转。对于功能键机来说，焦点跳转会很痛苦。现在很多WAP都尝试应用了锚文本，比如一些新闻网站，数据量很大，网页很长，锚文本的重要性已经得到了深刻的体现。

锚文本的两种使用方式

目前，锚文本应用有两种主要类型:

1.控制模块之间的快速跳转

跳到顶端

优点:网页太长，这种快速跳转可以减少功能键的工作。

缺陷:整体目标位置传输不显著，客户无法预测跳跃后焦点会落在哪里；

受限于手机屏幕大小，客户无法把握全局，跳完会失去方向感；

同样，对于百度搜索网页来说，因为向客户显示几个结果列表，所以网页会更长。所以适当的应用锚文本会减轻客户的实际 *** 作压力。

锚文本在百度搜索网页中的应用

一般来说，百度搜索网页的功能划分有两种情况:在百度搜索列表的顶部和在百度搜索列表的底部。以下是两种情况的优缺点。

1。功能分区在百度搜索列表顶端

顶部功能分区的焦点切换顺序

优点:有利于反复选择。如果一个客户要选择“拱墅区吃喝玩乐”或者“杭州商城系统”，先选择其中一个标准，待页面刷新后再选择网页顶部的其他标准，方便实际 *** 作。

缺陷:每次页面刷新后，焦点是第一个会停在网页的链接。客户必须走很长的路才能到达搜索列表。这时候只期望手机本身实现连接焦点的顺序，结果很不可控(很多手机不兼容快跳，也不是所有客户都掌握了这个角色)。

2。功能分区在百度搜索列表的底部

优点:页面刷新后，客户可以直达结果列表；在网页的顶部；

缺陷:反复选择的成本会越来越高。页面刷新后，客户必须绕过结果列表，到达网页底部，进行实际的选择 *** 作。

底部功能分区的焦点切换顺序

如何在SERP网页中平衡效果和结果

本次重做的服务宗旨:

平衡SERP网页上列表结果和“选择区”的优先级(对于每个找店铺的人来说，前者高于后者)；
尽量避免页面刷新的频率，所以不选择连接html页面的方法；

最后的优化方法是:

在百度搜索页面的列表中添加一个ps笔，当客户不得不再次选择时，链接到选择功能分区。
当客户不使用时，立即忽略这个焦点，到达结果列表。
为了提高客户跳后的方位感，ps笔入口的视觉效果表现的设计方案要和选择功能分区的设计方案一样。

百度搜索页面锚文本焦点转换顺序

摘要

在Wap网页制作中，由于电脑浏览器或硬件配置的限制，需要应用锚文本。此外，还应注意以下几点:

为客户平衡百度搜索和功能分区的必要性，在适当的地方发布锚文本。

找出客户在重用锚文本时的具体意图，用有既定意义的创意文案传达。

为了提高跳跃后的方位感，可以统一ps笔位和整体目标位置的视觉效果表现形式。