Использование изображений на сайте

Использование изображений на сайте

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

  • фоновые изображения;
  • иконки;
  • картинки;
  • и т. д.

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

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

Основные способы добавления изображении на сайт

Наиболее распространёнными и правильными являются два способа добавления различных изображений на веб-сайт:

  • с помощью специального HTML-тега <img src="/images/photo-1.jpg" alt="Изображение 1">;
  • с помощью css-свойства background-image:url('../images/photo-1.jpg');.

И в том и в другом случае помимо добавления строчек кода не стоит забывать о загрузке изображения на сервер.

Правильное использование изображений

Пропорции изображения

Если на сайте под картинку отведён блок определённого размера, например, 300х200 пикс., а реальный размер картинки 350x200 пикс,, то желательно сначала обрезать картинку до размера 300x200 px, а после добавить на сайт.

Объём изображения

Современные фотоаппараты способны делать снимки очень высокого разрешения, занимающие большой объем памяти. В тоже время программы по работе с изображениями позволяют уменьшить размер изображения и увеличить степень их сжатия. Поэтому перед добавлением на сайт картинки, имеющей объем, к примеру, 7 МБ, сожмите её до 100 кБ – 1 МБ.

Формат изображения

Важно выбрать правильный формат изображения. Например, для фотографий желательно использовать формат JPEG, для рисунков — PNG.

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

Уникальность изображения

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

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

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


Похожие статьи

Внутренняя перелинковка сайта

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

Продвижение с помощью статей

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


Комментарии