Как быстро подготовить картинку без потери качества
Картинки в письмах — это не просто украшение, а важный элемент дизайна.
Но если подготовить их неправильно, они будут:
❌ размытыми,
❌ грузиться слишком долго,
❌ ломать макет письма.
В этой статье расскажем, как быстро подготовить изображение для email-рассылки, чтобы оно выглядело идеально.
Шаг 1. Определите размер изображения
- Ширина: не больше 600–650 px (это стандартная ширина письма).
- Высота: не критична, но лучше не больше 400–500 px, чтобы не занимать весь первый экран.
Совет: если картинка вставляется в колонку, считайте ширину относительно колонки, а не всего письма.
Шаг 2. Выберите правильный формат
| Формат | Когда использовать |
| JPEG | Для фотографий, градиентов, сложных изображений. |
| PNG | Для картинок с прозрачностью или чёткими линиями (например, логотипы, иконки). |
| GIF | Для анимации. |
⚠ Не используйте SVG — они не поддерживаются всеми почтовыми клиентами.
Шаг 3. Оптимизируйте вес
- Используйте сервисы вроде TinyPNG или Squoosh.
- Сжимайте картинку до размера меньше 150 КБ (лучше — до 50–100 КБ).
- Проверяйте, чтобы при сжатии не появлялись артефакты (замыленные области, пиксели).
Шаг 4. Проверьте разрешение
- Для Retina-экранов делайте x2 по ширине (например, если блок 300 px, картинка должна быть 600 px, но масштабироваться до 300 px).
- Не вставляйте слишком большие картинки без необходимости.
Шаг 5. Добавьте alt-текст
- Пропишите альтернативный текст (alt), чтобы при блокировке изображений пользователь понял, что должно было быть на картинке.
Шаг 6. Вставьте картинку правильно
В редакторе Letteros:
- используйте блок «Изображение»,
- не задавайте фиксированную высоту,
- устанавливайте ширину 100% с max-width, чтобы картинка адаптировалась.
Шаг 7. Протестируйте письмо
- Откройте предпросмотр на десктопе и мобильном.
- Проверьте скорость загрузки письма.
- Убедитесь, что картинка не «плывёт» в макете.
Заключение
Подготовка картинки для письма — это несложный, но важный этап.
Если всё сделать правильно, изображение будет:
✔ чётким,
✔ лёгким,
✔ адаптивным,
✔ и не испортит впечатление от письма.
В Letteros вы можете вставить и проверить картинки прямо в редакторе, а встроенные инструменты помогут избежать типичных ошибок.