Что делает Tilda
Tilda автоматически уменьшает крупные изображения, но в своей справке рекомендует заранее сокращать фотографии хотя бы до 1680 пикселей по большей стороне и по возможности загружать размер, близкий к фактическому отображению.
Когда ручная подготовка полезна
- большие фотографии с камеры;
- изображение первого экрана;
- PNG с прозрачностью;
- длинные страницы с десятками изображений;
- галереи и каталоги.
Сначала пиксели
Сжатие исходника 6000×4000 без уменьшения размеров оставляет лишние данные. Сначала приведите изображение к разумным габаритам, затем оптимизируйте качество.
Выбор формата
Для фотографий обычно подходит современный сжатый формат или JPEG, для графики с прозрачностью - PNG или WebP. Не сохраняйте простой фон как тяжелый PNG только из-за привычки.
Качество
Проверяйте изображение в реальном размере на сайте. Слишком агрессивное сжатие заметно на градиентах, лицах и мелкой графике.
Рекомендации Tilda
Подробный алгоритм по размеру и весу изображений есть в справке по оптимизации изображений.
Минимальный набор проверок
- уменьшите пиксельные размеры до реальной задачи;
- выберите формат по типу графики;
- сравните качество после сжатия в масштабе сайта;
- не храните тяжелую прозрачность без необходимости;
- проверьте общий вес страницы после публикации;
Подготовку изображений удобно включить в дизайн-процесс: для каждого типа блока заранее задаются рекомендуемые размеры и формат. Тогда оптимизация не превращается в ручную работу перед запуском.
Где появляется технический риск
Сжимать гигантский исходник без уменьшения размеров малоэффективно. Файл все равно содержит пиксели, которые браузер никогда не покажет пользователю.
Где ручная оптимизация дает заметный эффект
Tilda автоматически обрабатывает изображения и использует современные форматы, поэтому бессмысленно вручную пережимать каждый файл до потери качества. Ручная подготовка полезнее для самых тяжелых и заметных изображений: первый экран, большие фоновые фотографии, галереи и картинки, которые дизайнер загрузил в размере значительно больше фактического контейнера.
Сама Tilda указывает, что автоматическая оптимизация не отменяет выгоду от предварительного сжатия в отдельных случаях. См. официальный материал по скорости.
Как принять решение
Смотрите не только размер файла на диске, но и то, какой ресурс реально отдается браузеру. Если автоматическая версия уже компактна, повторное сжатие ничего не изменит. Если браузер получает тяжелый оригинал, ручная подготовка оправдана. Сравните с правилами подготовки изображений, оптимизацией картинок на Tilda и ленивой загрузкой.
Ручная оптимизация особенно полезна для исходников
Если загрузить фотографию в несколько тысяч пикселей для карточки шириной 600 px, платформа вынуждена работать с заведомо избыточным исходником. Предварительное уменьшение размеров и контроль качества позволяют снизить вес еще до автоматической оптимизации.
Наибольший эффект обычно дают крупные фотографии, прозрачные изображения и повторяющиеся графические элементы. Для маленьких и уже оптимизированных файлов дополнительное сжатие может почти не изменить загрузку.
Формат выбирают после оценки прозрачности и детализации
Фотография без прозрачности обычно хорошо сжимается в современный растровый формат. Логотипы и простая графика часто выгоднее в SVG. Прозрачные изображения требуют отдельного контроля. Универсальная конвертация всех файлов в один формат способна ухудшить качество или увеличить вес.
Когда ручная оптимизация оправдана
Ручное сжатие остается полезным как этап подготовки исходников. Автоматическая оптимизация платформы дополняет этот процесс, но не заменяет правильный размер и формат файла.
