nir.gov.ua · для фотографів і редакторів

Перевір зображення перед завантаженням

Перетягни сюди своє фото — побачиш, як воно виглядатиме на сайті, і чи відповідає вимогам. Файл нікуди не відправляється: перевірка повністю у твоєму браузері.

Як це виглядатиме на сайті

Прев'ю: картка новини на головній

Заголовок новини — так він виглядає на картці головної сторінки

22 липня 15:00 Ветеринарна медицина

Картка новини на головній — фото обрізається до 334 × 250 px по центру (на мобільному — 220 px заввишки). Перевір, чи головне не зрізалось.

У разі підтвердження захворювання в господарстві запроваджуються ветеринарно-санітарні обмеження. Це необхідно, щоб не допустити подальшого поширення серед поголів'я.

Прев'ю: фото на сторінці новини

Дотримання ветеринарно-санітарних заходів є запорукою локалізації захворювання.

Сторінка новини — фото в тексті показується цілим, без обрізки, у колонці статті 724 px, шрифт і кольори як на сайті.

Картка на головній (телефон, ~390 px)

Прев'ю: мобільна картка новини

Заголовок новини на мобільній картці

22 липня 15:00

Стаття (телефон)

Перший абзац новини на мобільному екрані.

Прев'ю: фото у мобільній статті

Текст продовжується під фото.

Мобільна версія — картка ріже фото до смуги 350 × 220 px (ще агресивніше, ніж десктоп), у статті фото ціле на всю ширину екрана (~350 px).

Прев'ю: картка посилання у соцмережах
nir.gov.ua
Заголовок новини у Facebook і Telegram

Соцмережі — коли новину шерять у Facebook чи Telegram, фото обрізається до пропорції 1200 × 630. Найжорсткіша обрізка з усіх — верх і низ зникають.

Вимоги — коротко

Золоте правило

Ідеал: 1600 × 1067 px (пропорція 3:2), формат WebP, легше за 1 МБ.
Мінімум — 1200 × 800. Головне — в центрі кадру. Для фото ніколи не використовуйте PNG.

Де показуєтьсяЩо відбувається з фото
Статтятіло новини, титульне фотоціле, 724 px завширшки — для чіткості на Retina потрібно ≥1448 px
Картка на головнійкроп по центру до 334 × 250 (~4:3) — краї зверху/знизу зрізаються
Facebook / Telegramкроп по центру до 1200 × 630 (1.91:1) — найжорсткіший, третина квадрата зникає

Пропорція 3:2 — золота середина: центр кадру виживає і на «майже квадратній» картці, і в «широких» соцмережах. Квадратні шаблони з плашкою знизу — тільки в тіло новини: титульним їх плашку зріже.

Який формат файлу

Що на зображенніФормат
Світлина, фотографія, скан документабудь-що «сфотографоване» WebP або JPEG, якщо WebP недоступний
Логотип, схема, іконка, графік, скриншот із текстом, прозорий фон PNG тільки для таких випадків
Анімація (рухома картинка) GIF
Особливо важливо: зображення всередині тексту новини (не обкладинку) сайт віддає без стиснення — саме в тому розмірі, що завантажили. Тому їх обов'язково готуйте заздалегідь: WebP + ширина до 1600 px.

Як виправити, якщо перевірка «червона»

Найпростіше — кнопка вище

  • Кнопка «Виправити автоматично» з'являється під перевіркою
  • Конвертує у WebP (вбудований кодек зі squoosh), зменшує до 1600 px, транслітерує назву — все в браузері, без інтернету, працює навіть у Safari/Firefox
  • Готовий файл сам завантажиться — залий його в новину
  • Пропорції і кадрування вона не чіпає — це твоє рішення

Тонкий контроль — squoosh.app

  • Відкрий squoosh.app у браузері (безкоштовно)
  • Перетягни фото у вікно
  • Праворуч формат WebP, якість ≈ 80
  • За потреби зменш ширину (Resize → 1600)
  • Натисни завантажити (⬇) і перевір файл тут ще раз

У програмі

  • Photoshop / GIMP: «Експортувати як…» → WebP, ширина 1600
  • Figma: фрейм потрібного розміру → Export → JPG 1× → потім через squoosh у WebP
  • Телефон: зменш фото, потім конвертуй застосунком-конвертером