Узнайте, как оптимизировать изображения для веб-страниц: уменьшение размеров в FastStone Image Viewer и сжатие в TinyPNG. Повысьте скорость загрузки сайта и улучшите SEO!
Содержание:
- Введение
- Уменьшение размеров изображений в пикселях
- Изменение размеров изображений с помощью программы FastStone Image Viewer
- Сжатие изображений с использованием сервиса TinyPNG
- Заключение
Введение
Файлы изображений, создаваемые фотокамерой, часто бывают слишком большими как по количеству байтов, так и по числу пикселей. Использование таких файлов в веб-странице может значительно замедлить её работу, особенно при медленном интернет-соединении. Это может отпугнуть посетителей, которые, скорее всего, покинут страницу, не дожидаясь полной загрузки изображений. Кроме того, чрезмерно крупные файлы негативно влияют на SEO: поисковые системы могут понизить позиции страниц с тяжёлыми изображениями в своей выдаче. Поэтому перед размещением изображений на веб-сайте важно провести их оптимизацию.
Уменьшение размеров изображений в пикселях
Современные фотокамеры создают изображения, размеры которых в пикселях значительно превосходят размеры большинства экранов, включая самые большие мониторы. Особенно это заметно на маленьких экранах мобильных устройств. Избыточный размер изображения в пикселях увеличивает его вес в байтах. Поэтому исходные фотографии следует уменьшить до приемлемого разрешения. Например, размер изображения 1200 px по длинной стороне обычно достаточно для корректного отображения на большинстве устройств.
Часто требуется изменить размеры сразу нескольких изображений, иногда даже десятков или сотен. Ручная обработка каждой фотографии в графическом редакторе – процесс трудоёмкий и долгий. Для массовой обработки лучше воспользоваться программами, поддерживающими пакетное изменение размеров.
Изменение размеров изображений с помощью программы FastStone Image Viewer
FastStone Image Viewer – это многофункциональный графический редактор для Windows, бесплатный для домашнего использования. Программа современная, удобная и имеет русскоязычный интерфейс. Её можно скачать на официальном сайте: https://www.faststone.org/FSIVDownload.htm.
Программа обладает множеством полезных функций, но нас интересует возможность пакетной обработки изображений для уменьшения их размеров.
- Поместите файлы, полученные из фотоаппарата, в папку «Фото исходное». Каждый файл имеет разрешение 2400×2400 px.
- Откройте программу FastStone и выберите папку с файлами. В меню «Сервис» выберите пункт «Пакетное преобразование/переименование».
Начало работы с FastStone: выбор файлов для пакетной обработки.
- В открывшемся окне диалога выполните следующие шаги:
- Добавьте все необходимые файлы в список для обработки, нажав кнопку «Добавить все».
- При необходимости измените формат выходных файлов в разделе «Формат вывода / Настройки».
- Выберите папку «Фото уменьшенное» для сохранения обработанных файлов («Целевая папка»).
- Поставьте галочку напротив пункта «Изменить настройки (размеры…)» и нажмите кнопку «Дополнительно».
Выбор файлов и настройка параметров преобразования.
- В окне «Дополнительно» перейдите на вкладку «Изменить размер» и установите новые размеры изображений.
Параметры изменения размеров изображений.
- Нажмите кнопки «ОК», затем «Пуск» для запуска процесса пакетной обработки. После завершения нажмите «Готово».
Завершение пакетной обработки файлов.
- В результате в целевой папке «Фото уменьшенное» появятся файлы с новыми размерами 1200×1200 px. Уменьшение размеров изображений также привело к снижению их веса в байтах.
Результаты уменьшения размеров изображений: исходные и обработанные файлы.
Сжатие изображений с использованием сервиса TinyPNG
Теперь продолжим оптимизировать изображения с помощью онлайн-сервиса TinyPNG, который позволяет эффективно сжимать изображения практически без потерь в качестве. Этот сервис использует современные форматы изображений, такие как WebP, специально разработанный для интернета.
TinyPNG доступен по адресу https://www.tinypng.site/. Сервис абсолютно бесплатен и не накладывает никаких ограничений на использование.
Единственным недостатком является отсутствие русского интерфейса, однако это легко решается с помощью встроенного перевода в браузере.
Перевод интерфейса TinyPNG на русский язык
Вначале нужно выбрать выходной формат сжатых изображений:
- Включите переключатель «Автоматически конвертировать мои изображения» и выберите нужный формат для выходных файлов, например, WebP.
Выбор формата выходных файлов.
- Нажмите на кнопку «Файлы браузера» и загрузите файлы из папки «Фото уменьшенное». Процесс сжатия начнётся автоматически, после чего вы увидите результаты: размеры сжатых файлов и проценты экономии места.
Результаты сжатия файлов изображений.
- Вы можете скачать все сжатые файлы одним архивом, распаковать его и использовать изображения по своему усмотрению.
Дополнительные функции TinyPNG: удаление фона и редактирование изображений.
Заключение
Двухэтапная обработка изображений позволила существенно снизить их размер при минимальных потерях в качестве. Оптимизированные таким образом изображения помогут ускорить загрузку вашей веб-страницы и улучшить её восприятие пользователями и поисковыми системами.
Итоговый результат оптимизации изображений