使用清晰可辨的字体大小

أولا ،

معلومات أخرىبالإضافة إلى ذلك ،أربع وحدات شائعة الاستخدام

• استخدم حجم الخط بالنسبة للخط المرجعي لتحديد نسبة التنضيد.
• يرجى قراءة بعناية^{دليل التنضيد للأندرويد}.
• للحصول على اقتراحات الخطوط الأخرى للأجهزة المحمولة ، انظر

 

^{دليل التنضيد للأندرويد}يمكنك استخدام ما يلي

انظر تعليمات أخرى.مواصفات CSS 2.1*

البكسل هو "بكسل CSS" ، والذي يختلف حسب حجم الجهاز وكثافته.اضبط منفذ العرضيتم تشغيل هذه القاعدة عندما يكتشف PageSpeed Insights أن النص على صفحة ويب صغير جدًا بحيث لا يمكن التعرف عليه.

 

1. استخدم حجم الخط القياسي مع 16 CSS بكسل. اضبط حجم الخط حسب الحاجة وفقًا لخصائص الخط الذي تريد استخدامه.
2. الحد من عدد الخطوط المستخدمة ونسبة التنضيد: يمكن أن يؤدي عدد كبير جدًا من الخطوط وأحجام الخطوط إلى جعل تخطيط صفحة الويب فوضويًا ومعقدًا للغاية.
3. EM والنسبة المئوية هي وحدات "نسبية": هاتان الوحدتان فيما يتعلق بحجم الخط المستخدم وسماته. 1 EM يعادل 100 ٪.
4. لتحديد حجم خط صفحة الويب: البكسل (px) ، النقطة (pt) ، EM(em) والنسبة المئوية (٪).

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

body {
  font-size: 16px;
}

.small {
  font-size: 12px; /* 75% of the baseline */
}

.large {
  font-size: 20px; /* 125% of the baseline */
}

 

أخيرًا ، لكل خط خصائصه الخاصة: الحجم ، التباعد ، إلخ. بشكل افتراضي ، يعرض المتصفح كل خط في 16 بكسل (CSS بكسل). ينطبق هذا الإعداد الافتراضي على معظم الحالات ، ولكن قد تحتاج بعض الخطوط المحددة إلى تعديل إضافي ، مما يعني أنه يمكنك تعيين حجم خط افتراضي أقل أو أعلى لتناسب الخصائص المختلفة للخط. بعد ذلك ، بعد تعيين الحجم الافتراضي ، يرجى تحديد خطوط أكبر وأصغر وفقًا لحجم البكسل الافتراضي ، وذلك لضبط حجم النص للأنواع الرئيسية والثانوية وغيرها من المحتويات على صفحة الويب.فتحة الرؤية.

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

، لفهم كيفية تعريف وحدات الطول. تحتوي المواصفات على وحدات أخرى غير مذكورة هنا: بوصة ، سنتيمتر ، مليمتر ، شاحنة صغيرة. بالإضافة إلى ذلك ، هناك شيء واحد يمكن تجاهله بسهولة وهو أن 1 بوصة في CSS لا تساوي بالضرورة 1 بوصة مادية.

يتم تعريف النقاط فيما يتعلق بالبكسل. بكسل واحد هو 0.75 نقطة

على سبيل المثال ، تحدد مقتطف كود CSS التالي حجم الخط الأساسي لـ 16 بكسل CSS ، حيث يتم تعريف حجم الخط على أنه 75 ٪ من حجم الخط الأساسي (أي 12 بكسل CSS) في فئة CSS "small" ، في فئة CSS "large" ، يتم تعريف حجم الخط على أنه 125 ٪ من حجم الخط الأساسي (أي 20 بكسل CSS):

 

باستثناء ملاحظة أخرى، فإن محتوى هذه الصفحة مرخص به بموجبالسمة المشتركة الإبداعية 3.0 License)، ورخصات الرموز المرخصة بموجب القانون (طراز Apache 2.0 Licenseمن أجل المفصولين، انظرالسياسات الموقعية.