صورة 3000×2000 بكسل لا تصبح أوضح على الشاشة لمجرد أن metadata تقول 300 PPI بدل 72 PPI. وفي الطباعة، الرقم نفسه يصبح مهمًا لأنه يحدد كيف ستتوزع تلك البكسلات على مساحة مادية. الخلط بين البكسلات وPPI وDPI هو سبب كثير من النصائح المتناقضة حول “دقة الصورة”.
البكسل أولًا: هذا هو محتوى الصورة الرقمية
عندما تقول إن الصورة 3000×2000 بكسل، فأنت تصف عدد عينات الصورة على المحورين. هذا يعطينا ستة ملايين بكسل تقريبًا، وهو وصف مباشر لكمية التفاصيل الرقمية المتاحة قبل الضغط أو إعادة التحجيم.
بالنسبة للاستخدام على الويب، هذه الأبعاد أهم عادة من رقم PPI المكتوب في metadata. صورة 1200×800 ستبقى 1200×800 من حيث البكسلات سواء سُجلت كـ72 PPI أو 300 PPI، ما لم تقم بعملية resampling تغير عدد البكسلات نفسها.
عدد عناصر الصورة الرقمية على العرض والارتفاع. مثال: 3000×2000.
عدد بكسلات الصورة التي تُخصص لكل بوصة عند ربط الصورة بمقاس طباعة فعلي.
PPI وDPI في سياق الطباعة
ما معنى PPI في الطباعة؟
Adobe تعرف printed image resolution بأنها عدد البكسلات المخصصة لكل بوصة عند طباعة الصورة، وتقاس بـpixels per inch. كما توضح أن أبعاد الصورة تحدد إجمالي عدد البكسلات، بينما resolution تحدد كثافة توزيع هذه البكسلات عند الطباعة. [المصدر: Adobe Photoshop]
3000 pixels ÷ 300 PPI = 10 inches
إذا كانت الصورة عرضها 3000 بكسل وطبعتها على 10 بوصات، فأنت توزع 300 بكسل على كل بوصة. وإذا طبعتها على 20 بوصة من دون إضافة بكسلات جديدة، تصبح الكثافة 150 PPI.
رفع PPI وحده لا يخلق تفاصيل جديدة
إذا غيّرت خانة PPI من 150 إلى 300 مع تعطيل resampling، فإن عدد البكسلات يبقى نفسه ويصغر مقاس الطباعة المتوقع. Adobe توضح أن تغيير resolution من دون resampling يحافظ على كمية بيانات الصورة، ويغيّر العلاقة بين الدقة والحجم المطبوع. أما resampling فهو الذي يغير عدد البكسلات. [المصدر: Adobe]
وأين يأتي DPI؟
DPI تعني dots per inch، وتستخدم لوصف كثافة النقاط في نظام إخراج أو تمثيل رسومي. في الطباعة، الطابعة قد تستخدم عدة نقاط حبر لإنتاج لون أو درجة لونية مرتبطة ببكسل واحد من الصورة، لذلك PPI للصورة وDPI للطابعة ليسا رقمًا واحدًا يجب مساواته دائمًا.
في الويب، W3C تعرف dpi أيضًا كوحدة resolution في CSS إلى جانب dpcm وdppx. وتوضح أن 1dppx يعادل 96dpi ضمن علاقة CSS الثابتة بين inch وpx. هذا سياق CSS، وليس قاعدة تقول إن كل شاشة حقيقية فيها 96 نقطة مادية لكل بوصة. [المصدر: W3C CSS Values]
لماذا تبدو صورة صغيرة حادة على الهاتف؟
لأن الجودة المرئية لا تعتمد على رقم PPI في الملف وحده. تعتمد أيضًا على أبعاد الصورة بالبكسل، الحجم الذي تُعرض به، كثافة شاشة الجهاز، المسافة من الشاشة، وطريقة المتصفح في عرض الصورة.
إذا عرضت صورة 1200 بكسل بعرض 600 CSS pixels، فلدى المتصفح بيانات كافية لعرض أكثر من بكسل صورة لكل CSS pixel في بعض الظروف. أما إذا مددت صورة 400 بكسل لتغطي مساحة كبيرة، ستظهر محدودية الدقة أسرع.
هل 300 PPI قاعدة ثابتة لكل طباعة؟
لا. Adobe تصف 300 PPI كمعيار شائع للمطبوعات عالية الجودة التي تُشاهد من مسافة قريبة، لكنها تشير أيضًا إلى أن المطبوعات الكبيرة التي تُشاهد من بعيد قد تعمل بدقة أقل. [المصدر: Adobe — Printing Resolution]
إذن “300” نقطة بداية شائعة، لا قانون طبيعي ينطبق على بطاقة صغيرة ولوحة إعلانية بالطريقة نفسها.
كيف تعرف مقاس الطباعة المتوقع؟
استخدم أبعاد الصورة بالبكسل واقسمها على PPI المستهدف. صورة 2400×3000 بكسل عند 300 PPI تعطي تقريبًا 8×10 بوصات. عند 200 PPI تصبح 12×15 بوصة تقريبًا.
إذا احتجت مقاسًا أكبر من ذلك مع نفس PPI، تحتاج بكسلات أكثر أو resampling، والأخير يقدّر بكسلات جديدة ولا يستعيد تفاصيل لم تُلتقط أصلًا.
متى تهتم بالبكسلات ومتى تهتم بالكثافة؟
متى يهمك PPI فعلًا؟
لربط عدد البكسلات بمقاس فعلي على الورق وتقدير جودة التفاصيل.
للتأكد من أن الأبعاد بالبكسل كافية للمقاس المطلوب بدل الاعتماد على رقم metadata فقط.
حتى تعرف هل تغيّر عدد البكسلات فعلًا أم تغيرت فقط علاقة الطباعة.
ومتى تهتم بالبكسلات أكثر؟
في صور المواقع، أغلفة المقالات، شبكات المنتجات والشاشات، ركز أولًا على العرض والارتفاع بالبكسل، نسبة الأبعاد، وحجم الملف. رقم PPI المخزن داخل الصورة لا يحل مشكلة صورة أبعادها غير مناسبة للواجهة.
الشاشات والويب
ماذا عن شاشات Retina وHiDPI؟
على الشاشات عالية الكثافة قد يقابل CSS pixel الواحد أكثر من device pixel فعلي. لهذا تستخدم CSS مفهوم dppx، وتوضح W3C أن 1dppx يعادل 96dpi ضمن نظام وحدات CSS. الشاشة ذات 2dppx تستطيع استخدام مزيد من بكسلات الجهاز لرسم نفس المساحة المنطقية.
هذا يفسر لماذا قد تحتاج صورة بعرض 1200 بكسل لعنصر عرضه 600 CSS pixels حتى تبدو حادة على شاشة عالية الكثافة. هنا العامل العملي هو عدد بكسلات الصورة مقارنة بمساحة العرض وكثافة الجهاز، لا رقم PPI المخزن في الملف وحده.
هل تغيير PPI metadata يغير ظهور الصورة على الموقع؟
في الاستخدام المعتاد للويب، المتصفح يعتمد أساسًا على أبعاد الصورة وقواعد CSS التي تحدد حجم عرضها. تغيير metadata من 72 إلى 300 PPI من دون تغيير عدد البكسلات لا يحول صورة 800×600 إلى صورة أكثر تفصيلًا.
لذلك إذا كانت المشكلة صورة ضبابية على الموقع، افحص أبعاد البكسل والحجم المعروض وطريقة التحجيم قبل أن تبدأ بتعديل PPI.
ربط الفكرة بأداة الصور
عند استخدام أداة الصور في تولاتي، أهم ما تتحكم فيه للويب هو أبعاد البكسل والصيغة ومستوى الجودة. وإذا كان الملف سيذهب للطباعة، تعامل مع PPI ومقاس الطباعة في برنامج يدعم إعدادات الطباعة بوضوح.
يمكنك أيضًا الرجوع إلى دليل نِسَب أبعاد الصور لفهم الفرق بين شكل الصورة وأبعادها، وإلى دليل تقليل حجم الصور عند تجهيزها للويب.
للويب: ابدأ من الأبعاد الفعلية
استخدم أداة الصور في تولاتي لضبط أبعاد الصورة وحجمها حسب المكان الذي ستظهر فيه، بدل الاعتماد على رقم PPI وحده.
المصادر الرسمية المستخدمة
- Adobe Photoshop — Printed image resolution: العلاقة بين أبعاد البكسل وPPI ومقاس الطباعة وresampling.
- Adobe — Resolution specifications for printing images: إرشادات الدقة حسب نوع الطباعة ومسافة المشاهدة.
- W3C CSS Values and Units — Resolution Units: تعريف dpi وdpcm وdppx في CSS.