Сегодня:
Блог: "Основы сайтостроения и веб дизайна"
сайтостроение

Переход на: Главная / Веб дизайн /

Изображения для сайта. Подбор и оптимизация.

АвторАвтор: aklychin

Дата добавленияДата добавления: 02.03.2017

Число просмотровЧисло просмотров: 3054


Здравствуй, уважаемый посетитель! Продолжаем рассмотрение темы веб дизайн сайта. Сегодня я хочу поговорить о компьютерной графике, используемой на сайтах. Графика это прекрасный инструмент в руках умелого дизайнера. Благодаря графике усиливается визуальное восприятие ресурса. Отдельные элементы графики используются для опровождения текстовой информации, что помогает лучшему общему ее восприятию.

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

Как подобрать изображения для сайта?

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

Уникальное изображение на сайте это не только фотографии, сделанные вами, но всевозможные фото коллажи, созданные при помощи фотомонтажа, рисунки, фоны, выполненные в графическом редакторе. Таким образом, используя уникальные изображения на сайте, вы сможете создать особенный, индивидуальный образ вашего проекта.

Изображения для сайта.  Подбор и оптимизация.

Еще одной причиной, использования уникальных изображений на сайте, является факт, что к продукту, созданному своими руками, совершенно иное отношение. На него хочется смотреть постоянно и это не надоедает. Такое положение вещей позволит заниматься проектом долгое время, а не бросить его, после первой неудачи.

Как же подбираются изображения на сайт? Основным критерием подбора графических изображений для сайта является критерий тематической совместимости. То есть графика должна дополнять, а в отдельных случаях даже разъяснять текстовую информацию. Красивые картинки не связанные с тематикой отвлекают посетителей от материала, который вы намерены донести.

Очередным критерием, подбора изображений на сайт, следует считать фактор целостности композиции. То есть каждое изображение на странице должно выполнять определенную функцию, а не дублировать функции другого. О чем идет речь?

Изображение может быть основным или дополнительным. Основное несет в себе идею отдельной страницы или всего сайта в целом. Соответственно дополнительное сопровождает отельную мысль страницы или определенного текстового участка. Таким образом, отводя каждому изображению, размещенному на сайте, свою роль вы соблюдаете логическое построение сайта, помогаете ориентироваться в предложенных данных посетителям.

Большой ошибкой подбора изображений на сайт может стать проблема перенасыщения ресурса графикой. Такие сайты разработчики часто называют «веселые картинки». Не менее проблематичным является злоупотребление анимированными изображениями, которые с появлением технологии флеш, все больше стали встречаться на страницах сайтов. Еще раз хочу повторить, посетитель на ваш сайт, приходит за информацией, поэтому главной целью сайта является возможность ее предоставления, а не подборка, может быть качественных, но иногда назойливых изображений.

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

Обработка изображений для сайта.

Мы рассмотрели вопрос, критерии подбора графики, вкратце повторим. При подборе стоит учитывать, такие моменты:

  • • Изображения должны соответствовать тематике сайта;
  • • Изображения не должны нарушать целостность композиции;
  • • Изображения не должны перегружать страницы сайта;
  • • Не стоит злоупотреблять анимированными изображениями;
  • • Изображения не должны нарушать цветовую схему сайта.

Обработка изображений для сайта.

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

Процесс обработки графики, то есть подготовки выбранных изображений для сайта, проводится при помощи специальных компьютерных программ предназначенных для работы с графикой. Наиболее широко применяемая программа – это Adobe Photoshop, которой пользуется подавляющее число веб разработчиков. Кстати текстовой и видеоинформации, по работе с данной программой, в интернете предостаточно, поэтому освоить ее на уровне пользователя не составит труда. Прочитать о возможностях Adobe Photoshop вы так же сможете в моей статье «Adobe Photoshop в веб дизайне».

Вернемся к обработке изображений для сайта. Процесс обработки можно разделить на несколько этапов. К ним относятся:

1. Размер изображения для сайта.

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

Размер изображения для сайта

Если приходится значительно изменять размеры или один размер, тогда стоит использовать, часть изображения, вырезав ее из основного. Такой способ позволяет сохранить пропорции и относительный масштаб изображений для сайта.

2. Подготовка изображения.

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

3. Создание оригинальных иллюстраций.

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

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

4. Формат изображения для сайта. Установка параметров, которые поддерживает выбранный формат.

Подробно форматы файлов для хранения изображений расписаны мною в отдельном разделе блога «Графика для сайта». Ознакомившись с материалом данного раздела, вы поймете, в каких форматах необходимо хранить изображения, за что отвечает и как влияет на размер, качество каждый параметр выбранного формата.

Обработка изображений для сайта.

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

  • • Целостность тематики;
  • • Скорость загрузки страниц;
  • • Сохранение общей стилистики;
  • • Привлекательность;
  • • Посещаемость.

На этом, пожалуй, все. Читайте мой блог, дальше будет еще интересней.

Поделиться

Добавьте Ваш комментарий и оцените статью:

+ Добавлять комментарии и оценивать статью могут только зарегистрированные пользователи. Если Вы регистрировались, то просто авторизируйте свой аккаунт.


Комментарии к данной статье:


Подписаться на обновления блога

монетизация сайтаРеклама
заработок на сайтеПомощь

Понравился проект?

Внесите вклад в его развитие, пожертвовав любую сумму на один из кошельков:

Z255632435111

R174106546724

Деньги пойдут на оплату серверов, зарплату авторам уроков и развитие ресурса.

В примечании к платежу укажите Ваш email или логин на нашем проекте.

Администрация.

Статистика блога:

Статей: 107

Комментариев: 8

Зарегистрировано: 15

Все права защищены сopyright © Блог - "Основы сайтостроения и веб дизайна" 2012 - 2017