یک «پس‌زمینهٔ شفاف» ساده به نظر می‌رسد — بخشِ پشتِ سوژه‌تان فقط... رفته است. زیرِ پوسته یک ویژگیِ فنیِ مشخص است، و فهمیدنش شما را از سرخوردگیِ کلاسیک نجات می‌دهد: یک لوگو را بیرون می‌بُرید، ذخیره‌اش می‌کنید، و پس‌زمینه به‌صورتِ یک بلوکِ سفیدِ توپُر بازمی‌گردد. در ادامه می‌بینید شفافیت واقعاً چیست و چطور آن را در سراسرِ هر گام نگه دارید.

شفافیت واقعاً چیست: کانالِ آلفا

PNG با پس‌زمینهٔ شفاف: راهنمایی عملی برای شفافیت آلفا — visual 1
شفافیت واقعاً چیست: کانالِ آلفا

یک تصویرِ عادی سه عدد در هر پیکسل ذخیره می‌کند: چقدر قرمز، سبز و آبی. یک تصویرِ شفاف چهارمی را ذخیره می‌کند: آلفا، که ثبت می‌کند آن پیکسل چقدر مات است. آلفا از کاملاً شفاف تا کاملاً مات می‌رود، با هر سطحِ میانی برای لبه‌های نرم و پَرمانند.

آن کانالِ چهارم دلیلی است که شفافیت آن‌طور رفتار می‌کند که می‌کند:

  • PNG از آلفا پشتیبانی می‌کند، به همین دلیل فرمتِ اصلی برای لوگوها، آیکون‌ها، استیکرها و بُرش‌هاست.
  • WebP هم از آلفا پشتیبانی می‌کند، و معمولاً با اندازهٔ فایلی کوچک‌تر از PNG.
  • JPEG اصلاً از آلفا پشتیبانی نمی‌کند. یک JPEG کانالِ چهارمی ندارد، پس فیزیکی نمی‌تواند شفافیت را ذخیره کند.

آن نکتهٔ آخر رایج‌ترین علتِ تکیِ «پس‌زمینهٔ شفافم ناپدید شد» است.

تلهٔ پس‌زمینهٔ سفید

PNG با پس‌زمینهٔ شفاف: راهنمایی عملی برای شفافیت آلفا — visual 2
تلهٔ پس‌زمینهٔ سفید

این سناریویی است که همه را زمین می‌زند. پس‌زمینه را از یک عکسِ محصول حذف می‌کنید، یک بُرشِ تمیز می‌گیرید، سپس خروجی‌اش می‌گیرید — و شفافیت به سفیدِ توپُر بدل می‌شود. تقریباً همیشه، علت فرمت است. به‌صورتِ JPEG ذخیره کردید.

چون JPEG نمی‌تواند یک کانالِ آلفا نگه دارد، کدگذار باید با پیکسل‌های شیشه‌ای کاری بکند. آن‌ها را با یک رنگِ پس‌زمینه پُر می‌کند، و پیش‌فرض سفید است. شفافیت در ویرایش گم نشد؛ در لحظهٔ خروجی با انتخابِ فرمتی که نمی‌تواند بازنمایی‌اش کند نابود شد.

راه‌حل یک عادت است: هر چیزی با شفافیت باید به‌صورتِ PNG یا WebP ذخیره شود، هرگز JPEG. اگر ابزاری فقط خروجیِ JPEG ارائه دهد، هربار شفافیتتان را تخت می‌کند.

ساختنِ شفافیت: حذف یک پس‌زمینه

بیشترِ تصاویرِ شفاف زندگی را به‌عنوانِ یک عکسِ معمولی آغاز می‌کنند. برای گرفتنِ پس‌زمینهٔ شیشه‌ای، پیکسل‌های دورِ سوژه‌تان را پاک می‌کنید و آلفای آن‌ها را روی صفر می‌گذارید. انجامِ تمیزِ این به‌صورتِ دستی خسته‌کننده است؛ یک حذف‌کنندهٔ پس‌زمینه خودکار با تشخیصِ سوژه و بُرشِ بقیهٔ همه‌چیز انجامش می‌دهد.

خروجی باید فرمتی باشد که آلفا را نگه می‌دارد — PNG یا WebP. حذف‌کنندهٔ پس‌زمینهٔ IMG.DIY یک PNG واقعاً شفاف تولید می‌کند، و روی دستگاهِ شما اجرا می‌شود (پس از یک دانلودِ یک‌بارهٔ مدل)، پس عکس هرگز آپلود نمی‌شود. این برای عکس‌های محصول، امضاها، و تصاویرِ شخصی که ترجیح می‌دهید به یک سرور نفرستید مهم است.

نگه‌داشتنِ شفافیت در سراسرِ یک تبدیل

فرض کنید یک PNG شفاف دارید که کمی سنگین است و یک WebP کوچک‌تر می‌خواهید. این امن است — هر دو فرمت از آلفا پشتیبانی می‌کنند، پس شفافیت جان به در می‌برد. تلهٔ معکوس تبدیلِ به JPEG است، که تختش می‌کند.

یک قاعدهٔ سرانگشتیِ سریع هنگام تبدیل:

  • PNG ← WebP: شفافیت حفظ‌شده، فایل معمولاً کوچک‌تر. حرکتِ خوب.
  • PNG ← JPEG: شفافیت نابودشده، جایگزین‌شده با یک رنگِ توپُر. فقط اگر واقعاً یک پس‌زمینهٔ تخت می‌خواهید این کار را بکنید.
  • WebP ← PNG: شفافیت حفظ‌شده، فایل معمولاً بزرگ‌تر. برای سازگاری خوب است.

یک تبدیل‌کننده که آلفا را می‌فهمد به شما اجازه می‌دهد یک تصویرِ شفاف را بدونِ تخت‌کردنش کوچک کنید. تبدیل‌کنندهٔ تصویر کانالِ آلفا را روی هر فرمتی که پشتیبانی‌اش می‌کند دست‌نخورده نگه می‌دارد، و مثلِ هر چیزِ دیگری روی سایت، در مرورگرتان بدونِ آپلود کار می‌کند.

فهرستِ بررسیِ سریع برای شفافیتِ تمیز

  • پس‌زمینه‌ای حذف می‌کنید؟ به‌صورتِ PNG یا WebP خروجی بگیرید، هرگز JPEG.
  • یک فایلِ شفافِ کوچک‌تر نیاز دارید؟ PNG را به WebP تبدیل کنید — آلفا حفظ می‌شود.
  • یک جعبهٔ سفیدِ غیرمنتظره می‌بینید؟ تقریباً به‌یقین به‌صورتِ JPEG ذخیره کردید؛ به‌صورتِ PNG تکرارش کنید.
  • یک تصویرِ شفاف را روی یک سایتِ تیره می‌گذارید؟ لبه‌ها را بررسی کنید — لبه‌های آلفای نرم که برای یک پس‌زمینهٔ سفید آمیخته شده‌اند می‌توانند یک هالهٔ محو نشان دهند. اگر مهم است، در برابرِ رنگی که واقعاً به کار خواهید برد دوباره ببُریدش.

شفافیت فقط همان عددِ چهارم در هر پیکسل است. وقتی بدانید کدام فرمت‌ها نگهش می‌دارند و کدام دورش می‌ریزند، غافلگیریِ پس‌زمینهٔ سفید دیگر پیش نمی‌آید — و بُرش‌هایتان هرجا که بگذاریدشان تمیز می‌مانند.