معايير نجاح WCAG · Level A

WCAG 3.1.1: لغة الصفحة

سيتحقق ما يلي: - الحفاظ على المعنى والنبرة والأسلوب الأصلي للنص. - استخدام لغة عربية فصيحة تعكس الطابع التقني للنص. - الإبقاء على جميع الأرقام والرموز كما هي دون تغيير. - الحفاظ على أسماء المعايير والعناصر البرمجية بصيغتها الأصلية. - الحفاظ على فواصل الأسطر وبنية الفقرات كما في النص الأصلي. يتطلب المعيار WCAG 3.1.1 أن تكون اللغة البشرية الافتراضية لكل صفحة ويب قابلة للتحديد برمجياً، وذلك أساساً من خلال تعيين قيمة صحيحة لخاصية lang في عنصر HTML. يتيح هذا لتقنيات المساعدة مثل برامج قراءة الشاشة نطق المحتوى بشكل صحيح، ويساعد المستخدمين ذوي الإعاقات الإدراكية واللغوية على فهم الصفحة.

ماذا تعني هذه القاعدة

WCAG 3.1.1 — لغة الصفحة هو معيار نجاح من المستوى A ضمن مبدأ قابلية الفهم. يتطلب أن تكون اللغة البشرية الأساسية لكل صفحة ويب مكشوفة بطريقة يمكن لتقنيات المساعدة اكتشافها برمجياً. عملياً، يعني هذا في الغالب وضع سمة lang صحيحة مباشرة على عنصر <html> في الصفحة.

يجب أن تكون قيمة سمة lang وسم لغة صالحاً وفق BCP 47. تتكون وسوم BCP 47 من وسم لغة أساسي (مثل en للإنجليزية، tr للتركية، fr للفرنسية) واختيارياً وسم منطقة مفصولاً بشرطة (مثل en-US أو tr-TR أو pt-BR). يجب أن يعكس وسم اللغة بدقة اللغة السائدة التي كُتب بها محتوى الصفحة. يجب أن تعلن الصفحة المكتوبة أساساً بالتركية عن lang='tr' أو lang='tr-TR'؛ والصفحة المكتوبة بالإنجليزية يجب أن تعلن عن lang='en' أو عن متغير إقليمي.

تُعتبر الصفحة مستوفية لهذا المعيار عندما يحمل عنصر <html> سمة lang بقيمة غير فارغة، وصحيحة نحوياً كوسم لغة BCP 47، وتحدد بشكل صحيح اللغة الأساسية للصفحة. وتُعتبر الصفحة غير مستوفية عندما تكون سمة lang مفقودة تماماً، أو عندما تكون القيمة فارغة (lang='')، أو عندما لا تكون القيمة وسم لغة معترفاً به وفق BCP 47 (على سبيل المثال lang='turkish' أو lang='en_US' مع استخدام الشرطة السفلية بدلاً من الشرطة العادية).

بالنسبة لصفحات XHTML التي تُقدَّم بنوع MIME خاص بـ XML، يجب أن تكون كل من سمة lang وسمة مساحة الأسماء في XML xml:lang موجودتين، ويجب أن تتطابق قيمهما. يشكل عدم التطابق بينهما — مثل lang='en' مع xml:lang='tr' — إخفاقاً في هذا المعيار وفي قاعدة axe-core ذات الصلة html-xml-lang-mismatch.

تشير WCAG صراحة إلى استثناء واحد: إذا كانت الصفحة زخرفية بحتة، أو كانت CAPTCHA لا تحتوي عمداً على لغة يمكن تمييزها، أو كانت تتكون بالكامل من محتوى غير لغوي (مثل صفحة تحتوي فقط على صورة بدون نص)، فقد لا تكون لها لغة قابلة للتحديد. ومع ذلك، فإن هذا الاستثناء ضيق، وغالبية الصفحات في العالم الحقيقي تحتوي على نص كافٍ يتطلب إعلاناً عن اللغة.

لماذا يهم هذا الأمر

المستفيدون الأساسيون من إعلان لغة الصفحة بشكل صحيح هم مستخدمو قارئات الشاشة، ومعظمهم من المكفوفين أو ذوي ضعف البصر الشديد. تستخدم قارئات الشاشة مثل NVDA وJAWS وVoiceOver سمة lang لاختيار صوت ونظام نطق تحويل النص إلى كلام (TTS) المناسبين. عندما يزور مستخدم تركي صفحة تعلن بشكل صحيح عن lang='tr'، تقوم قارئة الشاشة لديه بالتبديل إلى صوت TTS تركي، مطبقة الفونولوجيا التركية الصحيحة وأنماط النبر والعلامات التشكيلية. بدون هذا الإعلان، قد تعتمد قارئة الشاشة على لغة نظام المستخدم أو على لغة خاطئة تماماً، مما ينتج عنه نطق يشبه الهراء يجعل المحتوى غير قابل للفهم.

فكر في سيناريو ملموس: مواطن تركي ضعيف البصر يزور موقع مؤسسة عامة لتنزيل نموذج حكومي. الموقع لا يضع سمة lang. إعداد NVDA لدى المستخدم مضبوط افتراضياً على ملف تعريف TTS إنجليزي. تُقرأ الكلمات التركية باستخدام الفونولوجيا الإنجليزية — كلمات مثل "şehir" (مدينة) أو "başvuru" (طلب) تصبح غير قابلة للتعرف. لا يستطيع المستخدم إكمال النموذج دون مساعدة مبصر، مما يُفشل الغرض الكامل من الخدمة الرقمية.

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

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

إضافة إلى إمكانية الوصول، هناك فوائد ملموسة لتحسين محركات البحث (SEO): تستخدم محركات البحث سمة lang كأحد عدة إشارات لتحديد لغة الصفحة المستهدفة ومنطقتها، مما يحسن دقة نتائج البحث الموطّنة. كما يحسن وضع وسوم اللغة بشكل صحيح موثوقية ميزات التدقيق الإملائي والنحوي في المتصفح لجميع المستخدمين، وليس فقط من يستخدمون تقنيات المساعدة. وفقاً لمنظمة الصحة العالمية، يعاني حوالي 2.2 مليار شخص حول العالم من شكل من أشكال ضعف البصر، ويعتمد جزء كبير منهم على قارئات الشاشة — مما يجعل إعلان اللغة بشكل صحيح واحداً من تحسينات إمكانية الوصول الأعلى أثراً والأقل جهداً المتاحة.

قواعد axe-core ذات الصلة

  • html-has-lang — تتحقق هذه القاعدة مما إذا كان عنصر <html> يحتوي على سمة lang من الأساس. تقوم بوضع علامة على أي صفحة تكون فيها سمة lang غائبة تماماً عن وسم <html> الجذري، بغض النظر عما إذا كانت السمة تظهر في مكان آخر في المستند. هذه واحدة من أكثر الاكتشافات الآلية شيوعاً وتأثيراً، لأن الإصلاح هو إضافة سمة واحدة فقط.
  • html-lang-valid — تتحقق هذه القاعدة مما إذا كانت قيمة سمة lang على عنصر <html> وسم لغة صالحاً وفق BCP 47. تقوم بوضع علامة على القيم التي ليست رموز لغة معترفاً بها، مثل lang='turkish' (الذي يستخدم الاسم الإنجليزي الكامل بدلاً من رمز ISO 639-1 tr)، أو lang='en_US' (الذي يستخدم فاصل الشرطة السفلية بدلاً من الشرطة)، أو lang='xx' (وهو عنصر نائب بدون لغة مخصصة). سمة lang الموجودة ولكن تحتوي على قيمة غير صالحة هي مشكلة بقدر سمة مفقودة، لأن تقنيات المساعدة لا يمكنها الاعتماد عليها في التصرف بشكل موثوق.
  • html-xml-lang-mismatch — تنطبق هذه القاعدة تحديداً على صفحات XHTML التي تحمل كلّاً من سمة lang وسمة xml:lang على عنصر <html>. تقوم بوضع علامة على الحالات التي تحدد فيها السمتان رموز لغة مختلفة — على سبيل المثال lang='en' وxml:lang='tr'. عندما تتعارض هذه القيم، تتلقى تقنيات المساعدة ومعالجات XML إشارات متناقضة وقد تتصرف بشكل غير متوقع. يجب أن تحدد كلتا القيمتين نفس وسم اللغة الأساسي.

بينما تغطي هذه القواعد الثلاثة أكثر الإخفاقات البرمجية شيوعاً، فإن الأدوات الآلية لا يمكنها التحقق من الدقة الدلالية — أي لا يمكنها تحديد ما إذا كانت اللغة المعلنة تطابق فعلياً اللغة التي كُتبت بها الصفحة. ستجتاز صفحة مكتوبة بالكامل بالتركية ولكن تعلن عن lang='en' القواعد الثلاثة لـ axe-core، ومع ذلك ستفشل في WCAG 3.1.1، لأن اللغة المعلنة لا تعكس اللغة الأساسية الفعلية للصفحة. لذلك، يكون المراجعة اليدوية مطلوبة دائماً إلى جانب الفحص الآلي للتأكد من أن اللغة المعلنة صحيحة.

كيفية الاختبار

  1. فحص آلي باستخدام axe DevTools أو Lighthouse: افتح الصفحة في Chrome أو Firefox. افتح أدوات المطور (F12)، وانتقل إلى لوحة axe DevTools أو تبويب Lighthouse، وشغّل تدقيق إمكانية وصول كامل. ابحث تحديداً عن الانتهاكات تحت القواعد html-has-lang وhtml-lang-valid وhtml-xml-lang-mismatch. سيقوم axe بتظليل عنصر <html> ووصف الإخفاق المحدد. سيعرض Lighthouse مشكلات مشابهة ضمن فئة Accessibility الخاصة به. دوّن جميع الانتهاكات التي تم وضع علامة عليها والإصلاحات الموصى بها.
  2. فحص يدوي للمصدر: اعرض مصدر الصفحة (Ctrl+U في معظم المتصفحات) وحدد موقع وسم <html> الافتتاحي. تحقق من أنه يحتوي على سمة lang، وأن قيمة السمة وسم صالح وفق BCP 47 (تحقق من سجل وسوم اللغة في IANA)، وأنه يعكس بدقة اللغة التي كُتب بها محتوى الصفحة. بالنسبة لصفحات XHTML، تحقق أيضاً من أن أي سمة xml:lang تحمل نفس وسم اللغة الأساسي مثل lang.
  3. اختبار قارئة الشاشة باستخدام NVDA وFirefox: ثبّت NVDA (مجاني، لنظام Windows) وافتح الصفحة في Firefox. اضغط NVDA+T لقراءة عنوان الصفحة والاستماع إلى صوت TTS المستخدم. إذا كانت الصفحة بالتركية، يجب أن يكون الصوت صوت TTS تركي، ويجب نطق الكلمات التركية بشكل صحيح. إذا سمعت صوتاً إنجليزياً أو صوتاً خاطئاً على محتوى تركي، فإن سمة lang مفقودة أو غير صحيحة. كرر ذلك باستخدام JAWS في Chrome وVoiceOver في Safari على macOS (Cmd+F5 لتفعيل VoiceOver، ثم انتقل إلى الصفحة واستمع إلى كيفية نطق نص الجسم).
  4. فحص اكتشاف اللغة في المتصفح: افتح الصفحة في Chrome. ابحث عن شريط الترجمة المدمج في المتصفح — سيعرض Chrome عرضاً لترجمة الصفحات التي يحدد أنها بلغة أجنبية بالنسبة لإعدادات المتصفح. إذا حدد Chrome لغة الصفحة بشكل خاطئ أو فشل في عرض الترجمة عندما ينبغي ذلك، فهذا مؤشر عملي على أن سمة lang خاطئة أو مفقودة. هذا ليس اختبار إمكانية وصول حاسماً، لكنه مؤشر ثانوي مفيد.
  5. فحص الدقة الدلالية (يدوي فقط): اقرأ محتوى الصفحة وتأكد من أن قيمة lang المعلنة تطابق اللغة الأساسية الفعلية للصفحة. لا يمكن للأدوات الآلية إجراء هذا الفحص. أولِ اهتماماً خاصاً للمواقع متعددة اللغات التي تقدم نسخاً لغوية مختلفة من عناوين URL مختلفة — يجب أن تعلن صفحة كل عنوان URL عن لغتها الصحيحة، لا أن ترث قيمة افتراضية عالمية واحدة.

كيفية الإصلاح

سمة lang مفقودة — غير صحيح

<!DOCTYPE html>
<html>
  <head>
    <meta charset='UTF-8'>
    <title>Başvuru Formu</title>
  </head>
  <body>
    <h1>Hoş Geldiniz</h1>
  </body>
</html>

سمة lang مفقودة — صحيح

<!DOCTYPE html>
<html lang='tr'>
  <!-- lang='tr' tells screen readers to use a Turkish TTS voice -->
  <head>
    <meta charset='UTF-8'>
    <title>Başvuru Formu</title>
  </head>
  <body>
    <h1>Hoş Geldiniz</h1>
  </body>
</html>

قيمة غير صالحة لسمة lang — غير صحيح

<!DOCTYPE html>
<html lang='turkish'>
  <!-- 'turkish' is not a valid BCP 47 tag; axe will flag html-lang-valid -->
  <head>
    <title>Kurumsal Site</title>
  </head>
  <body>
    <p>Şirketimiz hakkında bilgi edinmek için buraya tıklayın.</p>
  </body>
</html>

قيمة غير صالحة لسمة lang — صحيح

<!DOCTYPE html>
<html lang='tr'>
  <!-- Use the ISO 639-1 two-letter code 'tr', not the English word 'turkish' -->
  <head>
    <title>Kurumsal Site</title>
  </head>
  <body>
    <p>Şirketimiz hakkında bilgi edinmek için buraya tıklayın.</p>
  </body>
</html>

عدم تطابق xml:lang في XHTML — غير صحيح

<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN'
  'http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml' lang='en' xml:lang='tr'>
  <!-- lang and xml:lang disagree — html-xml-lang-mismatch violation -->
  <head><title>XHTML Sayfası</title></head>
  <body><p>İçerik burada.</p></body>
</html>

عدم تطابق xml:lang في XHTML — صحيح

<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN'
  'http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml' lang='tr' xml:lang='tr'>
  <!-- Both lang and xml:lang are 'tr' — consistent and valid -->
  <head><title>XHTML Sayfası</title></head>
  <body><p>İçerik burada.</p></body>
</html>

إعلان لغة خاطئة في موقع متعدد اللغات — غير صحيح

<!-- English-language version of the site, but lang is set to 'tr' globally -->
<html lang='tr'>
  <head><title>About Us</title></head>
  <body>
    <p>Welcome to our company. We specialize in accessible web solutions.</p>
  </body>
</html>

إعلان لغة خاطئة في موقع متعدد اللغات — صحيح

<!-- Each language version declares its own correct lang attribute -->
<html lang='en'>
  <!-- This is the English page; the Turkish page at /tr/ declares lang='tr' -->
  <head><title>About Us</title></head>
  <body>
    <p>Welcome to our company. We specialize in accessible web solutions.</p>
  </body>
</html>

الأخطاء الشائعة

  • استخدام الاسم الإنجليزي الكامل للغة بدلاً من وسم BCP 47 الخاص بها — مثل كتابة lang='turkish' أو lang='english' أو lang='arabic' بدلاً من الوسوم الصحيحة tr وen وar. هذه القيم غير معترف بها من قبل تقنيات المساعدة.
  • استخدام الشرطة السفلية كفاصل للمنطقة — مثل كتابة lang='en_US' أو lang='tr_TR' بدلاً من الصيغ المفصولة بشرطة lang='en-US' وlang='tr-TR'. يتطلب BCP 47 استخدام الشرطات، لا الشرطات السفلية.
  • تعيين سمة lang على <body> بدلاً من <html> — يجب أن تكون سمة lang على عنصر <html> الجذري للوفاء بقاعدة axe-core html-has-lang ولتزويد تقنيات المساعدة بسياق لغة على مستوى الصفحة قبل تحليل أي محتوى.
  • ترك lang كسلسلة فارغة — تعيين lang='' يُعامل على أنه سمة مفقودة من قبل معظم تقنيات المساعدة وسيتم وضع علامة عليه بواسطة html-has-lang لأن السلسلة الفارغة ليست وسم لغة صالحاً.
  • نسخ قالب من مشروع بلغة مختلفة دون تحديث سمة lang — مشكلة شائعة جداً في سير عمل التطوير التركي حيث يُعاد استخدام قالب إنجليزي ولا يتم تغيير lang='en' على وسم <html> إلى lang='tr' أبداً.
  • إعلان سمة lang الصحيحة ولكن عدم تحديثها عند إطلاق نسخة لغوية جديدة من الموقع — يجب على المواقع متعددة اللغات التي تستخدم التصيير من جهة الخادم التأكد من تعيين سمة lang ديناميكياً لكل محلي (locale)، لا أن تكون مشفرة بقيمة واحدة في قالب تخطيط مشترك.
  • افتراض أن نظام إدارة المحتوى أو الإطار يعيّن سمة lang تلقائياً وبشكل صحيح — العديد من منصات إدارة المحتوى (بما في ذلك بعض إعدادات WordPress وJoomla والأطر المخصصة) لا تعيّن سمة lang صالحة بشكل افتراضي. يجب على المطورين التحقق من ذلك على مستوى القالب، لا افتراض أنه مُعالَج.
  • الخلط بين سمة lang (لـ HTML) وترويسة HTTP Content-Language — تؤثر ترويسة HTTP على التخزين المؤقت والتفاوض على المحتوى لكنها لا تُستخدم من قبل قارئات الشاشة. سمة lang داخل المستند على <html> هي الآلية الصحيحة للامتثال لـ WCAG 3.1.1.
  • استخدام وسم إقليمي صالح لكنه غير صحيح دلالياً ويفترض لهجة مختلفة — على سبيل المثال، إعلان lang='zh-TW' (الصينية التقليدية، تايوان) على صفحة مكتوبة بالصينية المبسطة (zh-CN) قد يدفع قارئة الشاشة لاختيار ملف صوتي وقواعد نطق خاطئة.
  • نسيان تعيين lang على المحتوى الكامل المحقون ديناميكياً في تطبيقات الصفحة الواحدة (SPAs) — إذا حمّل تطبيق صفحة واحدة محتوى بلغات متعددة ضمن نفس غلاف المستند دون تحديث سمة lang، فلن يحصل المستخدمون الذين يتنقلون بين أقسام اللغة على نطق TTS الصحيح لأقسام المحتوى الجديدة.

العلاقة مع لوائح إمكانية الوصول في تركيا

يحمل معيار WCAG 3.1.1 لغة الصفحة وزناً قانونياً مباشراً في تركيا بموجب التعميم الرئاسي 2025/10، المنشور في الجريدة الرسمية رقم 32933 بتاريخ 21 يونيو 2025. يضع هذا التعميم متطلبات إلزامية لإمكانية الوصول على الويب متوافقة مع WCAG 2.2 ويحدد مستوى الامتثال A كحد أدنى إلزامي لجميع الكيانات المشمولة.

يغطي التعميم نطاقاً واسعاً من المنظمات في القطاعين العام والخاص. يُطلب من المؤسسات العامة — بما في ذلك الوزارات والبلديات والجامعات الحكومية والمستشفيات العامة وجميع الهيئات الحكومية المركزية والمحلية — تحقيق امتثال كامل للمستوى A خلال عام واحد من تاريخ نشر التعميم. تمتلك الكيانات في القطاع الخاص المشمولة باللائحة فترة امتثال مدتها عامان وتشمل منصات التجارة الإلكترونية والبنوك والمؤسسات المالية والمستشفيات الخاصة ومقدمي الرعاية الصحية ومشغلي الاتصالات الذين لديهم 200,000 مشترك أو أكثر ووكالات السفر وشركات النقل الخاصة والمدارس الخاصة التي تعمل بتصريح من وزارة التربية الوطنية (MoNE).

لأن WCAG 3.1.1 معيار من المستوى A، فإنه يقع ضمن خط الأساس الإلزامي لكل كيان مشمول بالتعميم. موقع مؤسسة عامة تركية لا يضع lang='tr' في عنصر <html> الخاص به — أو يعلن عن وسم لغة غير صحيح أو غير صالح — يكون في حالة عدم امتثال مباشر لمعيار مفروض قانوناً. بالنسبة للمنظمات في القطاع الخاص مثل البنوك ومنصات التجارة الإلكترونية، يشكل نفس الإخفاق ضمن فترة الامتثال الخاصة بها انتهاكاً تنظيمياً.

التأثير العملي على فرق الويب التركية كبير: يجب تدقيق كل قالب صفحة، وكل تخطيط في نظام إدارة المحتوى، وكل غلاف لتطبيق صفحة واحدة، وكل صفحة مولدة ديناميكياً للتأكد من وجود lang='tr' صالح (أو متغير مناسب) على عنصر HTML الجذري. هذا ليس مجرد توصية لأفضل الممارسات — بل هو التزام قانوني بموجب التعميم 2025/10. ونظراً لأن قواعد axe-core html-has-lang وhtml-lang-valid يمكنها اكتشاف غالبية هذه الإخفاقات تلقائياً، فلا يوجد عائق تقني يمنع تحديد هذه المشكلة ومعالجتها قبل حلول مواعيد الامتثال.

يجب على المنظمات الخاضعة للتعميم التعامل مع الامتثال لـ WCAG 3.1.1 كعنصر معالجة ذي أولوية أولى: فهو من أسهل المعايير إصلاحاً (سمة واحدة على عنصر واحد)، ومع ذلك له تأثير كبير على إمكانية الوصول في كل صفحة لمستخدمي قارئات الشاشة — وهي الفئة التي صُممت اللائحة لحماية حقوقها بشكل مباشر.