يمكن النظر إلى الصور النقطية كمجموعة من إرشادات البكسل لعرض شبكة ثنائية الأبعاد. تشمل تنسيقات الصور النقطية الشائعة GIF (.gif) وJPEG (.jpg) وPNG (.png) وWebP (.webp). تختلف الطريقة التي يتم بها ضغط هذه التعليمات وترميزها، ما يؤدي إلى تباين كبير بين أحجام الملفات: قد تكون الصورة الفوتوغرافية التي تم ترميزها بتنسيق JPEG أقل من بضع مئات الكيلوبايت، في حين قد يبلغ حجم الصورة نفسها التي تم ترميزها بتنسيق PNG عدة ميغابايت، بدون أي اختلاف واضح في الجودة بالنسبة إلى المستخدم النهائي.
سيظهر مصدر الصورة النقطية الذي يتجاوز حجمه الأبعاد الأساسية مشوّهًا أو ممتلئًا أو معتمًا:
بالنسبة إلى الأعمال الفنية التي تحتوي على مستويات من التفاصيل الواقعية، تعد الصور النقطية الأداة المناسبة للمهمة.
تمامًا مثل الاختيار بين الصور النقطية والمتجهات، فإن اختيار النوع المناسب من الصور النقطية يعود في النهاية إلى حالة الاستخدام. عندما نقسم الصور النقطية إلى ترميزاتها، فإن ما نتحدث عنه حقًا هو الأساليب المستخدمة لوصف محتواها، وطرق الضغط (أو عدمها) التي نطبقها. تذكّر أنّ الخادم لا يرسل صورة عبر السلك إلى المتصفح، بل يرسل من تدفقات من وحدات البايت تصف شبكة البكسل التي تشكل تلك الصورة للعميل لكي يعيد إنشاؤها.
لذا، لتحسين تصور عملية ترميز شبكة من وحدات البكسل كبيانات بايت خارج البايت، أريدك أن تتخيل أنك تعمل كمتصفح ويب. لديك ورقة ورق رسم بياني بالمليمتر وحزمة معيّنة من أقلام التلوين التي تحمل اسم العلامة التجارية. أنا، بصفتي خادم الويب، لدي نفس الأشياء بالضبط - لكنني استخدمت بالفعل أقلام التلوين الخاصة بي لملء ورق الرسم البياني بصورة مصدر. إذا كنت أرسل إليك رسالة نصية عادية، فلا يمكنني إرسال الصورة نفسها إليك، ولكن يمكنني نقل معلومات حول مصدر الصورة بلغة يفهمها كل منا باستخدام المعيار المشترك لشبكة "البكسل" والألوان:
ابدأ من أعلى يمين الصفحة. الصف الأول، العمود الأول أزرق الصف الأول، العمود الثاني أزرق. الصف الأول، العمود الثالث أزرق. الصف الأول، العمود الرابع أحمر.
باستخدام هذه المعلومات النصية، ستتمكن من إعادة إنشاء الصورة الموجودة على ورق الرسم البياني الخاص بي بشكل مثالي.
قد لا يتم اعتبار الاختلافات بين تنسيقات الصور وطريقة ترميزها كبيانات، على أنّها طريقة تنسيق هذه المعلومات. على سبيل المثال، يمكن التعبير عن المعلومات التي أرسلتها إليك بسهولة كما يلي:
ابدأ من أعلى يمين الصفحة. في الصف الأول، تكون الأعمدة من واحد إلى ثلاثة زرقاء. الصف الأول، العمود الرابع أحمر.
سيؤدي أي من هذين الوصفين إلى الصورة نفسها، إلا أن الوصف الثاني ينجح في وصف الصورة نفسها باستخدام عدد أقل من الأحرف. هذه طريقة بدون فقدان لضغط بيانات الصورة: جميع المعلومات نفسها، وبالتالي لا يتم تقليل الدقة المرئية، ولكن يتم نقل عدد أقل من وحدات البايت عبر السلك منّي إليك من الخادم إلى محرك العرض. هذه هي اللغة العادية التي تعادل "ترميز طول التشغيل" لبيانات الصور، حيث يتم ترميز البيانات كقيمة يجب تكرارها وعدد، بدلاً من تكرار القيمة الكاملة عدة مرات.
وقد يبدو الضغط المعكوس كالآتي بدون إجراء مبتدئ عند القيمة الاسمية، فلماذا قد ترغب في أي وقت في أن تبدو صورك أسوأ؟ هذا ليس هو الحال تمامًا، ومع ذلك، تجدر الإشارة إلى أن أعيننا ليست لديها دقة مثالية أيضًا. ويُعد اختيار التنسيق والإعدادات الصحيحة لضغط الصور تمرينًا لإيجاد التوازن بين مستوى التفاصيل المرئية التي يمكننا إدراكها وكمية البيانات التي يتم إرسالها إلى المتصفح. يتم تحديد هذين العاملين من خلال محتوى الصورة المصدر الخاصة بنا.
تنسيقات الصور النقطية هي الأكثر إلمامًا بها كمطوّر برامج - GIF وJPEG وPNG وWebP وغيرها. ستتعرف على إمكانات كل منها في الوحدات القليلة التالية.