至于如何解决垂直tab容易令人产生困惑的问题，我想京东的设计也许是个启示。在“支付及配送方式”栏目下（该页面有很多栏目）点击“来京东自提”的选项，下面就会出现“选择自提点”的操作，由于针对这部分的提交按钮处在该栏目内，而不是栏目外面，这样用户就不会误认为这个提交按钮针对的是该栏目内所有选项中的内容了。在该页面所有模块的最下面，才会出现该页面最终的提交按钮。

但是这样又会引发新的问题，即我在之前的博文中提到过的一个页面出现过多的提交按钮并不是什么好事，明白的用户会增加操作次数，不明白的用户会导致误操作。

再看淘宝的页面，没有出现多个提交按钮，内容也很清晰，不至于引起混淆，这是因为：1.可选项没有以标签的形式存在（一般标签都出现在最左侧）；2.选项的文字提示很清晰，能清楚表明选项间是互斥关系。

总结：

水平tab和垂直tab都并非完美，设计时要考虑到选项互斥的问题。

如果提交按钮是针对多个tab下的内容，建议使用垂直tab，同时把提交按钮放到tab包含的内容区域外。

如果提交按钮是针对一个tab下的内容，即tab间是互斥的关系，建议使用水平tab，同时尽量把提交按钮放到tab包含的内容区域内。

如果提交按钮针对的是整个页面的内容及其中一个tab下的选项，则还是应该放在所有内容之外（最下面），同时注意下面三点：

1. 标签一般在最左侧，不要把互斥tab做成标签的样式，而是要做成标签下的选项。
2. 如果tab间是互斥的关系，tab上的文字尽量清晰表达出互斥的关系。
3. 尽量不在一个页面上放过多的提交按钮。

原文：http://blog.sina.com.cn/s/blog_453d02200100sl7n.html

本文链接：http://www.blueidea.com/design/doc/2011/8378.asp　

出处：legene的交互设计博客
责任编辑：bluehearts

上一页 令人纠结的表单设计:水平Or垂直? [3] 下一页