كيفية دمج إمكانية الوصول إلى الويب في موقع WordPress الخاص بك

نشرت: 2020-02-15

WordPress هو النظام الأساسي الأكثر شعبية لبناء مواقع الويب. وفقًا لـ W3techs ، تستخدم 35.7 ٪ من جميع مواقع الويب WordPress ، مما يجعله يصل إلى 62.5 ٪ من حصة سوق نظام إدارة المحتوى (CMS) على مستوى العالم.

عند إنشاء موقع ويب WP ، ربما تكون إمكانية الوصول إلى الويب هي آخر شيء يدور في ذهنك.

لكن معايير ترميز إمكانية الوصول إلى WordPress تنص على أن " كل التعليمات البرمجية الجديدة أو المحدثة الصادرة في WordPress يجب أن تتوافق مع إرشادات إمكانية الوصول إلى محتوى الويب 2.0 في المستوى AA. "

بمعنى آخر ، تعد إمكانية الوصول عاملاً بالغ الأهمية إذا كان لديك موقع ويب WP.

لحسن الحظ ، ليس من المستحيل الوصول إلى موقع WP الخاص بك. ولكن ، قبل مناقشة كيفية القيام بذلك ، دعونا نفهم ما هي إمكانية الوصول إلى الويب.

أ. الركائز الأربع لإمكانية الوصول إلى الويب

لقد توصل اتحاد شبكة الويب العالمية (W3C) ، الذي يطور معايير دولية للويب ، بالفعل إلى المبادئ الأربعة التالية لإمكانية الوصول إلى الويب:

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

ب. أفضل ممارسات ولوجية الويب في ووردبريس

مع وضع المبادئ المذكورة أعلاه في الاعتبار ، يمكنك اتخاذ الخطوات التالية لجعل موقع WordPress الخاص بك متاحًا للمعاقين:

تحسين إمكانية الوصول إلى النص

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

تأكد أيضًا من إضافة بدائل نصية مثل العلامات البديلة عند الضرورة. يعد WP Accessibility أحد المكونات الإضافية لإمكانية الوصول في WordPress والتي يمكن أن تساعدك في إضافة نص يمكن تغيير حجمه وتباين الألوان وإضافة عناوين منشورات لقراءة المزيد من الروابط وتوفير نص بديل مناسب.

هيكل أمامي وخلفي

يجب أن يكون لكل صفحة من صفحات الويب الخاصة بك واجهة أمامية وخلفية جيدة التنظيم. فهو لا يزيد من سهولة القراءة الإجمالية للمحتوى الخاص بك فحسب ، بل يسهل أيضًا على الأدوات المساعدة نقل الرسالة إلى المستخدمين المعاقين. يمكنك استخدام عناصر HTML مثل علامات العناوين الدلالية والأوصاف التعريفية لتحسين النهاية الخلفية.

تأكد من استخدام القوائم ذات التعداد النقطي والفقرات القصيرة والمحتوى المنظم جيدًا والذي يجب أن يساعد في تحسين الواجهة الأمامية. يجب عليك أيضًا استخدام العناوين والعناوين المناسبة لتحديد أقسام فرعية للمحتوى. تجنب استخدام الرسوم المتحركة وصور GIF البراقة لأنها ليست سهلة الوصول.

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

التنقل باستخدام لوحة المفاتيح لتفاعل أفضل

تحتاج أيضًا إلى التأكد من أن موقع الويب الخاص بك قابل للتنقل عبر لوحة المفاتيح. يجب أن تتضمن روابط وقوائم ، وخاصة القوائم المنسدلة. يجب أن يكون جميع المستخدمين قادرين على الوصول إلى عناصر مثل الروابط والقوائم والأزرار والنماذج باستخدام Tab (للأمام) و Shift + Tab (للخلف).

تحتاج أيضًا إلى استخدام مؤشر تركيز مرئي ، والذي يُظهر للمستخدمين المعوقين مكان وجودهم في صفحة ويب. غالبًا ما تقوم سمات WordPress بإعادة تعيين نمط التركيز الافتراضي. تأكد من استخدام سمة WordPress التي لا تعيد تعيين هذه الميزة. يمكن أن يساعدك موضوع إمكانية الوصول إلى Divi في إعداد التنقل الملائم للوحة المفاتيح مع القوائم المنسدلة التي يمكن الوصول إليها والمخططات المرئية للعناصر القابلة للتركيز.

أضف معالم ARIA

ARIA تعني تطبيقات الإنترنت الغنية التي يمكن الوصول إليها. من خلال دور معلم ARIA ، يمكنك تحديد مناطق مختلفة من صفحة الويب ، مما يسمح لمستخدمي التكنولوجيا المساعدة بالتنقل في موقع الويب الخاص بك بسهولة.

تتضمن أدوار معالم ARIA الأكثر شيوعًا لافتة ، ومعلومات رئيسية ، وتكميلية ، ومحتوى ، وبحث ، وتنقل.

لافتة: تحدد عنوان الموقع مثل الشعار أو اسم الشركة أو عنوان موقع الويب.
رئيسي: يحدد المحتوى الرئيسي لصفحة الويب.
تكميلي: يكتشف المحتوى الداعم الذي يعد جزءًا أساسيًا من المحتوى الرئيسي.
معلومات المحتوى: توفر معلومات حول المستندات الأصل مثل الحواشي السفلية وحقوق التأليف والنشر وبيانات الخصوصية.
بحث: يشير إلى شكل البحث على موقعك.
التنقل: يحدد عناصر التنقل لصفحة الويب.

أفضل ميزة لاستخدام معالم ARIA هي أنها يمكن أن تعمل مع عناصر HTML5 الدلالية بالفعل. نتيجة لذلك ، يمكنك استخدامها مع عناصر HTML5 في قوالب WordPress الحالية.

العناصر التفاعلية: تباين الألوان

بالنسبة للعناصر التفاعلية مثل عبارات الحث على الشراء والنماذج ، استخدم دائمًا ألوانًا عالية التباين كخلفية للنص. بينما يتطلب WCAG 2.0 Level AA نسبة تباين لا تقل عن 4: 5: 1 للنص العادي و 3: 1 للنص الكبير ، يتطلب المستوى AAA نسبة تباين لا تقل عن 7: 1 للنص العادي ، و 4: 5: 1 للنص الكبير.

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

كلمات فراق

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

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

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

إذا كان لا يزال لديك شكوك حول كيفية إتاحة الوصول إلى موقع WordPress الخاص بك ، فلا تتردد في ترك استفساراتك في التعليقات.