Чтобы посетители вашего сайта получили самые лучшие впечатления, изображения на сайте должны загружаться быстро. В этом руководстве показано, как оптимизировать изображения, уменьшив размер файла и сохранив качество изображения.
Рекомендуемый размер изображения на сайте WordPress может зависеть от применяемых тем, макета и других факторов. Поэтому мы не можем дать вам универсальную рекомендацию. Как правило, устанавливается максимальный необходимый размер изображений, и это значение не может быть превышено.
Современные цифровые фотоаппараты и смартфоны позволяют получать высококачественные изображения в виде файлов большого размера. При отображении этих изображений на веб-сайте можно уменьшить размер файла более чем вполовину, сохранив при этом качество просмотра.
Чтобы узнать размер и параметры файла, перейдите на панель «Редактировать изображение» в библиотеке файлов, выполнив следующие действия:
- Откройте раздел Библиотека файлов на консоли вашего сайта.
- Щёлкните миниатюру изображения, размер и параметры которого требуется выяснить.
- Вы увидите рамку вокруг миниатюры и число в правом нижнем углу.
- Нажмите кнопку Редактировать.
- Размер и параметры файла отобразятся на панели «Редактирование».
Взгляните на изображение на своём сайте. Оно качественно выглядит, но медленно загружается? Если, к примеру, ширина изображения — 5000 пикселей, попробуйте уменьшить её до 2500 пикселей. Если изображение по-прежнему выглядит хорошо, попробуйте уменьшить его размер до 2000 пикселей или даже до 1800 пикселей в ширину, пока не найдёте оптимальное соотношение размера и качества.
В следующих разделах этого руководства показано, как уменьшать размер изображения с помощью различных инструментов.
Изменять размер изображений можно разными способами. В следующих разделах мы рассмотрим инструменты на вашем компьютере, онлайн-программы и более продвинутое программное обеспечение.
На компьютере с ОС Windows можно использовать Microsoft Paint. Откройте изображение в этой программе и нажмите Изменить размер в верхней части окна Paint. Вы можете уменьшить размер изображения в процентах и сохранить новую, уменьшенную версию.
На компьютере Mac можно использовать приложение Preview. Откройте изображение в приложении, нажмите «Инструменты» и выберите «Изменить размер».
Чтобы быстро уменьшить размер изображения, можно воспользоваться одним из множества бесплатных инструментов, например:
С помощью этих сервисов вы можете загрузить изображение, выбрать нужный размер и экспортировать новую версию. Обратите внимание, что эти сервисы не связаны с WordPress.com.
Приложение Jetpack может само оптимизировать изображения при публикации на веб-сайте. По умолчанию опция «Оптимизировать изображения» включена. Можно задать значение параметра «Максимальный размер загружаемого изображения», чтобы в процессе загрузки исходный размер файла изменялся автоматически.
Чтобы изменить настройки в приложении Jetpack для iPhone и приложении Jetpack для Android, выполните следующие действия:
- Войдите в приложение Jetpack на телефоне.
- Нажмите значок профиля в правом нижнем углу.
- Нажмите «Настройки приложения».
Вы можете отключить параметр «Оптимизировать изображения» (не рекомендуется) или настроить параметр «Максимальный размер загружаемого изображения». Значение по умолчанию — 2000 x 2000 пикселей.
Если вы хотите больше контроля над оптимизацией изображения, вы можете уменьшить размер изображения с помощью GNU Image Manipulation Program (GIMP), бесплатной альтернативы Photoshop, которая может быть установлена на Windows, Mac, Linux и других операционных системах.
Чтобы уменьшить размер изображения при помощи GIMP, выполните приведённые далее действия.
- Откройте изображение в программе GIMP.
- Щёлкните на панели инструментов вкладку Изображение, затем выберите «Размер изображения».
- В поле «Размер изображения» укажите желаемую ширину.
- Нажмите Изменить.
- Щёлкните Файл на панели инструментов. Затем выберите «Экспортировать как».
- Присвойте файлу имя с расширением .jpg.
- Выберите Экспорт.
- В открывшемся диалоговом окне задайте значение 60 (или другое желаемое значение) параметра «Качество».
- Щёлкните Дополнительные параметры.
- Измените значение параметра Подвыборка на 4:2:0 (четверть цветности).
- Нажмите Экспорт.
Далее представлено сравнение результатов. С помощью ползунка можно просмотреть изображение полностью.
Другие программные инструменты для редактирования изображений могут содержать простые и быстрые варианты изменения размера и сжатия комплектов фотографий.
Кроме того, можно воспользоваться веб-службами:
Если ваш тарифный план WordPress.com поддерживает плагины, вы можете воспользоваться встроенным ускорителем сайтов Jetpack (CDN) для автоматического ускорения загрузки изображений.
- Откройте консоль вашего сайта.
- Перейдите в раздел Jetpack → Настройки.
- Перейдите на вкладку «Производительность».
- Прокрутите страницу вниз до раздела «Производительность и скорость».
Плотность пикселей в дисплеях Retina намного выше, чем в обычных дисплеях, в результате чего изображения со стандартной плотностью пикселей могут отображаться нечётко. Во избежание этой проблемы на дисплеях Retina мы увеличиваем размер изображения вдвое, чтобы оно отображалось как можно чётче. Это возможно только в том случае, если размер изображения в вашей библиотеке файлов превышает его размер на сайте.
Даже при двойном максимальном размере экрана на вашем сайте файл изображения должен быть значительно меньше, чем при полном разрешении, используемом вашей камерой, чтобы вы могли оптимизировать свои изображения и обеспечить их качественное отображение на дисплеях Retina.
Поддержка 