Как правильно оформлять превьюшки (prewiew images)


Однажды трём слепцам дали потрогать слона, и спросили, на что похоже то, что они трогали. Один слепец сказал, что слон похож на змею, второй - что на дерево, а третий - что на стену. А вышло так потому, что первый ощупал хобот, второй - ногу, а третий - бок слона.

Превьюшки - это маленькие изображения, предназначенные для предварительного просмотра соответствующих больших изображений. Вот пример оформления превьюшек на сервисе Яндекс.фотки:

превью на Яндекс.фотках

Есть два основных способа оформления превьюшек: масштабирование и кадрирование. При масштабировании исходная картинка пропорционально уменьшается до нужных размеров (как на Яндекс.фотках), а при кадрировании - обрезается, как на превью портфолио дизайна сайтов студии Diogenes:

превью на Diogenes

В подавляющем большинстве случаев следует использовать первый способ. Масштабирование лучше подходит для оформления превьюшек фотоальбомов, галерей картинок и изображений, портфолио дизайна сайтов и полиграфии и т.д. Причина в том, что пользователь сразу должен увидеть картину в целом, а потом - рассмотреть детали: именно так работает наша психика и наше восприятие.

А вот при использовании кадрирования мы имеем ситуацию со слоном. Тем не менее, есть случаи, когда этот метод целесообразен:
1. Необходимо показать качество графики. Может использоваться при оформлении портфолио иллюстраторов или тех.дизайнеров (но не дизайнеров сайтов!)
2. Превью изображений, состоящих из однородных элементов. Например, если нужно показать превью орнамента паркета или бэкграунда для сайта, достаточно двух-трех повторений узора.
3. Превью изображений, имеющих большое количество мелких деталей, теряющих узнаваемость при уменьшении. Например, превью набора шрифтов.

В некоторых случаях возможен смешанный метод "масштабирование+кадрирование" - например, для создания одноразмерных превьюшек из непропорциональных исходных изображений.

Обсудить статью в моём ЖЖ: yanajy http://yanajy.livejournal.com/7588.html

Поделиться ссылочкой: