Роль иллюстраций на сайте

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

Иллюстрации в целом украшают текст. Их наличие помогает более полно и быстро воспринимать информацию: есть вещи, которые невозможно описать на десяти страницах, но можно объяснить одной иллюстрацией. Есть разные подходы к тому, какие размещать иллюстрации: кто-то считает, что любая картинка украсит текст, и приводят в подтверждение данные о том, что иллюстрации на 50 % увеличивают вероятность того, что посетитель воспримет текст с экрана и прочтет его. Мне же кажется, что иллюстрации должны нести еще какую-то пользу, кроме того, чтобы «просто быть».

Скажем, на сайте информационного агентства событие проиллюстрировано изображением клавиатуры и монитора. Это сигнализирует о том, что новость относится к компьютерной тематике, а изображение денежных знаков — что новость относится к повышению цен, зарплат или к банковской сфере. Однако такое «сигнализирование» задача не иллюстраций, а иконок — графических элементов оформления сайта (в данном случае, оформления новостных разделов). И вообще говоря, если новость не может быть снабжена фотографией «с места происшествия», то лучше ничего не помешать, обратное говорит посетителям о плохой работе агентства. А то представьте: размещается новость о выборе нового президента страны, но поскольку фотографии президента в распоряжении информагентства не оказалось, то размещают фотографию первого попавшегося мужчины.

Чтобы точно понять, какие размещать иллюстрации, нужно понять, во-первых, нет ли каких-либо подсказок об этом в самом тексте — понятно, например, что если речь идет о персоне, то ее портрет будет более чем уместен. Еще подсказки, какие могут быть иллюстрации и их подписи, можно найти в таблице в конце статьи. Во-вторых, нужно развивать в себе умение делать полные (но не избыточные) с точки зрения информативности подписи. Полнота означает уместное включение в подпись изображения ключевых словосочетаний, по которым вас или вашу продукцию могут искать в Интернете, а это имена персон, название компании, адрес, город нахождения или регион влияния, сертификация как конкурентное преимущество или необходимое условие сотрудничества (например, ISO 9000) и т. п.

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

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

Иногда встает вопрос (а иногда, к сожалению, нет) — а как может помочь размещение фотографии какого-то промышленного продукта, например, пластиката, удобрений, металлопроката? Нужна ли такая фотография? Не надо в этих вопросах руководствоваться исключительно своим здравым смыслом.

Наш здравый смысл ограничен жизненным опытом, и далеко не всегда наш жизненный опыт может дать ответ на такой частный вопрос, нужна ли покупателю металлической трубы ее фотография, и какая именно. Мы можем считать, что не нужна, поскольку никогда не покупали и не продавали трубы (например, работая в студии веб-дизайна) — для нас все трубы одинаково круглые.

Но опытные продавцы и покупатели металлических труб скажут вам, что по фотографии трубы можно понять очень много: качество материала (значит, нужен крупный план, на котором видна зернистость), вид соединения (значит, нужен крупный план, на котором видна конфигурация соединения) и пр. И часто покупатели запрашивают у продавцов до покупки фотографии продукции, на которых видны все интересующие их детали. А производитель химической продукции скажет вам, что его покупателю важна фасовка и вид упаковки, размер и внешний вид гранул вещества — значит, нужна серия фотографий со всеми видами фасовок и упаковки и, соответственно, гранул и т. п. Понятно, что для таких «рабочих» иллюстраций совсем не нужно, чтобы на гранулах играли блики или они мультяшно пересыпались: искусство не должно побеждать разум.

Вывод простой: о необходимости и качестве иллюстраций спрашивайте у тех, кто каждый день продает и покупает трубы и прочую продукцию, товарные страницы для которых вы разрабатываете (пишете). А ваше дело — использовать эти сведения для лучшего понимания потребностей заказчиков и стратегического продвижения продукции через подписи к ее изображениям на сайте.

Информация Иллюстрация Подпись Пример
Каталог продукции Фотография продукта, коммерческая иллюстрация(на товарной странице) Полное наимено­вание продукта «Встраиваемый холодильник Siemens ki 26FA50»
фотография деталей, отдельных частей про­дукта Наименование де­тали + наименова­ние продукта + наименование про­изводителя + сфера применения «Труба артикул YYY, радиус 1.3 м. производства компании N имеет специальный стыковой узел для крепления при про­изводстве монтажа нефтепро­вода»
Общая фотография для то­варной группы, коммерческая иллюстрация Наименование то­варной группы «Встраиваемые холодильники»
Исследо­вание или опрос График, табли­ца, диаграмма Название исследо­вания, результаты исследования, короткие пояснения «Результаты исследования ин­тернет-аудитории России за июнь-сентябрь 2011 г.».«Прирост интернет-аудитории за первые три месяца 2012 г. составил 10 %, что на 5 % меньше, чем в 20011 г.»
Событие Фотография с места события Название и место события «Открытие сезона моржей в Екатеринбурге на Шарташе»
Событие Фотография значимой персоны Имя персоны и название учрежде­ния, с которыми она связана. Если люди изображены во время событий, в каких-то ситуа­циях — пояснения относительно ситуации, сделанных заявлений «В открытии сезона моржей на Урале принял участие директор компании «Металл Сервис Контракт» Степан Семемов»«Новый владелец английского футбольного клуба «Челси» Ро­ман Абрамович».«Мэр Екатеринбурга Л. Чернецкий объявил, что убытки от ущерба по обрушению моста по ул. Шевченко возместит компания N».

«Кандидат в президенты США Хилари Клинтон заявила во время встречи с избирателями, что американские войска долж­ны быть срочно выведены из Афганистана»

Фотография объекта (продукта. здания и т. п.) Название объекта и связанных с ним компаний, учреж­дений «Презентация нового автопогрузчика производства Урал- машзавода прошла на выставке промышленного оборудования в Китае»
Фотография учреждения Название учрежде­ния. связанные с ним обстоятельства. вид деятельности «Здание «Уралтрансбанка», где происходит выемка документов в связи с делом N».«Агентство N удвоило показа­тели по продаже контекстной рекламы за 2011 г».«Компания N, производящая химические удобрения для сель­ского хозяйства, открыла ещетри представительства: в Краснодаре, Уфе и Симферополе»
Координатыкомпании Карта проезда, фотография здания, офиса, торгового зала, склада. Назначение иллю­страции (карта проезда к…), название учреждения, адрес «Карта проезда к офису компании N по адресу: ул. Ленина д. 144. офис 911».«Торговый зал в магазине  компании N по адресу X».
Лицензии, сертификаты, награды т. п. Сертификат, лицензия, на­града Название серти­фиката. лицензии, награды и имя компании, номера лицензий «Президент компании N полу­чает сертификат авторизованно­го представителя компании А».«Компания N: лицензия Мини­стерства связи на предоставле­ние телематических услуг в Свердловской области №…».

Коммерческой иллюстрацией называется реалистичное изображение рекламируемого продукта — более реалистичное и четкое, чем фотография. «Коммерческая» составляющая заключается в том, что иллюстрация должна вызвать желание купить продукт, а не просто изображать его. Простая обработка (фотографии на низком разрешении, которое характерно для web, не передаст деталей, игру света и теней, не придаст «вкусности» продукту. Поэтому фотографии дорисовываются вручную: прорисовываются мелкие детали, делается цвет, свет, ретуширование, добавляются блики и т. и. Понятие «Коммерческой» иллюстрации за пределами веб, в полиграфии, существует давно как отдельный жанр графики. Включает не только дорисовку фотографий, но и художественное изображение рекламируемых предметов. Хрестоматийные примеры — плакаты 40-50 гг. в жанре «Пейте Coca-cola». Однако к фотографиям доверия больше: они говорят о том, что объект существует в реальности.