ترميز ARIA الذي تكتبه لاجتياز اختبارات إمكانية الوصول هو، في الواقع، أنظف مصدر تقدمه لمحرك الذكاء الاصطناعي. فقارئات الشاشة ووكلاء الذكاء الاصطناعي يقرؤون صفحات الويب بطريقة شبه متطابقة: لا يرون الصور التي نسّقتها بعناية، بل يحولون HTML إلى شجرة بنيوية من الوسوم والمستويات والأسماء. وهكذا يخدم إعداد إمكانية الوصول نفسه المستخدمين ذوي الإعاقة البصرية، ويتيح في الوقت ذاته لمحركات مثل ChatGPT وPerplexity وClaude استخراج محتواك واقتباسه على نحو صحيح. ومع أن هذه النقطة من أكثر جوانب GEO تداولاً، فإنها أيضاً من أكثرها إهمالاً في التنفيذ.
قارئات الشاشة ووكلاء الذكاء الاصطناعي يقرؤون الشجرة نفسها
تجمع المتصفحات المرئية بين CSS والصور والحركات لتعرض صفحة تراها العين البشرية، لكن قارئة الشاشة لا تعمل بهذه الطريقة. فهي تقرأ شجرة إمكانية الوصول التي ينشئها المتصفح، ثم تصفها للمستخدم طبقة بعد أخرى: هذه منطقة التنقل، وهذا هو المحتوى الرئيسي، وهذا زر اسمه "أضف إلى السلة". أما برامج الزحف التابعة لمحركات الذكاء الاصطناعي فغالباً ما تتبع مساراً أبسط؛ إذ لا ينفذ كثير منها JavaScript، بل يجلب HTML الأصلي مباشرة، ويحوّل الوسوم وتسلسل العناوين ونصوص الروابط وسمات aria إلى نص عادي قبل إرساله إلى النموذج. والقاسم المشترك واضح: كلاهما لا يستطيع فهم الإشارات البصرية داخل الصورة، بل يعتمد على البنية والنص.
لهذا قد يبدو الزر الوهمي المبني من <div> وحدث نقر، أو صورة المنتج التي تفتقر إلى alt، أو النص العريض الذي يتظاهر بأنه عنوان عبر تكبير الخط، سليماً تماماً للعين البشرية، بينما يظهر فارغاً لهذين النوعين من القرّاء. ومهما بلغت جودة المحتوى، فإذا انهارت طبقة الاستخراج أولاً، فلن يكون أمام الذكاء الاصطناعي سوى التخمين أو تجاوز صفحتك بالكامل.
ابدأ بالأساس: HTML دلالي أصلي
عندما تسمع معظم الفرق كلمة ARIA، تبادر إلى إضافة مجموعة من سمات role وaria-، لكن هذا يعكس ترتيب الأولويات الصحيح. فالقاعدة الأولى في إرشادات W3C لكتابة محتوى يسهل الوصول إليه واضحة: إذا أمكن التعبير عن الدلالة بعناصر HTML الأصلية، فلا تستخدم ARIA بديلاً عنها. العنصر <button> زر بطبيعته، و<nav> مخصص للتنقل، و<h2> عنوان فرعي أصلاً. تحمل هذه الوسوم الدلالة وسلوك لوحة المفاتيح الافتراضي معاً، كما تتعرف إليها برامج الزحف وقارئات الشاشة من دون الحاجة إلى صيانة جدول مطابقة إضافي. ARIA شريط لترقيع الفجوات، وليس أساس البناء.
أربعة إعدادات تنفذها مرة واحدة وتفيد الطرفين
وجّه مواردك الهندسية إلى المواضع الأربعة التالية لتحقيق أعلى عائد. فهي عناصر لا بد أن تكشفها مراجعات إمكانية الوصول، كما أنها من أهم الإشارات التي يعتمد عليها الذكاء الاصطناعي عند استخراج المحتوى.
- المعالم البنيوية: استخدم <header> و<nav> و<main> و<aside> و<footer> لرسم الهيكل الأساسي للصفحة. تعتمد برامج زحف الذكاء الاصطناعي على هذه المعالم للفصل بين المحتوى الرئيسي وقوالب التنقل والتذييل، فتقتبس المحتوى الفعلي من دون خلط نصوص القوائم بالإجابة.
- مستويات العناوين: استخدم <h1> واحداً في كل صفحة، ولا تقفز بين المستويات أسفل <h2> و<h3>. شجرة العناوين هذه هي فهرس المحتوى الذي يعتمد عليه الذكاء الاصطناعي لفهم مخطط المقال، وهي كذلك أساس التنقل السريع بين الأقسام لمستخدمي قارئات الشاشة.
- النص البديل للصور: استخدم alt لوصف محتوى الصور ذات المعنى، واترك قيمته فارغة للصور الزخرفية البحتة كي يجري تجاهلها. ويجب خصوصاً تدوين أهم ما تعرضه الرسوم المعلوماتية في alt أو في نص مجاور، وإلا فلن تكون الأرقام الظاهرة داخل الرسم موجودة بالنسبة إلى الآلة.
- أسماء العناصر القابلة للتنفيذ: يجب أن يحمل كل زر ورابط اسماً يمكن قراءته. أضف نصاً عبر aria-label إلى الأزرار التي لا تعرض سوى أيقونة، كي يفهم وكيل الذكاء الاصطناعي الوظيفة التي تنفذها.
أزرار الأيقونات والروابط: أكثر مواضع الفراغ شيوعاً
عند إجراء المراجعات التقنية لعملائنا، تكون المكونات الرسومية الخالصة أكثر المشكلات التي نرصدها تكراراً. فقوائم الهامبرغر وسلال التسوق وأيقونات البحث والمشاركة الاجتماعية غالباً ما تكون مجرد <div> يحيط برسم SVG، بلا أي نص. عندها قد تقول قارئة الشاشة "زر" فقط، أو لا تقول شيئاً؛ بينما يرى وكيل الذكاء الاصطناعي عنصراً يمكن النقر عليه من دون اسم. واجه أحد عملاء التجارة الإلكترونية هذه المشكلة في زر إتمام الشراء، فلم تتمكن أداة اختبار الوكلاء من العثور على نقطة الدخول أصلاً. وبعد إضافة aria-label وتسميته "إتمام الشراء"، أصبح للزر نفسه اسم واضح للمستخدمين ذوي الإعاقة البصرية وللوكلاء المؤتمتين. وينطبق الأمر ذاته على الروابط: حين يمتلئ الصف بعبارات مثل "اعرف المزيد" و"انقر هنا"، لا يعرف أحد وجهتها بعد فصلها عن سياقها المرئي. امنح كل رابط نصاً محدداً ومفهوماً بذاته، وسيخدم الإعداد نفسه الطرفين.
العناصر الديناميكية: أخبر وكيل الذكاء الاصطناعي بما يستطيع فعله الآن
لم يعد دور وكلاء الذكاء الاصطناعي مقتصراً على قراءة المحتوى الثابت؛ إذ يُطلب منهم بصورة متزايدة تنفيذ إجراءات فعلية داخل الصفحة، مثل فتح القوائم والتنقل بين الصفحات وإرسال النماذج. هنا لا يكفي أن يكون للعنصر اسم، بل يجب أن تكون حالته واضحة أيضاً. تنقل سمات الحالة في ARIA معلومات مثل ما إذا كان المكوّن مفتوحاً أو مغلقاً، وأي عنصر جرى اختياره، بصيغة قابلة للقراءة آلياً. وبذلك يعرف الوكيل الخطوة التالية، ويتحقق من نجاح الإجراء السابق.
- aria-expanded: توضح ما إذا كانت القائمة القابلة للطي أو الأكورديون أو القائمة المنسدلة مفتوحة أم مغلقة. يعتمد الوكلاء عليها لتحديد ما إذا كان ينبغي النقر على العنصر أولاً.
- aria-current: تحدد الموضع الحالي في ترقيم الصفحات أو مسار التنقل، حتى لا يظل الوكيل يدور داخل المستوى نفسه.
- aria-selected وaria-checked: تعرضان حالة التحديد في الصفحات والخيارات ومربعات الاختيار، ما يتيح للوكيل التأكد من تنفيذ الإجراء.
- aria-live: تميّز المناطق التي تتحدث فورياً، مثل رسائل أخطاء النماذج أو نتائج التحميل، كمناطق حية كي تلاحظ قارئات الشاشة والوكلاء أن محتوى الشاشة قد تغيّر.
التحقق: لا تثق بعبارة "يبدو كل شيء سليماً"
- استخدم curl أو خيار "عرض مصدر الصفحة" في المتصفح لمعاينة HTML الذي يرسله الخادم فعلياً. إذا كان ظهور المحتوى مرهوناً بتنفيذ JavaScript، فلن تتمكن معظم برامج زحف الذكاء الاصطناعي من قراءته.
- شغّل فحص إمكانية الوصول في ax DevTools أو Lighthouse لاكتشاف مشكلات مثل غياب الأسماء وضعف التباين وتخطي مستويات العناوين.
- افتح قارئة شاشة فعلياً ولو لمرة، واستخدم VoiceOver على Mac أو NVDA على Windows، ثم تنقل في صفحتك بلوحة المفاتيح واستمع إلى ما تقوله.
- استخدم اختبارات جاهزية الوكلاء مثل isitagentready لمحاكاة قدرة وكيل الذكاء الاصطناعي على تمييز مكوناتك الرئيسية وتشغيلها.
إمكانية الوصول ليست تكلفة امتثال إضافية. فكل وسم دلالي تضيفه لخدمة المستخدمين ذوي الإعاقة البصرية سيقرأه وكيل الذكاء الاصطناعي بدوره. وهذا من الاستثمارات الهندسية القليلة التي تحقق نوعين من القيمة في آن واحد.— Tenten GEO Technical Audit
لن يدفعك ARIA والترميز الدلالي مباشرة إلى مراتب أعلى في نتائج البحث، لكنهما يحددان ما إذا كان محرك الذكاء الاصطناعي يستطيع فهم محتواك واستخراجه واقتباسه بوضوح. هذا هو أساس GEO. وإذا لم تكن متأكداً من الهيئة التي يظهر بها موقعك لوكيل الذكاء الاصطناعي، أو من المكونات الرئيسية التي تبدو له فارغة، يمكنك حجز جلسة تشخيص GEO لمدة 30 دقيقة. سنفحص الموقع عملياً ونوضح لك مواضع الفجوات.
