Skip to main content

تحديث تباين لون النص

يجب أن يتمكن الجميع من قراءة نصك

ومن المهم أن يكون النص مرئيًا ومقروءًا. إذا كنت تريد أن يفهمها زوارك ، فيجب أن يكونوا قادرين على قراءتها.

يضمن التباين الجيد في النص أنه يمكن للجميع رؤية النص على الخلفية التي يظهر عليها.

لا يري الجميع اللون بنفس الدرجة. حدد WCAG متطلبات تباين محددة في إرشادات WCAG 2.2 AA للتأكد من أن النص مقروء للجميع. اتبع تلك المتطلبات وأفضل ممارسات التباين لدينا لإصلاح مشكلات التباين أو منعها.

يتبع Ally متطلبات التباين للتحقق من وجود تباين كافٍ بين لون النص ولون الخلفية. يعد تباين النص الرديء مشكلة رئيسية. تؤثر مادة التخصص الرئيسية على إمكانية وصول ذوي الاحتياجات الخاصة، وعلى الرغم من أنها ليست خطيرة، إلا أنها تتطلب الاهتمام.

استخدام Ally للعثور على نص بتباين رديء

استخدم تقرير إمكانية وصول ذوي الاحتياجات الخاصة في Ally لاكتشاف مشكلات إمكانية وصول ذوي الاحتياجات الخاصة على موقعك وإصلاحها. استخدم الرابط المتوفر للتقرير وسجل الدخول. افتح التقرير وانظر إلى قائمة المشكلات في جدول مشكلات إمكانية وصول ذوي الاحتياجات الخاصة.

فكرة مفيدة

يوجد جدول "مشكلات إمكانية وصول ذوي الاحتياجات الخاصة" في كل من علامتي التبويب "نظرة عامة" و"المجال". ابدأ في علامة التبويب "المجال" للاطلاع على المشكلات الخاصة بالمجال.

تعد مشكلة كبيرة أن يكون لديك نص به تباين رديء. استخدم علامة التبويب مادة التخصص في جدول مشكلات إمكانية وصول ذوي الاحتياجات الخاصة لعرض قائمة المشكلات الرئيسية. حدد المشكلات المتعلقة بمشكلات التباين.

بديل

فكرة مفيدة

إذا بدأت في علامة التبويب نظرة عامة، فحدد المشكلة ثم المجال الذي يحتوي على المشكلة.

فكرة مفيدة

يمكن أن تبدأ مشكلات التباين باستخدام المستند أو HTML في القائمة.

من قائمة مشكلات التباين في المجال، حدد مؤشر الدرجة بجوار عنصر يحتوي على المشكلة. يتم فتح لوحة ملاحظات محرر المحتوى.

بديل

معاينة النص بتباين رديء

تعرض لك لوحة ملاحظات Ally معاينة للمحتوى، بالإضافة إلى الملاحظات التفصيلية والدعم لمساعدتك في إصلاح مشكلات إمكانية وصول ذوي الاحتياجات الخاصة لديك. استخدم المعاينة لرؤية النص المحتوي على تباين رديء.

تبرز المعاينة المواضع التي يمكن فيها العثور على مشكلات إمكانية الوصول المحددة في المستند. تعرض مواضع التمييز كل موضع لنوع مشكلة واحد في كل مرة. على سبيل المثال، إذا كان النص لديك يحتوي على تباين رديء، فإن مواضع التمييز تظهر لك كل موضع تحدث فيه هذه المشكلة المحددة.

بديل

أدوات المعاينة

استخدم أدوات المعاينة لاستكشاف المشكلات في المستند.

بديل
  • تنقل عبر المعاينة صفحة تلو الأخرى.

  • تعرف على عدد المرات التي تظهر فيها مشكلة محددة.

  • تنقل بين مواضع تمييز المشكلة.

  • قم بإخفاء أو إظهار المواضع المميزة.

  • قم بتكبير محتوى المعاينة أو تصغيره.

  • إذا كانت المشكلة في مستند مرفق، فقم بتنزيل الملف الأصلي.

اتباع الخطوات الإرشادية الخاصة بـ Ally لإصلاح التباين الرديء

هام

تفترض Ally أن لديك معرفة أساسية بـ HTML وكيفية استخدام نظام إدارة المحتوى (CMS) الخاص بك. لاتباع الخطوات الإرشادية، تحتاج إلى معرفة كيفية تحرير صفحة ويب في HTML أو التعليمة البرمجية المصدر في نظام إدارة المحتوى.

هام

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

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

حدد كيفية إصلاح التباين لاتباع الخطوات الإرشادية.

بديل

طرق إصلاح مشكلات التباين

عند وجود تباين رديء في النص، فهذا يعني أنه لا يوجد تباين لوني كافٍ بين النص والخلفية التي يظهر عليها.

توضح الخطوات الإرشادية لـ Ally كيفية تغيير لون النص. ويمكنك أيضًا تغيير لون الخلفية.

هام

قبل إجراء أي تغييرات، تحقق من دليل نمط موقعك. غالبا ما يرتبط اللون بالعلامة التجارية ويجب تغييره بحذر.

توضح الخطوات الإرشادية لـ Ally أيضًا كيفية إجراء التحديثات في تعليمة HTML البرمجية المصدر لصفحات الويب الفردية. تتنوع أنظمة إدارة المحتوى. تحتوي بعض أنظمة إدارة المحتوى على محرر نص منسق (RTE) قد يوفر لك طرقا سهلة الاستخدام لتصميم النص. باستخدام RTEs ، يمكنك اختيار النمط المحدد مسبقا للعناوين والألوان والخطوط والصور وما إلى ذلك. ومع ذلك، لا يوفر كل نظام إدارة محتوى محرر نص منسق، ويتطلب تعديلات في التعليمة البرمجية المصدر باستخدام HTML. في بعض الأحيان، يتوفر كل من HTML ومحرر النص المنسق أيضًا.

بالنسبة لمشكلات التباين المتكررة، قد ترغب في تحديث القالب بدلاً من ذلك. تحتاج تحديثات النماذج إلى معرفة معينة ب HTML وCSS وقد تعتمد على العلامة التجارية لموقعك.

فكرة مفيدة

تفضل بزيارة w3schools لمعرفة المزيد عن HTML وCSS

نظام HEX أو RGB للألوان

يعد نظام HEX ونظام RGB طريقتين مختلفتين يمكن من خلالهما تحديد اللون.

  • يحدد نظام RGB اللون حسب القدر المستخدم من اللون الأحمر (R) والأخضر (G) والأزرق (B). على سبيل المثال، يمكن تعريف درجة اللون الأحمر على أنه RGB (253، 2، 2).

  • يعد نظام HEX بمثابة تنسيق سداسي عشري يحدد اللون من خلال قيم الأحمر والأخضر والأزرق في مجموعة من ستة أحرف وأرقام. تبدأ السداسيات العشرية بالرقم أو رمز الهاشتاج (#). على سبيل المثال، سيتم تحديد نفس درجة اللون الأحمر على أنها #fd0202.

تعد الطريقة السداسية العشرية الطريقة الأكثر شيوعًا لتحديد الألوان على صفحات الويب.

أفضل ممارسات تباين النص

هناك العديد من التعديلات التي تتطلب مجهودًا أقل يمكنك إجراؤها لتحسين إمكانية قراءة النص.

  • استخدم الخطوط ذات التأثيرات العريضة للحروف.

  • استخدم حجم الخط الذي يبلغ 12 بكسل على الأقل. إذا كنت تستخدم خطًا بتأثيرات حروف رفيعة، فاستخدم 16 بكسل على الأقل.

  • استخدم الخطوط "الرفيعة" فقط على الخلفيات الداكنة.

  • استخدم نصًا بلون فاتح في الخلفيات الداكنة.

  • استخدم نصًا بلون داكن في الخلفيات الفاتحة.

  • تجنب تركيبات هذه الألوان:

    • الأخضر والأحمر

    • الأخضر والبني

    • الأزرق والبنفسجي

    • الأخضر والأزرق

    • الأخضر الفاتح والأصفر

    • الأزرق والرمادي

    • الأخضر والرمادي

    • الأخضر والأسود

فكرة مفيدة

ألست متأكدًا مما إذا كان النص يحتوي على تباين كافٍ؟ استخدم محلل تباين الألوان من The Paciello Group للتحقق من المحتوى الخاص بك.

لماذا يعد تباين النص أمرًا مهمًا؟

قد يصعب قراءة النص منخفض التباين في العديد من المواقف.

  • عند العرض في الفصل

  • للطلاب الذين يعانون من عمى الألوان

  • على الهاتف المحمول مع وجود ضوء ساطع أو وهج على الشاشة

  • على شاشات العرض منخفضة الجودة

يمكن أن يتسبب التباين المنخفض في إجهاد العين، ويجعل اكتشاف المحتوى وفحصه أمرًا صعبًا، ويسبب الإحباط.

يعني التباين الجيد أنه يمكن للجميع رؤية النص بوضوح والاستمتاع بتجربة شاملة أفضل لقراءة المحتوى الخاص بك.