Зачем оптимизировать изображения для сайта
Оптимизировать изображения для сайта не только желательно, но и необходимо.
Во-первых, потому что вы платите за место на сервере, отведенное для вашего сайта. Неразумное использование этого места (загрузка изображений большого веса) приведет к тому, что вам придется переходить на другой хостинг-тариф, чтобы получить дополнительное место на сервере. А это и дополнительные расходы и время потраченное на переписку с техподдержкой.
Во-вторых, посетителю сайта придется потратить больше времени, чтобы дождаться пока загрузится "тяжелое" изображение. И, к сожалению, не каждый посетитель готов подождать, а кому-то просто не позволяет скорость интернет-соединения в разумные сроки дождаться загрузки большого изображения.
Поэтому, сразу как у вас появился сайт нужно научиться оптимизировать изображения.
Как оптимизировать изображения для сайта
Оптимизировать изображения для сайта. Шаг 1. Понизьте разрешение изображения до оптимального уровня - 72 пикселя на дюйм. Именно такое разрешение используется для веб.
Оптимизировать изображения для сайта. Шаг 2. Обрежьте изображение до нужных размеров. Если вам нужна фотография шириной всего 500 пикселей, а исходное изображение имеет ширину 700 пикселей, лучше потратить немного времени и сжать его до нужных размеров. Так вы не только сократите время загрузки изображения и сэкономите место на сервере, но и будете уверены, что изображение будет корректно отображаться на сайте. Поскольку фотография сжатая прямо на сайте может некорректно отображаться в браузере Internet Explorer (мелкие детали, например, надписи на фотографии могут стать нечитаемыми).
Оптимизировать изображения для сайта. Шаг 3. Воспользуйтесь программной функцией оптимизации изображения, папример, в фотошоп это file - save for web. Эта функция позволяет корректно и эффективно оптимизировать изображение. Переведите изображения в нужный формат, в большинстве случаев оптимальным вариантом будет JPEG с возможностю настраивать качество изображения (Maximum, Hight, Medium, и т. д.).
Для изображений с прозрачными элементами подойдет PNG и GIF.
PNG-8 поддерживает прозрачность изображения 0% или 100%, (все уровни прозрачности между этими цифрами будут автоматически доведены до прозрачности 0% путем добавления белых пикселей).
PNG-24 поддерживает все уровни прозрачности, но "вес" таких изображений, разумеется, будет несколько больше).
GIF, аналогично PNG-8 поддерживает прозрачность только 100%, но чаще дает более "тяжелое" изображение, чем PNG-8, поэтому от формата GIF можно смело отказаться в пользу PNG-8.
GIF - способен воспроизводить анимацию.
Какой программой воспользоваться, чтобы оптимизировать изображения для сайта
В качестве графических редакторов для оптимизации изображений можно использовать, например,
Для пользователей операционной системы Windows - PhotoShop (популярная программа из пакета Adobe).
Достоинства этой программы: огромнейшие возможности и функционал под любые задачи.
Недостатки - программа платная.
К счастью, фотошоп - не единственный графический редактор на Земле. И для решения таких простых задач как оптимизация изображений для web можно подобрать бесплатную утилиту, например, IrfanView. Она имеет достаточно просто интерфейс, который с дегкостью освоит любой пользователь.
Для пользователей опереционной системы Linux - GIMP.
Достоинства - огромные возможности, интерфейс очень похож на популярный Фотошоп. Программа распространяется свободно.
Примечание:
- выкладывая на сайт уникальные фотографии и изображения, помните о защите авторских прав
- добавляя изображения на сайт, помните о важности заполнения поля "название изображения" и теге Alt (альтернативный текст).