R051: تباعد حروف مطبَّق على نص عربي (يكسر الخط المتصل)

الحروف العربية تتصل على خط أساس واحد، فالتباعد الموجب يكسر الوصل والسالب يُراكب أشكال الحروف، وغالبًا ما يأتي من سلّم طباعي لاتيني لم يُستثنَ منه النص العربي.

الفحص

المعرّف: R051
الفئة: الطباعة
الخطورة الافتراضية: عالية

متى يُطلق ملاحظة

عالية
نص ظاهر فيه 3 حروف عربية على الأقل، وletter-spacing سالب بمقدار بكسل أو أكثر. حروف الخط المتصل متصلة أصلًا، فتقريبها يُراكب أشكالها وتتلطخ الكلمة.
الإصلاح: اضبط letter-spacing: 0 للمقاطع العربية. القيمة السالبة المضبوطة لخط عناوين لاتيني لا مقابل لها في العربية، فالحروف متصلة أصلًا.
عالية
الحالة نفسها مع letter-spacing موجب: تفريق الحروف يكسر الوصل، فيُقرأ النص كأنه خط مكسور.
الإصلاح: اضبط letter-spacing: 0 للمقاطع العربية (مثلًا بإعادة ضبط عبر :lang(ar)).

ما الذي يتجاهله عمدًا

التباعد الأقل من بكسل، فهو يُقرَّب إلى الصفر، والنص الذي فيه أقل من 3 حروف عربية. حتى ثماني حالات في الصفحة.

قبل الإصلاح وبعده

before.css

h1 {
  letter-spacing: -0.02em;
}

after.css

h1 {
  letter-spacing: -0.02em;
}
:lang(ar) h1 {
  letter-spacing: 0;
}

افحصه يدويًا

حدّد النص وشغّل getComputedStyle($0).letterSpacing في وحدة تحكم DevTools. أي قيمة غير normal أو 0px على العربية هي الملاحظة.

ما يعرضه لك التقرير

تحمل كل ملاحظة من R051 ما ينطبق عليها من الحقول أدناه، فترى سبب ظهورها دون إعادة الفحص.

letterSpacingPx: التباعد المحسوب، بالبكسل.
direction: tightened (مضغوط) أو loosened (مفرَّق).
sample: النص، مقصوصًا عند 80 حرفًا.

مكوّنات تجتاز هذا الفحص بطريقة بنائها

تجتاز مكوّنات ريتلا هذه الفحص R051 بالطريقة التي بُنيت بها. إذا استخدمتها كما يصفها التوثيق، فلن تُدخل هذا الخلل إلى صفحتك.

هل تخفق صفحتك في الفحص R051؟

الصق رابطًا، فتعرض ريتلا الصفحة على سطح المكتب والجهاز اللوحي والجوال، وتشغّل كل الفحوص، وتريك أهم المشكلات مع لقطة شاشة دليلًا على كل منها.

افحص صفحة مجانًا تصفّح الفحوص