فرمت PNG نیز حالت متحرک را پشتیبانی می‌کند (Animated PNG)

مقدمه: برای عکس خود در وب چه فرمتی انتخاب کنم؟

در کلاس‌های مرتبط با گرافیک و طراحی وب، بعد از کلی تفسیر علمی در مورد فرمت‌های BMP و JPG و PNG و GIF، صحبت‌هایم را در سه جمله خلاصه می‌کنم که فکر می‌کنم کمتر کسی این سه جمله را می‌داند و دانستن آن‌ها می‌تواند نجات‌بخش طراحان وب از مصرف بیش از حد ترافیک ماهیانه و پهنای باند سایتشان باشد:

- برای عکس‌های طبیعی (یعنی عکس‌هایی که توسط دوربین دیجیتال یا اسکنر وارد کامپیوتر شده‌اند) فرمت JPG را انتخاب کنید. مثال:

به طور علمی اگر بخواهم بگویم، منظور از «عکس طبیعی» تصاویری است که تعداد رنگ آن‌ها بیش از ۲۵۶ رنگ است و رنگ‌های «مشابه و کنار هم» زیاد دارند.

- برای عکس‌هایی که توسط کامپیوتر ایجاد شده‌اند، فرمت PNG را انتخاب کنید. مثال:

به طور علمی، منظور از عکس‌هایی که توسط کامپیوتر ایجاد شده‌اند، عکس‌هایی است که تعداد رنگ به کار رفته در آن‌ها کمتر از ۲۵۶ رنگ است.

- برای عکس‌های متحرک (چه طبیعی باشند و چه توسط کامپیوتر ایجاد شده باشند) راهی جز انتخاب GIF ندارید! مثال:

این‌ها توضیحات علمی و ثابت کردن نیاز دارد که بحث اصلی من نیست (حدود یک ساعت در مورد این مباحث در جلسه یازدهم دوره فتوشاپ مقدماتی صحبت کرده‌ام)، همینقدر بدانید که اگر به این سه جمله توجه نکنید، عکس‌های شما از ۲ تا ۱۰ برابر حجیم‌تر می‌شوند و این در حالی است که کیفیت آن‌ها بدتر خواهد شد.

اما چیزی که امروز متوجه شدم این است که فرمت PNG نیز مدتی است که متحرک بودن را پشتیبانی می‌کند!

البته فعلاً محدودیت‌هایی وجود دارد؛ از جمله اینکه: متأسفانه طبق معمول، مرورگر اینترنت اکسپلورر حتی نسخه 10 که روی ویندوز 8 است، آن‌را پشتیبانی نمی‌کند!! و این یعنی حداقل تا مدت‌ها بعد که نسخه بعد منتشر شود استفاده از PNG متحرک مقرون به صرفه نیست. (البته شاید ترفندهایی مثل این ترفند وجود داشته باشد: چگونه مشکل عکسهای بدون بکگراند PNG را در IE6 حل کنیم؟)

اما فایرفاکس خوشبختانه مشکلی از این بابت ندارد. گوگل‌کروم هم اینطور که تست کردن پشتیبانی نمی‌کند!

تا وقتی GIF متحرک وجود دارد چرا باید از PNG متحرک استفاده کرد؟

خوب، مشکل اصلی GIF این است که (علاوه بر الگوریتم فشرده‌سازی قدیمی و نه چندان دلچسبی که دارد) نهاایتاً 256 رنگ را پشتیبانی می‌کند! و این یعنی عکس‌های با کیفیت (که در آن‌ها ممکن است میلیون‌ها رنگ به کار رفته باشد) را نمی‌توان در قالب GIF استفاده کرد. اما PNG در حالت 24 بیتی‌اش می‌تواند تا 16 میلیون رنگ را پشتیبانی کند. بنابراین با ظهور APNG =Animated PNG یکی از آرزوهای طراحان وب محقق خواهد شد: عکس متحرک با کیفیت و Transparent)

مثال: فرض کنید من می‌خواهم یک شخصیت انسانی متحرک روی بخشی از صفحه وبم حرکت کند. با توجه به اینکه ویدئو هم یک عکس طبیعی به حساب می‌آید و در آن ممکن است تا میلیون‌ها رنگ به کار رفته باشد، فرمت GIF نمی‌تواند آن چیزی که من می‌خواهم را تحویلم دهد!

به تفاوت این دو عکس دقت کنید (در فایرفاکس ببینید):

 عکس GIF متحرک

عکس PNG متحرک

هر چند عکس‌های انتخابی من تقریباً تعداد رنگ کمی دارد اما باز هم ضعف GIF در سایه‌ها و نور اطراف شخص به خوبی مشخص است! عکس PNG تقریباً هیچ افت کیفیتی ندارد.

با چه نرم افزاری PNG متحرک بسازم؟

شرکت موزیلا یک افزونه برای ساخت PNG متحرک ارائه کرده است، با نصب آن روی فایرفاکس، شروع به ساخت کنید:

https://addons.mozilla.org/en-US/firefox/addon/5519

با توجه به اینکه این افزونه روی Firefox 17 نصب نمی‌شود، من از این برنامه استفاده کردم:

Java APNG

(برای اجرا نیاز دارد که جاوا ۶ به بالا را روی ویندوز خود نصب کرده باشید)

پس از اجرا، فریم‌های خود را لود کنید و خروجی PNG متحرک بگیرید...

به نظر می‌رسد فرمت GIF به مرور به مرگ خود نزدیک می‌شود چرا که تنها چیزی که تا کنون آن‌را زنده نگه داشته خاصیت پشتیبانی از متحرک‌سازی بوده است.

موفق باشید؛
حمید رضا نیرومند

کلمات کلیدی: عکس، فرمت عکس، فرمت عکس در وب، فرمت Jpg ، دوربین دیجیتال، فرمت PNG ،عکس های متحرک، فرمت gif ، معرفی نرم افزار، نرم افزار متحرک سازی عکس