انواع فرمت های تصویری قابل استفاده در وب [مزایا و معایب]

منظور از فرمت های تصویری چیست؟

هر تصویر، در واقع یک سری اطلاعات و کدهای دیجیتال است. این کدها به روش های مختلفی تولید و ذخیره می شوند. به این روش ها فرمت تصویری گفته می شود. فرمت هر تصویر با عبارتی در انتهای فایل تصویر مشخص می شود. مثل jpg – png – gif و…

فرمت های مختلف هر کدام مزایا و معایبی دارند. ممکن است خصوصیات هر فرمت مادامی که تصویر بر روی کامپیوتر شماست زیاد مهم نباشد ولی برای استفاده از تصاویر در دنیای وب نیاز است فرمت ها را بشناسید و از هر فرمت در جایگاه مناسب خود استفاده کنید.

فرمت های تصویری متداول در صفحات وب

همانطور که عنوان شد فرمت های تصویری مختلفی وجود دارد. برخی فرمت ها صرفاً در دیوایس خاصی وجود دارند. مثلاً فرمت تصاویر برخی دوربین های دیجیتال RAW است و تصاویر دوربین گوشی های آیفون برند اپل HEIF است. اما 4 فرمت JPG – PNG – GIF و WEBP در دنیای وب بیشتر مورد استفاده قرار می گیرند.

در ادامه به معرفی فرمت های تصویری فوق خواهیم پرداخت و مزایا و معایب آنها را بررسی می کنیم.

معرفی فرمت پی ان جی (PNG)

تصاویر با فرمت PNG بیشتر برای اینفوگرافیک ها، بنرها و به طور کل تصاویری که شامل عکس و متن می باشد مورد استفاده قرار می گیرند

این فرمت تصویری کیفیت بسیار بالایی دارد و یکی از قابلیت های مهم آن زمینه شیشه ای ترنسپرنت است. ترنسپرنت به این معناست که پس زمینه تصویر بدون رنگ است و می توانید آن را روی عکسی دیگر قرار دهید.

کیفیت در فرمت های تصویری PNG تابعی از تعداد رنگ است. با کاهش تعداد رنگ های موجود، می توانید حجم فایل PNG را کاهش دهید. دقت کنید در این حالت صرفاً طیف های رنگی از عکس حذف می شوند و تصویر به سمت سیاه و سفید شدن پیش می رود اما کیفیت نهایی عکس تغییری نخواهد کرد.

نکته منفی تصاویر PNG حجم بالای آن است. در صورتی که تصویر شما دارای ابعاد بزرگ باشد یا طیف های رنگی متعددی در آن باشد حجم تصویر نهایی بالا خواهد رفت.

استفاده صحیح از از تصاویر PNG

• تصاویر سایز کوچک مورد استفاده در طراحی ها که نیاز است ترنسپرنت باشند
• تصاویر مینیمال با طیف رنگی کم
• آیکون های کوچک – لوگوی سایت – بک گراندهای رنگی و ساده

استفاده نادرست از تصاویر PNG

• تصاویر بزرگ پس زمینه یا اسلایدر
• تصاویر بزرگ نوشته‌های وبلاگ یا محصولات
• به طور کل تصاویری که نیاز به قابلیت ترنسپرنت ندارند

معرفی فرمت جی پی جی (JPG)

فرمت تصویری جی پی جی سال 1992 عرضه شده است، یک فرمت فشرده‌سازی اتلافی به شمار می‌آید که از تصاویر رنگی 24 بیت (هشت بیت برای هر کدام از سه رنگ قرمز، آبی و سبز) پشتیبانی می‌کند.

این فرمت بسیار پرکاربرد است و به دلیل حجم پایینی که دارد بیشترین مورد استفاده در وب سایت های اینترنتی را به خود اختصاص می دهد. بسیاری از شبکه های اجتماعی و پیام رسان ها تصاویر را با این فرمت به کاربران ارائه می کنند.

سایز تصاویر JPG تابعی از کیفیت و وضوح تصویر است. بر خلاف PNG برای کاهش حجم، نیازی به کاهش تعداد رنگ موجود در تصویر ندارید. می توانید با کاهش وضوح و کیفیت تصویر حجم آن را کاهش دهید. گاهی می توان با کاهش کیفیت و وضوح تصویر بدون آنکه این کاهش کیفیت به چشم آید، مقدار قابل توجهی از حجم تصاویر JPG را کاهش داد.

نکته منفی تصاویر JPG زمینه آنهاست. شما نمی توانید تصاویر ترنسپرنت با فرمت جی پی جی ایجاد کنید. اگر فرمت تصاویر ترنسپرنت PNG را به JPG تغییر دهید زمینه آنها سفید خواهد شد.

استفاده صحیح از از تصاویر JPG

• تصاویر بزرگ پس زمینه – تصاویر اسلایدر
• تصاویر نوشته‌های وبلاگ یا محصولات
• به طور کل تصاویری که نیاز به قابلیت ترنسپرنت ندارند
• تصاویری که دارای طیف رنگی گسترده ای هستند

استفاده نادرست از تصاویر JPG

• آیکون های کوچک – لوگوی سایت و به طور کلی تصاویری که باید ترسپرنت باشند
• تصاویری که بر روی آنها متون با فونت کوچک قرار دارد.

معرفی فرمت وب پی (WEBP)

فرمت WEBP فرمت جدیدی از تصاویر است که توسط گوگل در سال ۲۰۱۰ معرفی شد. این فرمت مانند PNG به صورت ترنسپرنت ارائه می شود و حجم بسیار پایین تری دارد. بنابراین از این فرمت تصویری می توانید برای تمامی تصاویر سایت خود بجای JPG و PNG استفاده کنید.

گوگل اعلام کرده است که فرمت وب پی در مقابل PNG در حدود ۲۶ درصد و در برابر JPG بین ۲۵ تا ۳۵ درصد حجم نهایی تصویر را کاهش خواهد داد.

نکته منفی فرمت WEBP این است که برخی از مرورگرهای قدیمی از آن پشتیبانی نمی کنند و اگر کاربر وب سایت شما دارای مرورگر خیلی قدیمی! باشد تصاویر سایت با فرمت WEBP را نمی تواند مشاهده کند.

معرفی فرمت گیف (GIF)

فرمت تصویری GIF را برای تصاویر متحرک و بنرهای تبلیغاتی به کار می برند. از آنجا که علم طراحی رابط کاربری استفاده از تصاویر متحرک را ایده خوبی نمی داند استفاده از این فرمت رو به افول است و طراحان وب کمتر از این فرمت تصویری استفاده می کنند.

بهتر است فقط در صورتی که نیاز به تصاویر متحرک دارید سراغ این فرمت بروید. در غیر این صورت سه فرمت JPG و PNG و WEBP برای تصاویر مناسب تر هستند.