← Блог
5 мин четене

Защо прозрачният PNG побелява (и как да го поправите)

Прозрачният PNG побелява? Алфата тихо умира при JPEG прекодиране, печат, имейл и качвания. Тест от трийсет секунди я хваща, преди да изпратите.

  • transparent png
  • alpha channel
  • png vs jpeg
  • background removal
  • file formats
  • webp
  • exporting
  • design workflow
Защо прозрачният PNG побелява (и как да го поправите)

Изрязали сте продуктова снимка, записали сте PNG с наистина прозрачен фон и сте го пуснали в слайд. Пристига в бяла кутия. Или изглежда добре в презентацията, а побелява в експортирания PDF.

Файлът почти сигурно е наред. Прозрачността оцелява само докато всяка програма между вас и зрителя се съгласява да я пренесе, а няколко от тях тихо отказват. Никой не ви предупреждава, защото от гледна точка на софтуера нищо не се е объркало. Едно правило обяснява почти всеки случай.

JPEG няма алфа канал

PNG може да съхранява алфа стойност редом с цвета на всеки пиксел. Алфата е непрозрачност: нула е напълно прозрачно, максимумът е напълно непрозрачно. Тя е единственото, което прави изрязания обект изрязан обект.

JPEG няма еквивалент. В JPEG няма къде да живее „този пиксел е празен", така че всичко, което прекодира към JPEG, трябва да реши какво да сложи там, където е била прозрачността. То наслагва изрязания обект върху плътен цвят, „запича" този цвят и изхвърля алфата. Резултатът е напълно валидно изображение на вашия продукт върху цветен правоъгълник.

Този цвят обикновено е бял. Някои инструменти запълват с черно, което поражда обратното оплакване: черен правоъгълник около обекта. Един измамно подобен случай изобщо не е сплескване — тъмно лого, което изчезва в имейл клиент в тъмен режим. Там прозрачността работи точно както трябва и тъмният фон просто прозира. Решението е светла подложка зад знака или светъл вариант върху тъмно, а не нов експорт.

Къде алфата оцелява и къде умира

Вместо да наизустявате приложения, научете се да разпознавате стъпката на прекодиране: всеки път, когато програма прочете пикселите ви и ги запише отново, алфа каналът ви подлежи на предоговаряне. Изрязан обект, поставен в слайд и по-късно експортиран, е версията, която повечето хора срещат.

Жена стои пред прожектиран слайд с линейна графика на коралов фон, докато двама седнали колеги гледат

  • Поставяне в документ или слайд. Word и PowerPoint по правило запазват прозрачността на екрана; проблемът рядко е самото поставяне, а експортът.
  • Всяко „Запази като JPEG". Гарантирана загуба, включително тихите случаи: инструмент, който предлага „оптимизация за уеб" и сам избира JPEG вместо вас.
  • PDF и предаване за печат. PDF пренася прозрачност още от PDF 1.4 и повечето ежедневни експортери я запазват. Рискът се крие в предпечатните пресети: по-старите стандарти като PDF/X-1a не допускат жива прозрачност — версията от 2001 г. стъпва на PDF 1.3, който изобщо няма модел за прозрачност, а версията от 2003 г. я забранява изрично — така че всичко прозрачно се сплесква върху страницата. Ако печатницата изисква пресет, попитайте какво прави той с прозрачността.
  • Имейл. Изображение в тялото на писмото може да бъде прекодирано на излизане от някои клиенти или сервирано през прокси за изображения на влизане; поведението варира по клиент, така че си струва да тествате, вместо да предполагате. Прикачен файл пътува непокътнат далеч по-надеждно.
  • Качвания в чатове, социални мрежи и онлайн магазини. Тези системи прекодират, за да пестят трафик или да нормализират всичко към един формат, каквото и да сте изпратили.

Електронните таблици заслужават отделен тест. Изрязани обекти в клетки, графики или фигури не винаги се държат като тези в слайд, а стар шаблон може да се различава от нов. Ако един файл работи, а друг се проваля, подозирайте шаблона.

Тест от трийсет секунди, преди да изпратите каквото и да е

Не се доверявайте на миниатюрата. Тя стои върху фона на файловия ви браузър — бял в светъл режим, тъмен в тъмен — така че сплескано и прозрачно изображение могат да изглеждат еднакво там.

Чифт бели платнени кецове, снимани отгоре върху яркорозов хартиен фон

  1. Поставете изображението върху нещо ярко. В слайда или дизайн инструмента си начертайте магентов правоъгълник и пуснете изрязания обект отгоре. Всяко бяло, което видите, е „запечено" в него.
  2. Проверете реалния формат. Файл с име logo.png може да е преименуван JPEG. И Windows, и macOS вземат етикета от разширението, така че грешно именуван файл пак се показва като PNG. Отворете го в редактор на изображения и проверете формата, който той докладва, или го експортирайте наново чисто като PNG от дизайн инструмента си.
  3. Тествайте канала, не файла. Изпратете едно изображение точно по маршрута, по който ще мине: пратете си имейл, публикувайте в частен тестов акаунт, прекарайте един артикул през качването в онлайн магазина.

Ако мине първата стъпка, но се провали на третата, файлът е наред и каналът е този, който го сплесква.

Кога да спрете да се борите и просто да изберете цвят

За дестинации, които сплескват, изберете сами цвета на запълване. Експортирайте изрязания обект вече поставен върху цвета, който искате, и никой друг няма да взима решение за наслагването.

Едър план на ветрилообразно разперени мостри на бои в червено, розово, зелено и синьо върху лилава повърхност

Точно за това служи редакторът в remover.bg: щом фонът е премахнат, поставете обекта върху плътен цвят, персонализиран цвят или ваша снимка и добавете лека сянка, за да не изглежда залепен. Пазете прозрачния PNG като своя оригинал и третирайте всяко сплескано копие като файл за доставка.

Където дестинацията го приема, WebP пренася прозрачност като PNG в по-малък файл — вижте експортиране на WebP без предварително конвертиране. Ако не сте сигурни дали дадена задача изобщо изисква прозрачност, нашият наръчник за прозрачни PNG файлове я покрива; когато побеляващото нещо е фирмен знак, премахването на фона от лого описва проверките на ръбовете, от които плоската графика се нуждае.

Два файла, едно решение

Пазете прозрачния оригинал и правете сплескано копие за всяко място, което го изисква, върху цвят, избран от вас. Бялата кутия никога не е била дефект на изрязания обект — тя е програма, отговаряща на въпрос, който не сте осъзнавали, че ѝ е зададен.

Продължете с четенето