PNG, JPG или WebP для соцсетей: что сохраняет качество
PNG, JPG или WebP для постов в соцсетях: какой формат сохраняет чёткий текст, что принимает каждая сеть и реальные размеры файлов одного рендера в четырёх вариантах.
PNG это самый надёжный формат для соцсетевой графики с текстом, логотипами и плоским цветом, а JPG подходит для фотографий. WebP обычно меньше JPG, и в нашем тесте он сравнялся с PNG на плоском цвете и обошёл его только на градиенте. Но LinkedIn (для изображений Страниц), превью YouTube и Pinterest указывают на своих справочных страницах только PNG или JPEG, поэтому не рассчитывайте на WebP при загрузке.
Мы проверили это на собственных файлах. Наш движок отрендерил два поста 1080 x 1080 из нашего демо-бренда AURORA в PNG. Затем мы конвертировали каждый с помощью sharp (качество JPEG 92 и 80, качество WebP 80, остальные настройки по умолчанию) и измерили файлы. О размерах для сетей читайте в нашем руководстве по размерам изображений для соцсетей.
В чём разница между PNG, JPG и WebP?
MDN относит PNG к форматам без потерь, JPEG к форматам с потерями, а WebP к тем, что умеют и то и другое. Без потерь значит, что каждый пиксель возвращается ровно таким, каким был сохранён. Кодировщик с потерями отбрасывает мелкие детали, которые, как он ожидает, вы не заметите. Это подходит для фотографий, но MDN отмечает, что размытие и цветные каймы легко заметить вокруг текста и резких краёв, поэтому для скриншотов, диаграмм, логотипов и линейной графики советует файлы без потерь.
web.dev говорит то же другими словами: PNG даёт наивысшее качество при гораздо большем размере файла, JPEG жертвует частью качества ради меньших файлов, а WebP в целом сжимает лучше обоих. MDN приводит цифры: WebP с потерями в среднем на 25-35 процентов меньше сопоставимого JPEG, а WebP без потерь примерно на 26 процентов меньше PNG.
| Формат | Сжатие | Прозрачность | Лучше всего для |
|---|---|---|---|
| PNG | Без потерь | Да | Текст, логотипы, плоский цвет |
| JPG | С потерями | Нет | Фотографии |
| WebP | С потерями или без | Да | Веб-страницы (наш совет: только там, где есть запасной вариант) |
Какие форматы принимают соцсети?
Меньше, чем экспортирует ваша программа для дизайна. Вот страницы, которые мы смогли прочитать 2 октября 2026 года:
| Сеть | Указанные форматы | Лимит файла |
|---|---|---|
| LinkedIn (изображения Страниц и Career Pages; посты в ленте не проверяли) | PNG, JPEG | 3 МБ |
| YouTube (превью) | JPG, PNG | 2 МБ на мобильных, 50 МБ на компьютере |
| Pinterest (стандартные пины) | PNG, JPEG | 20 МБ на компьютере, 32 МБ в приложении |
Ни одна из трёх не называет WebP. Страницы справки Instagram и X о форматах файлов мы открыть не смогли, поэтому их правила здесь не приводим: проверьте их перед экспортом. Pinterest добавляет в совете для рекламодателей, что изображения должны быть в PNG с профилем sRGB и что он преобразует каждую загрузку в стандартный 8-битный RGB JPEG. Наш вывод: загружайте чистый PNG, чтобы это преобразование было единственным шагом с потерями. Размеры для каждой сети есть в наших руководствах по превью YouTube и пинам Pinterest.
Насколько меньше JPG и WebP? Наши замеры
Мы взяли два рендера нашего движка, макет с блоками и большим количеством текста и макет с мягким градиентом, и сохранили каждый четырьмя способами.
| Файл (1080 x 1080) | Плоский макет с текстом | Макет с градиентом |
|---|---|---|
| PNG | 13,0 KB | 182,8 KB |
| JPG, качество 92 | 44,7 KB | 71,9 KB |
| JPG, качество 80 | 34,3 KB | 39,3 KB |
| WebP, качество 80 | 13,8 KB | 16,9 KB |
Размеры это реальные байты после разовой конвертации одного и того же PNG через sharp. Заметны три вещи.
- PNG победил на плоском макете. Крупные области одного цвета отлично сжимаются без потерь, поэтому файл без потерь оказался меньше обоих JPG. Переход на JPG сделал этот файл в 2,6-3,4 раза больше и при этом хуже по качеству.
- Градиент перевернул результат. Плавные переходы цвета для PNG тяжелы, поэтому PNG весил 183 KB, а JPG качества 92 сократил его до 72 KB.
- WebP при качестве 80 весил 13,8 KB на плоском макете и 16,9 KB на градиенте. На плоском макете он примерно сравнялся с PNG (чуть больше 13,0 KB), а на градиенте был примерно в десять раз меньше PNG.
Мы также сравнили каждый пиксель каждого конвертированного файла с исходным PNG (абсолютная разница по каждому цветовому каналу, от 0 до 255). Среднее значение было ниже 1,1 для всех файлов с потерями, но на самых резких краях худший одиночный пиксель на текстовом макете отличался на 81-89 уровней для JPG 80, JPG 92 и WebP 80. Это та самая цена потерь, о которой пишет MDN: она сосредоточена на краях текста. При обычном размере просмотра мы не увидели её даже на увеличенном фрагменте текста кнопки, поэтому, на наш взгляд, качество 80 и выше годится для постов. Ожидайте, что дефекты проявятся, когда кто-то приблизит изображение или перепостит его.
Мы брали по одному образцу каждого типа, поэтому воспринимайте размеры как иллюстрацию закономерности, а не как бенчмарк. Ваши файлы будут отличаться.
Какой формат использовать для постов в соцсетях?
Подбирайте формат под содержимое, а затем проверяйте список сети.
- Графика с текстом, логотипом или плоским цветом: PNG. Он оказался самым маленьким на нашем плоском макете и не даёт артефактов на краях.
- Фотография или фон с выраженным градиентом: JPG качества 90 и выше, если PNG не проходит по лимиту файла (например, LinkedIn указывает 3 МБ для изображений Страниц).
- WebP: оставьте его для сайта. Не загружайте его в сеть, которая его не указывает.
- Никогда не пересохраняйте JPG как JPG. Наш совет: каждое сохранение с потерями отбрасывает ещё больше деталей, поэтому храните мастер-файл в PNG.
Если вы экспортируете много размеров, инструмент с шаблонами снимает вопросы: Chikaboom экспортирует PNG в размере каждой платформы, так что загружаемый файл всегда без потерь. Попробовать можно в живой демо.
Чек-лист перед загрузкой
- Проверьте список принимаемых форматов и лимит файла у самой сети.
- Экспортируйте графику с текстом в PNG; JPG используйте только для фотографий или чтобы уложиться в лимит размера.
- Для JPG берите качество 90 и выше и никогда не конвертируйте WebP туда и обратно.
- Откройте итоговый файл в масштабе 100 процентов и прочитайте самый мелкий текст.
Вопросы и ответы
Загружать в соцсети PNG или JPG?
Используйте PNG для графики с текстом, логотипами и плоским цветом: сжатие без потерь сохраняет края чистыми. Используйте JPG высокого качества для фотографий или когда PNG не проходит по лимиту размера. Это наша рекомендация, основанная на измеренных нами размерах.
Можно ли загружать WebP в LinkedIn, YouTube или Pinterest?
Судя по справочным страницам, которые мы читали, нет. LinkedIn указывает PNG или JPEG для изображений Страниц (посты в ленте мы не проверяли), YouTube указывает JPG и PNG для превью, Pinterest указывает PNG или JPEG. Перед загрузкой конвертируйте WebP в PNG или JPG.
Пережимают ли соцсети мои изображения?
Pinterest сообщает, что при обработке преобразует загрузки в стандартные 8-битные RGB JPEG. Остальные сети на проверенных нами страницах свой конвейер не публикуют, поэтому мы исходим из того, что ваш файл будет перекодирован: начинайте с самого чистого исходника.
Какое качество JPG выбрать для графики с текстом?
Мы рекомендуем 90 и выше для всего, где есть шрифт. В нашем тесте плоская текстовая графика при качестве 92 весила 45 KB против 13 KB в PNG, так что JPG окупился только на изображении с градиентом: там 72 KB против 183 KB.