(翻译)图片缩放模式(Image Zoom)

问题概述

  用户想放大图片以便在更高分辨率下查看细节信息。

示例

这里写图片描述

用途
  • 用于当正常尺寸显示的图片分辨率不够高,用户无法了解图片中的细节信息时;
  • 用于当下载全部图片的全尺寸及详细版文件比仅下载感兴趣图片的同样文件占用更多带宽时[1];
  • 用于当显示图片的全尺寸及详细版文件不符合网站设计思路时;
  • 用于当显示图片的全尺寸及详细版文件妨碍用户概览图片时;
  • 用于当下载每个图片的全尺寸及详细版文件所花的时间与给用户的价值不成比例时。不是所有的图片对用户都有相同的吸引力,仅在需要时才显示高分辨率图片。
解决方案

  提供方式让用户能缩放图片以便查看图片的细节信息。
  从服务商的角度看,重要目标之一是仅在需要时才加载高分辨率的图片,不要预先加载,这样才能节省带宽。
  一种直观的方法是允许用户点击图片上任意位置,用户点击图片进行放大,网站就预加载该图片的高分辨率版本文件。
  在图片上提供图形或文本方式的放大方式,仅是图片本身并不支持缩放功能[2]。

说明

  允许用户放大图片,探索图片中的细节信息。考虑到缩放因素,一开始就显示整个高分辨率图像无法让用户概览整个图片,因此用户也无法了解图片细节信息的背景[3]。
  有了图片缩放功能,用户可以放大图片上其感兴趣的某片区域,这样就不会被图片上的其它细节信息所干扰。

原文地址:http://ui-patterns.com/patterns/ImageZoom
[1]原文:Use when downloading full-sized and detailed versions of a all images takes up more bandwidth than you’re interested in sharing.
[2]原文:Provide graphics or text about zooming in on the image; a bare image will not suggest zoom functionality to the user in itself.
[3]原文:Depending on the zoom factor, showing the entire high resolution image from the beginning will not provide the user with an overview of the entire image thus removing the context of the details viewed.

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值