طريقة الاستخدام
- اقرأ الشاشة (بكسلات CSS): حجم الشاشة كاملةً كما يحسبه المتصفح.
- قارن الشاشة (البكسلات الفيزيائية) بالرقم المكتوب على علبة الشاشة أو في إعدادات النظام. وهو حجم CSS مضروبًا في نسبة بكسل الجهاز.
- تحقق من شاشة HDR ومعدل التحديث. اضغط أعِد القياس وأنت تنظر إلى هذه الصفحة، وأغلق البرامج الأخرى التي تستخدم الشاشة.
بكسلات CSS والبكسلات الفيزيائية
يقيس الموقع الشاشة بوحدة بكسل CSS، وهي وحدة الصفحة لا وحدة اللوحة نفسها. في الشاشة عالية الكثافة يُرسم بكسل CSS واحد ببكسلات فيزيائية عدة، ونسبة بكسل الجهاز تبيّن عدد البكسلات على كل ضلع. الهاتف الذي عرضه 390 بكسل CSS ونسبته 3 له 1170 بكسلًا فيزيائيًا عبر الشاشة.
نافذة المتصفح أصغر من الشاشة حين لا تكون مكبّرة. يتغير حجمها مباشرةً عند تغيير حجمها، وكذلك عند التكبير والتصغير، لأن التكبير يغيّر عدد بكسلات CSS التي تتسع لها الصفحة.
نسبة العرض إلى الارتفاع وعمق الألوان وHDR
نسبة العرض إلى الارتفاع هي العرض مقسومًا على الارتفاع، مختصرةً إلى كسر: 1920 في 1080 تساوي 16:9. ولبعض الشاشات أسماء شائعة: 16:9 و16:10 عريضتان، و4:3 هي المعيار القديم، و21:9 و32:9 فائقتا العرض. وإذا كان الكسر ذا حدود كبيرة، تعرض الصفحة أقرب نسبة شائعة وتضع أمامها كلمة نحو.
عمق الألوان هو عدد البتات المستخدمة لكل بكسل. عند 24 بتًا تستطيع الشاشة عرض 16,777,216 لونًا. وتعني HDR أن الشاشة تعرض نطاقًا أوسع من السطوع واللون؛ وتذكر الصفحة إن كان متصفحك يقول إن لديك شاشة من هذا النوع، باستخدام خاصية الوسائط CSS dynamic-range.
معدل التحديث
معدل التحديث هو عدد مرات إعادة رسم الشاشة في الثانية: 60 هرتز شائع، و120 أو 144 هرتز في الألعاب والشاشات الحديثة. تحسب الصفحة إطارات الرسوم المتحركة التي يرسمها المتصفح خلال ثانية واحدة، وتأخذ المسافة المعتادة بينها، فلا تغيّر بضعة إطارات مسقطة النتيجة. لا تعطي المتصفحات معدل اللوحة مباشرةً، لذلك فهذا قياس وليس قراءة مباشرة.
مثال: حاسوب محمول 1080p بتكبير 125 في المئة
لوحة حاسوب محمول بدقة 1920 في 1080 بكسلًا مع تكبير ويندوز بنسبة 125 في المئة تعطي نسبة بكسل جهاز 1.25. عندئذ يبلغ المتصفح عن شاشة بحجم 1536 في 864 بكسل CSS، أما الحجم الفيزيائي فيبقى 1920 في 1080.
الأرقام أدناه هي ما تعرضه الصفحة لهذه الحالة: نسبة العرض إلى الارتفاع 16:9، وفي الشاشة نحو 1.3 ميغابكسل بوحدات CSS.
| المقياس | القيمة |
|---|---|
| الشاشة (بكسلات CSS) | 1536 × 864 |
| الشاشة (البكسلات الفيزيائية) | 1920 × 1080 |
| نسبة بكسل الجهاز | 1.25 |
| نسبة العرض إلى الارتفاع | 16:9 · شاشة عريضة |
| ميغابكسل | 1.3 |
الأسئلة الشائعة
ما الفرق بين بكسلات CSS والبكسلات الفيزيائية؟
البكسلات الفيزيائية هي النقاط الفعلية في اللوحة. أما بكسلات CSS فهي الوحدة التي تستخدمها صفحات الويب، ويحوّلها المتصفح إلى بكسلات فيزيائية بحسب نسبة بكسل الجهاز. في الشاشات عالية الكثافة يكون حجم CSS أصغر من الحجم الفيزيائي.
لماذا يقول المتصفح إن عرض شاشتي 1536 بكسلًا على لوحة 1920 بكسلًا؟
يجعل تكبير ويندوز الشاشة تبدو أكبر، فيكون لها عدد أقل من بكسلات CSS. عند تكبير 125 في المئة تساوي 1920 بكسلًا فيزيائيًا 1536 بكسل CSS، والحجم الفيزيائي يبقى 1920.
ما معدل التحديث الجيد؟
60 هرتز هو المعدل المعتاد للعمل المكتبي ومشاهدة الفيديو. المعدلات الأعلى، مثل 120 أو 144 هرتز، تجعل الحركة أنعم في الألعاب والتمرير، وتغيّر كثير من الهواتف معدلها لتوفير البطارية.
لماذا تعرض الصفحة ”لا“ في خانة HDR مع أن شاشتي تدعمه؟
لا يُبلغ المتصفح عن HDR إلا إذا فعّل نظام التشغيل والشاشة معًا هذه الميزة له، فقد تعرض الشاشة التي تدعمها كلمة لا إذا كان HDR مغلقًا في إعدادات ويندوز أو macOS.
هل تستطيع هذه الصفحة معرفة طراز شاشتي؟
لا. تقرأ الصفحة الأرقام التي يعطيها المتصفح فقط: الحجم ونسبة البكسل وعمق الألوان والاتجاه وعلامة HDR. أسماء الطرز والأرقام التسلسلية غير متاحة لصفحات الويب.
هل تُرسل معلومات عن شاشتي إلى خادم؟
لا. تُقرأ كل القيم وتُقاس داخل متصفحك، ولا يُرسل شيء منها إلينا ولا يُخزَّن.
المصادر
- Wikipedia (باللغة الإنجليزية): Display aspect ratio
- Wikipedia (باللغة الإنجليزية): List of common display resolutions
- MDN (باللغة الإنجليزية): requestAnimationFrame
- MDN (باللغة الإنجليزية): dynamic-range media feature
- MDN (باللغة الإنجليزية): Screen.colorDepth
آخر مراجعة للأرقام والنص: الثلاثاء، 30 جمادى الأولى 1448 بعد الهجرة.