 水宿鸟

用户至上，关注细节，这是每一位产品经理都应该努力做到的。而对于细节和易用的拿捏，并不容易把握。今天跟大家分享一个案例，看看备受瞩目的苹果在safari浏览器中出色的细节设计。

这里要说的是浏览器标签的设计。

一、主流浏览器的四种Tab设计

依次为ie8、火狐、Chrome、Safari：

可以注意到，同样是在浏览器扮演重要角色的Tab，各个浏览器的设计都有所不同，到底谁家体验更好一些呢？我们来简要分析一下。

二、设计的优劣

1、ie8：

Tab默认显示的元素 有网页title 、favicon，在选中状态下会出现关 闭按钮。

这样的设计会导致一个麻烦，当在同一窗口下打开N个网页时，想关掉一部分就比较头疼了，需要一个个点开一个个关上，如果用户电脑性能不理想，这些操作将浪 费掉很长时间。win7下任务栏可以解决这个问题，但如果浏览器的操作任务还要借助任务栏完成，是不是有点可怜？

2、火狐：

Tab默认显示的元素 有网页title 、favicon、关闭按钮（根据宽度决 定显示）。这个设计的缺点同ie8， 而且更遗憾的是，因为默认情况下显示出关闭按钮，或多或少会导致一些误操作。

3、Chrome：

谷歌浏览器 Tab默 认显示的元素有网页title 、favicon、关闭按钮，类似火狐。 这里要说的是，谷歌浏览器在打开多个Tab时 的显示是很可怕的，举一个极端点的例子，看下打开数十个网页时的显示情况：

除去favicon和 网页title，这些标签就 像一堆一模一样的螺丝钉，要想在这里找出些什么来，实在太难了⋯⋯

4、Safari：

没有favicon， 标签的关闭按钮只在鼠标悬停时会显示出来。对于苹果来说，每个设计都散发着简单易用的气质。

当一个用户想去关闭一个Tab时， 首先要做的就是找到这个Tab， 这时鼠标就会自然移动到该Tab上， 顺而触发显示出关闭按钮，然后顺利的关掉它。这个小小的操作流程既没有走不通的地方，又留出了空间 、精简了页面，类似中国国画经典的留白之美。

得益这样的设计，用户可以在只看title不点开Tab的情况下关掉不需要的网页。

对于 Chrome多 标签的问题， Safari处 理的也很妥当，可以仔细欣赏一下safari多Tab时的下拉设计，里面其实还有很多东西可学。

三、一句总结

在完成功能的同时，尽量简化设计、易于操作。

┾━┾━━━━┄━━━━┄━━━━┄━━━━┄━━━━┄━━━━┄━━━━┄

本文由水宿 鸟De设计笔记首发，作者水宿鸟，BLOG 中任何文字、图像皆采用知识共享署名-非商业性使用-禁止演绎2.5中国大陆许可协议进行许可。商业网站、纸媒体如需转载，须经本人同意。欢迎非商业网 站、媒体转载，但必须注明出处和链接。违者皆构成侵权。E-mail:euloo#qq.com  QQ:287589972

我的腾讯微博地址是：http://t.qq.com/eulooo 欢迎收听。