ما هو الفرق بين صيغ الصور المتنوعة (webp, jpg, png, gif)

المدونة > ما هو الفرق بين صيغ الصور المتنوعة (webp, jpg, png, gif)




ما هو الفرق بين صيغ الصور المتنوعة (webp, jpg, png, gif)
ما-هو-الفرق-بين-صيغ-الصور-المتنوعة-(webp,-jpg,-png,-gif)
إشترك في بوت التيليجرام الخاص بنا من أجل الحصول على آخر المقالات، إضغط هنا.

المقدمة

إن معرفة صيغ الصور والفرق بينهم أمرٌ مهم في مجال التصميم حيث كل صيغة لها إستخدام معين مثلاً في مجال التصميم او التصوير الفوتوغرافي او حتى الطباعة ف من البديهي ان يعرف المصمم الفرق بين جميع صيغ الصور، والتي يمكن تلخيصها بالتالي:


GIF

اختصار لـ  Graphics Interchange Format تعتبر من اشهر واقدم الصيغ الموجودة في شبكة الانترنيت، تستطيع صيغة GIF بضغط الصورة بنسبة 40%، ومن ابرز استخداماتها هي الصور المتحركة حيث ان في الصورة المتحركة تكون حجم ملفات كبير حسب ضغط المستخدم للصورة حيث تكون ملائمة للصور المتحركة.

كرة متحركة

مميزات:

  1. افضل صيغى تدعم الصورة المتحركة.
  2. يدعم الصورة الشفافة لاكن ليس بمستوى الـ PNG.
  3. ضغط وحجم مناسب للصورة العادية.

عيوبها:

  1. الصور المتحركة تكون كبيرة الحجم.
  2. لا تدعم ميزة التدرج اللوني لانها لا تتخطى الـ 256 لون مثل PNG.
  3. من اقدم الصيغ الموجودة في الانترنيت.


JPEG

اختصار لـ Joint Photographic Experts Group او (JPEG, JFIF ,JPG ,JPE) تعتبر من اشهر الصيغ الشائعة في شبكة الانترنيت من بعد الـ GIF وتتميز بضغط عالي للصور حيث تستطيع صيغة الـ JPEG ضغط الصورة 20 مرة وبشكل ممتاز، على سبيل المثال صورة بحجم الـ 400 بايت تتحول لـ 20 بايت، وبسبب الضغط الهائل التي تسببها هذا الصيغة تسبب ايضاً قلة في جودة الصورة.

الفرق بين JPG و PNG


مميزاتها:

  1. تقوم بضغط الصورة بشكل ممتاز جداً وهذا ما يميزها عن باقي الصيغ.
  2. الاكثر شيوعياً واستخداماً بين الصيغ الاخرى.
  3. تدعم الألوان المتنوعة من 24 لون الى 16 مليون لون لذالك تكون غنية بلالوان. 

عيوبها:

  1. تفقد الصورة البعض من التفاصيل.
  2. كثرة الضغط تسبب في تلف الجودة.
  3. لا تدعم الشفافية عكس الـ PNG.
  4. لا تدعم الصورة المتحركة عكس الـ GIF.


PNG

اختصار لـ Portable Network Graphics تم انشائها عام 1996 لتطوير صيغة الـ JPG و GIF حيث تمتاز بميزة الشفافية والجودة والحجم الممتاز، تدعم التدرج اللوني RGB وتمتلك حدود لوني لا يتجاوز الـ 256 لون كما انها لا تدعم النموذج اللوني CMYK وهي مناسبة لنقل الصور على شبكة الانترنيت او إستخدامها لتكوين الصور الشفافة او لصناعة الشعارات (Logo) لوجود الشفافية والجودة الممتازة.

صورة نرد احمر

مميزاتها:

  1. افضل من يدعم الشفافية.
  2. لا تفقد جودتها بالضغط , على عكس الـ JPG.
  3. حجمها جيد مقارنتاً بـ GIF , لاكن ليست مثل الـ JPG من ناحية الحجم.
  4. مناسبة جداً لضغط الصور.

عيوبها:

  1. ليست جيدة في الصور الكبيرة حيث ان جودتها تزداد وفي هذا الحالة وتكون الـ JPG أنسب في هذه الحالة.
  2. لا تدعم الصورة المتحركة مثل GIF.
  3. لا تدعم ميزة التدرج اللوني لانها لا تتخطى الـ 256 لون مثل GIF.


WebP

صيغة WebP هي صيغة صور حديثة مفتوحة المصدر ومطوَّرة من Google في عام 2010 بناءً على صيغة الفيديو VP8. منذ ذاك الحين، ازداد عدد مواقع الويب (وتطبيقات الهاتف) التي تستخدم صيغة WebP ازديادًا كبيرًا. يدعم متصفحا Google Chrome و Opera صيغة WebP دون إضافات، وهذان المتصفحات مسؤولان عن عرض 74% تقريبًا من صفحات الويب، مما يضمن أنَّ عددًا كبيرًا من المستخدمين يمكنهم تصفح المواقع بشكل أسرع فيما لو استعملت تلك المواقع صورًا بصيغة WebP.

صورة webp

مميزاتها:

  1. حجم اصغر بكثير حيث إنها تدعم ضغط الصور.
  2. تدعم الشفافية كما هو الحال في صيغة الـ PNG.
  3. تدعم الصور المتحركة حيث يكون حجمها اقل بنسبة 64% من الصور المتحركة التي تحمل صيغة GIF.

عيوبها:

  1. تفقد الصورة القليل من التفاصيل لكثرة الضغط.
  2. مازالت غير مدعومة في بعض المتصفحات.


TIFF

اختصار لـ Tagged Image File Format وهي من الصيغ الغير معروفة عند البعض لاكنها معروفة عند مصممين الجرافك والمهتمين بالتصميم الفوتوغرافي كما انها ذات جودة عالية جداً وتمتلك شعبية بين مستخدمين انضمة IOS التابعة لشركة Apple.

صورة HD

مميزاتها:

  1. تمتلك جودة عالية جداً.
  2. تدعم جميع انواع الضغط.

عيوبها:

  1. حجمها كبير جداً.
  2. لا تدعمها جميع المتصفحات.


RAW

اختصار لـ Rules As Written او Read As Write وهي صيغة غير مضغوطة وموجهة لملفات الكامرات الرقمية او الرسومات الرقمية عند التصوير، وهي من افضل الصيغ التي يتم استعمالها من خلال المصوريين وصناع المحتوى حيث تمتلك اقصى درجة من جودة الصورة ولديها الكثير من الامتدادات الكثيرة لتنوع اجهزة التصوير.

RAW vs JPEG in PHOTOSHOP

مميزاتها:

  1. موجهة الى الكامرات الرقمية والرسومات الضوئية.
  2. تمتلك جودة عالية جداً.
  3. تدعم جميع انواع الضغط.

عيوبها:

  1. تمتلك حجم كبير جداً.
  2. تدعم جميع انواع الضغط.
  3. لا يمكن استخدامها في صفحات الويب.


ICO

وهي عبارة عن صيغة خاصة لايقونات نظام ويندوز التابع لشركة مايكروسوفت وتستخدم أحياناً كأيقونة رئيسية للمواقع الإلكترونية حيث انها ممتازة في الجودة وتستطيع تكبير الايقونات بدون فقد في دقة الصورة كما انها تحتوي على 16.7 مليون لون وداعمة للتدرج اللوني RGB وتصل ابعادها من 32x32 حتى 64x64 و 128x128 ..إلخ.

ايقونات ويندوز

مميزاتها:

  1. تتخصص في الايقونات فقط.
  2. داعمة للتدرج اللوني حيث تصل الوانها الى 16.7 مليون لون.
  3. يمكنك تكبير الايقونات حسب استخدامك.

عيوبها:

  1. يدعمها فقد نظام مايكروسوفت ويندوز ولا تدعمها باقي الانظمة.
  2. لا يمكن إستخدام الصيغة في الإستخدام العادي لانها تتخصص في الايقونات فقط.


SVG

اختصار لـ Scalable Vector Graphics وهي صيغة يتم تكوينها بإستخدام ترميز الـ XML حيث إن هذه الصيغة غير قابلة للضغط ويمكن إنشائها من خلال برنامج Adobe Illustrator أو البرامج المشابهة له وتدخل ايضاً في تصميم المواقع الإلكترونية لرسم انماط معينة خالية من ضغط تشوهات الجودة حيث ان لغة الـ XML تقوم بوصف الصورة من خلال تعليمات شبه برمجية ولا تتعامل بالـ Pixels ولهذا السبب تعتبر مناسبة اكثر لصفحات الويب.

مثال صورة svg

مميزاتها:

  1. عالية الجودة وكثرة تفاصيلها لعدم وجود الـ Pixels.
  2. لا تعتمد على البسكلات في عَرضها بسبب إستخدامها ترميز الـ XML.
  3. تستخدم في واجهات الويب.
  4. يدعمها جميع متصفحات الويب.

عيوبها:

  1. لا تضغط الصورة مثل باقي الصيغ.
  2. لا تستطيع تكوين الصور الطبيعية فهيه ترسم بخوارزمية معينة مثل ما يفعله برنامج Adobe Illustrator.


ماهي افضل صيغة مناسبة لمواقع الويب

ان كان استخدامك للصور على مواقع الويب فـ صيغة الـ WebP مناسبة لك حيث انها تدعم جميع ميزات الصيغ الأخرى ومشكلتها الوحيدة هي لاتزال غير مدعومة في بعض المتصفحات، لكن بعد مرور سنة او اكثر قد تكون اكثر استخداماً وستصبح هذه الصيغة هي الصيغة الوحيدة المستخدمة في جميع أرجاء عالم الإنترنت، ويمكنك التحقق من دعم المتصفحات لهذه الصيغة من خلال لغة البرمجة Javascript فبالنسبة للمتصفحات الغير داعمة لهذه الصيغة تستطيع ان تستخدم باقي الصيغ مثل (jpg, png, gif) اليك استخدام باقي الصيغ بالشكل المناسب:



png or jpg or gif for web


ما هي افضل صيغة للتصميم

ان افضل صيغة للتصميم بشكل عام تكون الصيغ الغير قابل للضغط مثل RAWTIFF بسبب الجودة الممتازة التي تحتويها. صناعة الشعار يكون بصيغة الـ SVG التي تكونها برامج عديدة خاصة بالتصميم منها برنامج الـ Adobe Illustrator ويتم ضغط الصورة بصيغة الـ PNG كما موضح بالصورة ادناها:

svg ,png ,jpeg


تحويل أي الصيغة الى صيغ اخرى

تستطيع ان تحول الصيغ بكل سهولة من خلال أي برنامج يخص التصميم حيث أن جميع برامج التصميم تدعم الصيغ وبانواعها.

هنال خطوى اخرى تستطيع القيام بها فهنالك مواقع لها خدمات تخص تحويل الصيغ الى الصيغة الملائمة لاستخدامك، تستطيع البحث عنها كما موضح لك في الصورة ادناها:

png to


الخلاصة

لكل نوع من الأنواع المذكورة سابقاً إستخدام مخصص ولا توجد افضل صيغة للصورة فكل صيغة لها استخدام معين ومميزات محددة وكمصمم يجب عليك ان تعرف جمع المزايا والعيوب لكل صيغ الصورة.


اطلب تصميم احترافي الأن
من خلال إختيارك لشركتنا، كن متأكداً من إن التصميم الذي تطلبه سيكون على الشكل الذي تريده وافضل وذلك من خلال العمل الشاق الذي اعتدنا عليه لتقديم افضل خدمة لزبائننا والأفراد الذين يتعاملون مع شركتنا.

هل كانت هذه المقالة مفيدة ؟
نعم
كلا

التعليقات

يرجى مليء الحقول التالية بالبيانات الصحيحة من اجل إضافة تعليق الى الصفحة.

ل
للتدوين فنون | عالمك نحو عال
السلام عليكم اود قالب المدونه لموقعي الالكتروني https://www.forbloggingarts.ga/
3
1
0

يرجى مليء الحقول التالية بالبيانات الصحيحة من اجل إضافة رد الى هذا التعليق.

ل
للتدوين فنون | عالمك نحو عال
السلام عليكم اود قالب المدونه لموقعي الالكتروني https://www.forbloggingarts.ga/
2
0
0

يرجى مليء الحقول التالية بالبيانات الصحيحة من اجل إضافة رد الى هذا التعليق.