网页中照片预览导航设计技巧
导航并不只是指常位于网站头部的导航条,路边的指示牌、商场的指示牌等等都是一种导航,可以说导航在生活中无处不在,如果没有这些导航存在,那么我们将迷失,迷失在互联网信息的海洋中,迷失在纵横交错的马路上,迷失在琳琅满目的商品货架之间。 在所谓的WEB2.0风潮疯狂的从国外吹入国内的时候,国外一些成功网站的成功模式也疯狂的吹入到国内的模仿者的眼前。目前在国内关于网络相册方面或者时尚一点是说关于WEB2.0网络相册方面做得比较好的应该算是yupoo了,同时它也是国内模仿flickr模式最像的最成功的——事实上yupoo几乎就是另一个语言版本的flickr。抛除商业运营等其他因素,仅仅来比较一下两者关于照片预览导航系统(不知道正确的叫法,就自己为其命了个名)上的不一样之处,或者是说两者在对用户使用方式的理解上的不一样之处。 从上图中可以看出flickr相册的照片预览导航系统相当的简洁,只有“上一张”与“下一张”照片的缩略图链接还有当前相册中照片的总数以及一个以幻灯片播放的按钮,当前照片的缩略图在预览导航中是没有的。再看下面yupoo的截图,在预览导航中多了当前照片的缩略图少了当前相册中照片的总数。 先不说当前照片的缩略图应不应该出现在预览导航里,光yupoo没有在预览导航上标出当前相册里照片的总数这一点就说明了它的失败。 而当前照片的缩略图是否应该出现在预览导航里呢? yupoo的照片预览导航系统是完全按照网站的导航系统来设计的,在网站的导航系统里,用户需要知道自己当前在哪个地方或者是哪个栏目下,这时候导航系统就需要标示出这个地方或者是栏目来给用户提示,这样用户才不至于迷失在网站繁杂的信息里。 其次,导航系统的真正作用是引导用户及标示位置,而既然照片预览导航不需要标示位置,那么照片预览导航系统所剩下来的作用就是引导用户——引导用户点击导航系统上的缩略图以查看照片。这时候问题就会出现,如果不细看预览导航上的缩略图,鼠标直接点击下去,很有可能点中的就是当前照片的那个缩略图,点击后用户会发现还是当前的照片,查看原因之后用户才会明白,中间的那个缩略图是当前照片的缩略图——点击下去后还是当前照片,也就是说这个缩略图等于是没有用的。既然没用,为何还要存在? 最后,一样的空间,当空间里的物品摆放多了,每个物品所占的空间自然就少了。照片预览导航最成功的一点就是在导航上显示的是照片的缩略图而不是文字,让用户可以很明白的知道相近两张照片的大概形状。所以如何保证缩略图的清晰度就成了预览导航真正的关健所在。当照片的尺寸越大时,缩略图的清晰度就越小,甚至最终会模糊成一团,这时候就需要提高缩略图的大小尺寸,可是预览导航的大小是限定的,所以去掉当前照片的缩略图可以让相近两张照片的缩略图更加的清晰。 从细节处体贴用户,才是产品成功的关健! |
- 上一篇:html5 如何实现客户端验证上传文件的大小
- 下一篇:CSS选择器总结