ما هي دقة شاشتي؟
اطّلع فورًا على دقة شاشتك، وحجم نافذة المتصفح، وكثافة البكسل، وعمق الألوان، ودعم اللمس — مع نسخ بنقرة واحدة.
1,064 مشاهدة
غيّر حجم النافذة — تتحدث أرقام منفذ العرض مباشرةً.
ما الذي تقيسه "نسبة بكسل الجهاز" فعليًا
لكل شاشة عرض شبكة ثابتة من البكسلات الفعلية — دقتها الأصلية — لكن صفحات الويب تُنسَّق ببكسلات CSS، وهي وحدة مستقلة عن الدقة. نسبة بكسل الجهاز (DPR) هي معامل التحويل بينهما: عدد البكسلات الفعلية التي يُرسَم بها بكسل CSS واحد. على شاشة بكثافة عادية، تكون DPR تساوي 1 وتتطابق القيمتان واحدة لواحدة. على شاشة "Retina" أو عالية الكثافة، تكون DPR عادةً 2 أو 3، أي أن بكسل CSS واحدًا يُرسَم فعليًا عبر كتلة 2×2 (4 بكسلات فعلية) أو 3×3 (9 بكسلات فعلية). لهذا يبدو النص والأيقونات أوضح بشكل ملحوظ على تلك الشاشات: يملك نظام التشغيل والمتصفح أربعة أو تسعة أضعاف عدد النقاط الفعلية المتاحة لرسم البكسل المنطقي نفسه، فلا تحتاج المنحنيات والحواف إلى تقريب خشن.
تقرأ هذه الصفحة هذا الرقم، إلى جانب كل شيء آخر في البطاقة أعلاه، مباشرة من واجهات برمجة تطبيقات المتصفح الحقيقية: يُبلغ window.screen عن عرض العرض الأصلي وارتفاعه وعمق ألوانه، بينما يُبلغ window.devicePixelRatio عن نسبة CSS إلى البكسل الفعلي. تأتي قياسات منفذ عرض المتصفح من window.innerWidth/innerHeight، ولهذا يكون هذا الرقم أصغر من دقة الشاشة — فهو يستبعد المساحة التي تشغلها التبويبات وشريط العنوان وحواف النافذة. غيّر حجم النافذة وستتحدث هذه الأرقام مباشرة، لأنها تُقرأ مباشرة من المتصفح، لا من ذاكرة مؤقتة.
أين يفيدك هذا
من الاستخدامات النموذجية: وصف إعدادك بدقة للدعم الفني دون تخمين الأرقام، والتحقق من الأبعاد بالبكسل التي سيتعين على تصميم متجاوب فعليًا العمل بها على جهازك، والتأكد من أن شاشة موصولة حديثًا تفاوضت على دقتها الأصلية بدلاً من وضع احتياطي أقل، أو التحقق من أن تلفازًا موصولًا كشاشة ثانية التقط الإشارة الصحيحة. يلتقط زر النسخ بنقرة واحدة ملخصًا نصيًا نظيفًا لكل قيمة، جاهزًا للصق مباشرة في تذكرة دعم أو تقرير خلل.
يعمل عمق الألوان، المعروض أيضًا في البطاقة، وفق مبدأ مشابه لكل قناة على حدة كنسبة البكسل: تخصص شاشة نموذجية بعمق 24 بت 8 بتات لكل من الأحمر والأخضر والأزرق، مما يمنح نحو 16.7 مليون لون ممكن لكل بكسل، بينما تُبلغ بعض الشاشات الاحترافية وشاشات HDR عن عمق 30 أو 36 بت لتدرجات أدق. يكمل الاتجاه (عمودي أو أفقي) ودعم اللمس الصورة، وكلاهما يُقرأ مباشرة من واجهتي window.screen وnavigator نفسيهما بدلاً من تخمينهما من أبعاد الشاشة أو استنشاق معلومات وكيل المستخدم.
الأسئلة الشائعة
لماذا يكون منفذ عرض متصفحي أصغر من دقة شاشتي؟
منفذ العرض هو منطقة الرسم الداخلية للمتصفح فقط — تأخذ التبويبات وشريط العنوان وشريط المفضلة وإطار النافذة كل منها نصيبها من الشاشة. الانتقال إلى وضع ملء الشاشة يزيل معظم هذا العبء، مقرِّبًا الرقمين إلى أقصى حد.
ماذا تعني نسبة بكسل الجهاز عمليًا؟
هي عدد البكسلات الفعلية التي تمثّل بكسل CSS واحدًا. نسبة تساوي 2 تعني أن صفحة عرضها "1000 بكسل" في CSS تُرسَم فعليًا باستخدام 2000 بكسل فعلي عبرها — وهذا الإفراط في أخذ العينات هو ما يجعل النص والأيقونات تبدو حادة على شاشات من فئة Retina.
لماذا لا تطابق الدقة المُبلَّغ عنها ورقة مواصفات شاشتي؟
بسبب تحجيم عرض نظام التشغيل. عند تحجيم 150%، على سبيل المثال، تُبلغ لوحة فعلية بعرض 2880 بكسل عن 1920 بكسل منطقي فقط لصفحات الويب. لا تزال اللوحة تستخدم كل بكسل فعلي تملكه — نظام التشغيل يرسم كل شيء بحجم أكبر فقط للحفاظ على قابلية قراءة النص.
هل واجهتا window.screen وwindow.devicePixelRatio موثوقتان عبر المتصفحات؟
نعم — هما واجهتا برمجة تطبيقات قياسيتان ومدعومتان منذ زمن طويل، إلا أن window.screen تعكس العرض الفعلي الكامل بينما تعكس قيم منفذ العرض نافذة المتصفح الحالية فقط، لذا فإن إجابة الرقمين على سؤالين مختلفين أمر متوقع، لا خلل.
هل تستطيع هذه الأداة اكتشاف ما إذا كانت شاشتي تدعم إدخال اللمس؟
نعم — تتحقق من قدرة الإدخال على اللمس عبر دعم المتصفح لأحداث pointer وtouch، وهذا ما يتيح للبطاقة الإبلاغ عمّا إذا كانت شاشتك الحالية تدعم اللمس إلى جانب دقتها وعمق ألوانها.
أدوات مشابهة
الإبلاغ عن مشكلة
ما هي دقة شاشتي؟
التعليقات
لا توجد تعليقات بعد — كن أول من يكتب تعليقًا!