标题栏高度适宜.PPTVIP

告诉用户我在哪里 ——手机界面导航设计 告诉用户我在哪里，旨在解决在信息的海洋里迷失的困惑，论文主要论述了手机界面导航设计的一些常用方法，提到了面包屑导航、商品分类列表等，揭示用户的所在位置。 通常在我们逛商场的时候，往往是从一进门开始，就能看到脚下有清晰的地标，楼梯口有楼层商品类型索引，某些路口还会有微型地图指示牌。这些元素都是为了达到同一个目的，就是告诉用户 “我在哪”。 图1 ：商场的商品分类和楼层排布指示牌 我们需要通过一个合理的方式告诉用户： 我在哪里？ 我能干什么？ 我要去哪里？ 我去过哪里？ 1.合并的面包屑 面包屑是web产品设计中的一种导航形式的代称，它让用户对他们所访问的网页处于什么样的层次结构一目了然，提供给用户返回之前任何一个页面的链接，它不仅可以告诉用户在哪里，还能清晰的展现你所处的层级。它们绝大部分看起来就像这样：首页分类页次级分类页。 什么是面包屑？ 本质上，它是网站结构的线性表示。Web上的定位面包屑路径所展示的不是导航的历史，而是在整个网站中某个固定的位置。 Google手机版在搜索框旁边有个双括号样式的按钮， 用来进行搜索类型切换和搜索结果筛选的。 有点山寨的聚合面包屑，根据具体产品来做判断， 是否你的产品需要从子页面快速跳转到父级页面， 且网站有多个父级页面 2.带有标识的导航 设计导航的时候要明确这样两个前提“使用这个产品的用户想得到什么？”“我们希望用户能够得到什么？”。一旦这两个问题有了答案，那么我们就应该在设计产品的时候把用户需要的东西呈现在他们面前，或者通过引导让用户使用我们推送给他们的功能。 图4 :Mashable会用蓝色背景色区隔出当前所在标签页 Mashable Facebook则用一个扩大了的透明框区隔出当前标签页，前一幅图处于HomeNews feed，后一幅图处于FriendsStatus，和Mashable蓝色背景色区隔略有不同。 VS Facebook 3.横向扩展的分类列表 一些购物网站的商品分类非常多，每个分类下边又有多个自分类，在互联网上往往是在页面左面有个索引区，比如卓越网的商品分类列表。 图9：卓越的商品分类放在页面左上角，一级分类直接显示，二级分类鼠标划过的时候才显示，醒目而且清晰。 那么是否可以把这种模式应用到手机上呢？韩国互联网公司Naver成功地将其应用到了手机上。 Naver的News客户端，把新闻的一级分类做了横向滚动的tab列表，二级分类放在一个按钮后面，触发之后弹层选择子分类。 手机上如何解决呢？ 4.躲在按钮后面的菜单 如果是从互联网到手机端的迁移，可以把网站的首页做成一个页面，分类页面放在一个Menu按钮后面。 Trey Songz 点击menu后出现手机站点其他模块得入口 5.统一的入口 为了不迷路，还有一个比较好的办法就是在产品首页提供各个子模块的统一入口，到了子模块后可以通过返回按钮回到首页，再从首页进入另外一个模块。这种设计一般用在产品的模块比较独立的情况中，常见两种设计方式： 九宫格式： 抽屉式： Designzilla采用抽屉式设计，首页提供六个入口，用户通过这些入口进入任何一个子产品之后，同可以通过返回按钮返回到首页，再进入其他入口。 6.清晰的标题 Android 优：标题栏窄，相对于iPhone可以放更多的文字 缺：因为标题文字小，而导致看不清楚 Android客户端的标题区 优：标题栏高度适宜，标题文字可以用大字号 缺：由于标题栏同时还会放置一些操作按钮，导致标题常常放不下，需要缩略 iphone客户端的标题区 注意规避： 滚动的标题——因为标题放不下，而让标题去滚动循环，这只有在歌曲播放歌词循环的时候可行，在内容阅读的时候最好不要，干扰视线不说，还基本上很难一眼看明白标题，不如缩略处理. 面包屑标题——把面包屑放在标题上，不能点击。如果客户的有个很好的架构的话，基本上通过带标识的导航和当前页面的标题就能判断位置了，标题中含有面包屑且不能点击，这个面包屑的意义就不大了. 重复的标题——如果内容页内容不同，最好不要都叫做“帖子浏览”“正文”“用户”之类的，而是应该抓取内容，帖子标题缩略、正文关键词、用户名等都可以当做标题.