سلام خدمت همراهان همیشگی وب سایت پرنیان طرح
تصاویر با فرمت JPEG و PNG
در طی چند دهه اخیر ، اینترنت از یک چاپگر دیجیتال نقطهای به یک سرور پویا چند رسانهای ، از جمله تصاویر، ویدئو ، انیمیشنها و موارد دیگر تبدیل شده است.
با این حال، وقتی صحبت از عکسهای دیجیتال به میان میآید، ممکن است در مورد JPEG در مقابل PNG سردرگمی وجود داشته باشد،
به ویژه در زمان استفاده از هر کدام.
اگر به یک تصویر JPEG در کنار همان تصویر اما به صورت PNG نگاه کنید، احتمالاً هیچ تفاوتی نمی بینید.
این ایده آل است، زیرا هر دو فرمت تصویر با هدف باز تولید بهترین تصویر ممکن برای وب هستند.
اگرچه ، موارد استفاده و تکنیک های بهینه سازی مختلفی وجود دارد که باید به آنها توجه داشته باشید.
در این مقاله ، میخواهیم JPEG را با PNG مقایسه کنیم و به شما بگوییم که چه زمانی باید از هر فرمت تصویر استفاده کنید.
ابتداز، اجازه دهید هر دو این ها را به شما معرفی کنیم.
تفاوت بین JPEG و PNG
از نظر ظاهری ، هیچ تفاوتی بین JPEG و PNG وجود ندارد.
به عبارت دیگر، اگر ما دو تصویر را کنار هم قرار دهیم و از شما بخواهیم انتخاب کنید که کدام یک JPEG و کدام PNG می باشد،
در بیشتر مواقع نمیتوانید آن ها را از هم تشخصی دهید.
برای مثال ، تصویر زیر را بگیرید:
آیا میتوانید درباره اینکه آیا این پروانه مورمون قرمز یک تصویر JPEG یا PNG است، تصمیم بگیرید؟بدون چارچوب مرجع نمیتوان فرمت تصاویر را مقایسه کرد:
تفاوت های مشخصی بینشان وجود دارد، اما بینشان تفاوت زیادی ایجاد نمیکند.
JPEG چیست ؟
- کارشناسان مشترک عکاسی فرمت فایل Group (JPEG) فشرده سازی کم حجم تصاویر دیجیتال را ارائه می دهند.
- این به این معنی است که اگر تعادل بین عکس و اندازه فایل بیش از حد تغییر کند، کیفیت تصویر قابل توجه است.
- JPEG ها فایل های مسطح هستند. به عبارت دیگر، آنها نمی توانند شفافیت را در یک فایل نمایش دهند.
- در حالی که می توانید سطح فشرده سازی را تنظیم کنید ، حتی در بهترین تنظیمات یک JPEG یک فایل 8 بیتی خواهد بود که بر دامنه پویا تأثیر میگذارد.
- علاوه بر این، یک JPEG اغلب شامل یک نمایه رنگی است که به مانیتور میگوید چگونه رنگهای درون خود را نمایش دهند.
PNG چیست ؟
- در مقابل، گرافیک شبکه قابل حمل (PNG) فایل های آماده وب هستند. این فرمت پویاتر از JPEG است، با قابلیت خروجی فایل های 24 بیتی. همچنین یک فرمت بدون ضرر است، به این معنی که می توانید آن را بدون کاهش کیفیت تصویر کپی کنید.
- اگرچه، شما قادر به تنظیم فشرده سازی برای فایل های PNG نیستید و هیچ نمایه رنگی وجود ندارد. با وجود این، یک PNG بر اساس مشخصات فنی آن برای وب مناسب است.
واضح به نظر می رسد – PNG ها برای وب مناسب هستند و JPEG ها مناسب نیستند. خوب، این تمام داستان نیست. هر نوع فایل برای برنامه های خاص عالی است. در مرحله بعد، در مورد آنها بحث خواهیم کرد.
JPEG در مقابل PNG: زمانی که باید از هر کدام استفاده کنید را بدانید
وب بهترین بهره را از JPEG و PNG میبرد. اینجا زمانی است که باید از JPEG در مقابل PNG استفاده کنید:
اگر می خواهید عکسی را صرفا فقط نمایش دهید ، از JPEG استفاده کنید.
برای هر فایل دیگری – به ویژه گرافیک دیجیتال – از PNG استفاده کنید.
به عنوان مثال، اگر قصد دارید تصاویر را کپی کنید، از فرمت فایلی متفاوت از JPEG استفاده کنید.
در مقابل، PNG یک بازتولید 1 به 1 است زیرا فشردهسازی بدون تلفات را ارائه میکند.
همچنین، اگر می خواهید اندازه تصویر خود را پس از ذخیره آن تغییر دهید ، از JPEG استفاده کنید.
PNG ها از ساختار رمزگذاری متفاوتی استفاده می کنند که پس از تغییر ابعاد (یا سایر ویژگی های فنی) از بین می رود.
فرمت های تصویر دیگری که باید درباره آنها بدانید
البته، JPEG در مقابل PNG تنها مقایسه فرمت فایل تصویری نیست که باید در نظر گرفته شود.
انواع فایل های دیگری نیز وجود دارند که برای جلب توجه رقابت می کنند و موارد استفاده دیگری نیز دارند:
- فرمت رابط گرافیکی (GIF). اگر ویدیوی واکنشی را در توییتر پست میکنید که متحرک است، این یک GIF است. در واقع، PNG به دنبال جایگزینی فایلهای GIF در مشخصات اصلی خود بود، و هر دو لایههای شفافیت را ارائه میدهند.
- فرمت فایل تصویری برچسبگذاری شده (TIFF). این فرمت فایل مبتنی بر شطرنجی است به دلیل پشتیبانی از فضاهای رنگی CMYK، برای چاپ عالی است.
- قالب تصویر خام (RAW). شما فقط از این اگر یک عکاس هستید استفاده کنید، و RWA منحصر به دوربینی است که شما استفاده می کنید.
- در حالی که می توانید فایل های RAW را در رایانه خود مشاهده کنید، برای مشاهده آن به نرم افزار اختصاصی نیاز دارید. اندازه فایل نجومی است، زیرا داده ها کامل است. در واقع، فرمتهای RAW تصاویر نیستند، بلکه دادههایی هستند که وقتی کدگذاری میشوند، تصویر را نشان میدهند.
- فایل تصویری با کارایی بالا (HEIF). این فرمت فایل اصلی از دستگاه های iOS. فشردهسازی و اندازه فایل بهتری نسبت به JPEG ارائه میکند و میتواند بسیاری از قالبهای چندرسانهای مختلف را مدیریت کند.
در حالی که هر یک از این فایلهای تصویری در وب استفاده میشوند (به استثنای فایلهای RAW از نظر نمایش)، JPEG در مقابل PNG همچنان غالب است. هر دوی آنها موارد استفاده خاصی دارند که مزایا و معایب آنها به خوبی متعادل می شود.
چگونه تصاویر خود را برای آپلود (به 3 روش) آماده کنیم
علی رغم اینکه JPEG در مقابل PNG با توجه به کیفیت نمایش نهایی به صورت مساوی ارائه می شود، شما باید هر قالب را به روشی متفاوت مدیریت کنید تا بهترین نتیجه را از آن بگیرید. سه حوزه وجود دارد که می توانید بر روی اندازه فایل، کیفیت و آماده سازی کلی تصاویر خود تأثیر بگذارید:
- مطمئن شوید که ابعاد مربوط به موارد استفاده مرتبط با چیزی است که با آن مواجه خواهید شد.
- رزولیشن را برای تصویر خود انتخاب کنید که برای وب نیز مناسب است.
- از فشرده سازی “طمیمانه” برای کاهش بیشتر حجم فایل استفاده کنید. از تصاویر شما بدون تأثیر زیاد بر کیفیت استفاده می شود.
همانطور که انتظار دارید، تعادل خوبی در اینجا وجود دارد. بیایید با ابعاد تصویر شما شروع کنیم.
1. ابعاد خود را تنظیم کنید
ابعاد یک تصویر برای کاربر نهایی مهمتر از هر نقطه دیگری در زنجیره است. این به این دلیل است که مرورگر باید تصویر را بارگیری کند و یک فایل بزرگ باعث از بین رفتن تجربه کاربری (UX) می شود.
البته کیفیت هم مهمه اگر تصمیم دارید یک تصویر کوچک بسازید، کیفیت تصویر نهایی را تحت تأثیر قرار میدهد (برای JPEG بیشتر از PNG).
سنسور برش مدرن و فول فریم دوربینهای دیجیتال میتوانند تصاویری با ابعاد پیشفرض در حدود 6000 پیکسل در 3000 پیکسل تولید کنند (اگرچه تفاوتهای زیادی بین دوربینها وجود دارد).
برای تصاویر وبلاگ، این قانون 2000 پیکسلی حتی می تواند تا 1000 پیکسل نیز کم باشد. همچنین این تصاویر با وضوح بالا یا “رتینا” را در نظر می گیرد. آنها اغلب به دو برابر ابعاد نیاز دارند تا در صفحه نمایش های با وضوح بالا نمایش داده شوند. در واقع، رزولوشن مکان خوبی برای رفتن به مرحله بعدی است.
2. رزولوشن مناسب
رزولوشن مناسب را تنظیم کنید
یکی از عناصر اساسی صفحه نمایش دیجیتال پیکسل ها هستند. این نقاط ریز کل صفحه نمایش را تشکیل می دهند، اگرچه پیکسل ها یک اندازه نیستند. به همین دلیل، هنگام تهیه تصاویر JPEG و PNG خود باید وضوح تصویر را نیز در نظر بگیریم.
برای مثال، این اسکرین شات از دسکتاپ macOS Big Sur بگیرید:
این یک PNG است، با 1000 پیکسل. اگرچه، از 144 PPI استفاده می کند – اگرچه مقداری “جادوی” آپلود وجود دارد که وضوح را به 72 PPI در هنگام آپلود در وردپرس تبدیل می کند.
تصاویر PNG و JPEG هر دو میتوانند از PPI بسیار بالاتری نیز استفاده کنند – آماده چاپ حدود 300 DPI/PPI است. علاوه بر این، بسیاری از تصاویر از سایت های عکس سهام مانند Pixabay با استفاده از 300 PPI دانلود میشود:
به این ترتیب، کاهش این مقدار تصاویر شما را بهتر برای وب و نمایشگرهای مختلف آن آماده می کند.
3. تصاویر خود را با استفاده از فشرده سازی بهینه کنید
این موضوعی است که می توانید در جای دیگری از وبلاگ پیدا کنید و تقریباً همه کاربران وردپرس می دانند که تصاویر را قبل یا در حین آپلود بهینه کنند.
این مصنوعات باید حداقل باشند تا تصاویر را به خوبی ارائه دهند.
به همین دلیل، ابزارهای زیادی برای انجام کار وجود دارد. قابل دسترس ترین ابزار TinyPNG است، اگرچه JPEG نیز فشرده سازی می کند:
هر چند، فشرده سازی اعمال شده روی برخی از تصاویر ملایم است، که ممکن است اندازه فایل را به اندازه کافی پایین نیاورد.
نکته مهم در اینجا این است که شما باید سطح فشرده سازی را با اندازه فایل و همه عناصر دیگر تصویر متعادل کنید.
در بخش بعدی، بهترین رویکرد را مورد بحث قرار خواهیم داد.
JPEG در مقابل PNG: چگونه از هر فرمت حداکثر استفاده را ببریم
علیرغم تفاوتها در قالبهای فایل، ماهیت مرور وب به این معنی است که میتوانید تصاویر خود را به موارد زیر خلاصه کنید:
- از ابعادی بین 1000 تا 2048 پیکسل در لتصاویر با طول بلندتر استفاده کنید.
- رزولیشن 144 PPI را برای همه تصاویر خود تنظیم کنید تا مطمئن شوید که در همه صفحهها واضح و شفاف هستند.
- از فشرده سازی ظریف از طریق بهینه سازی تصویر برای کمک به کاهش اندازه فایل استفاده کنید. با در نظر گرفتن همه چیز، اندازه اکثر تصاویر حدود 100 تا 200 کیلوبایت خواهد بود.
بر اساس فرمتهای فایل خاص، کمی بیشتر در اینجا وجود دارد:
- برای فایلهای PNG، کاهش ابعاد میتواند کیفیت تصویر را بیش از حد کاهش دهد. ایده در اینجا این است که وضوح تصویر را تا حد امکان بالا نگه دارید تا این عوامل کاهش یابد.
- فایلهای JPEG در برابر کپی کردن مقاومتی ندارند، زیرا هر تکراری نسبت به قبلی ضعیفتر است. اگر می توانید کنترل کنید که JPEG از کجا می آید (به عنوان مثال، اگر عکس گرفته اید)، یک JPEG از یک فایل TIFF یا RAW ایجاد کنید تا کیفیت درون تصویر حفظ شود.
- طبق تجربه ما، JPEG ها انجام نمی دهند. فشرده سازی و همچنین سایر فرمت های فایل را انجام ندهید. این بدان معنی است که آماده سازی و بهینه سازی آن تصاویر قبل از رسیدن به مرحله فشرده سازی مهم است.
تا کنون، باید درک کاملی از JPEG در مقابل PNG، زمان استفاده از آنها و نحوه آماده سازی فایل های خود داشته باشید.
در نتیجه
به نظر می رسد که تصاویر مرورگر وب را اجرا می کنند. به همین دلیل، ما تعدادی فرمت فایل داریم که به ما کمک می کند کیفیت مناسب را در اندازه فایل قابل احترام برای برنامه ارائه دهیم.
JPEG در مقابل PNG یک مقایسه رایج است زیرا مشخص نیست که هر کدام در چه مواردی خوب هستند، و آنها دو فرمت تصویر محبوب هستند.
به طور خلاصه، JPEG برای عکس ها و PNG ها برای گرافیک هستند. برای تهیه فایل های خود، نگرانی اصلی باید حفظ کیفیت تصویر بالا باشد تا اندازه فایل. با این حال، در حالی که تنظیمات رزولوشن بزرگترین تغییرات را به شما میدهند، تأثیر بیشتری بر کیفیت تصویر دارد.
ترفند این است که ابعاد، وضوح، و فشرده سازی را متعادل کنید تا به تصویر آماده وب نهایی برسید.
آیا همانطور که در اینجا توضیح داده ایم تصاویر خود را برای وب آماده می کنید یا کاری متفاوت انجام می دهید؟ در بخش نظرات زیر به ما اطلاع دهید!