Несколько советов по оптимизации веб-изображений

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

Выбор подходящего формата

Как правило, используется три типа файлов: JPEG, PNG и GIF, и тот факт, что JPEG всегда имеет меньший размер, вовсе не означает, что его нужно использовать каждый раз. При уменьшении качества до 30% картинка заметно искажается, хотя при 60-100% изображение остается чистым. Такой формат больше всего подходит для фотографий, так как их многочисленные цвета не теряются при сжатии.

Что касается PNG, этот формат предпочтителен для файлов главной темы, т.к. в этом случае поддерживается прозрачность. Но при сжатии на картинке становятся видны «точки». Та же проблема актуальна для GIF формата.

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

  1. Нужны высококачественные изображения? Тогда нужно использовать JPEG с качеством 80% или PNG-24 (второй вариант идеально подходит для прозрачных картинок).
  2. И GIF, и PNG-8 хорошо подходят для маленьких файлов, но первый отлично работает с минимальным количеством цветов, а второй поддерживает множество оттенков.
  3. Если нужны прозрачные изображения, выбирайте PNG-24: он обеспечивает более плавные края, но слегка увеличивает размер файла.

Решение для сайтов на WordPress

Есть один замечательный плагин под названием WP Smush.it. Он выполняет всю тяжелую работу за пользователя, т.е. удаляет ненужную информацию, что оптимизирует сжатие JPEG файлов. При конвертировании GIF и PNG также удаляются ненужные цвета.

Используем более одного сервера

Поскольку нужно загрузить множество компонентов веб-сайта, включая JavaScript, HTML и изображения, есть смысл хранить тяжелые файлы где-нибудь в другом месте. Например, Сеть Доставки Контента (CDN) позволяет хранить данные безопасно, делая при этом их доставку конечному пользователю быстрее.

CSS спрайт

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

Зачем мне это нужно?

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

02.08.2016
Поделитесь ссылкой в соц сетях:

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

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

Добавить коментарий

Авторизоваться:
Анонимно

Нет времени ждать. Закажите выделенный сервер сейчас.

Благодаря нашей сети суммарной пропускной способностью свыше 1400 Gbps вы сможете узнать, что такое по-настоящему быстрый отклик. Мы следим за шириной канала провайдеров, точками обмена трафиком и инфраструктурой сети, что позволяет избежать даже минимальных прерываний в работе.
Надежность работы обеспечивается качественными аппаратными решениями Dell и Supermicro - ведущими производителями серверов.


Получить 2 месяца по цене 1 Консультация эксперта
Наши дата-центры подключены к сетям:
  • 20 x 10GE Level3
  • 22 x 10GE GlobalCrossing
  • 20 x 10GE Telia
  • 3 x 10GE Deutsche Telecom
  • 20 x 10GE Tata Communications
  • 60 x 10GE IPTransit

Также Вам может быть интересно!

Как сохранить высокую пропускную способность: 10 Простых Советов

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

5 Наиболее часто задаваемых вопросов о CDN и ответы на них

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

Насколько важно качество веб хостинга

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

Типы веб хостинга: какой лучше для вас?

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

Networks Connected