المشكلة: عناصر منشور الرد لا تظهر مبدئيًا في نموذج كائن المستند (DOM) عند التحميل الأولي للصفحة، ويتم إزالتها من DOM بعد مرور قارئ الشاشة عليها، مما يتسبب في فقدان قراء الشاشة لنظام Windows إمكانية الوصول إلى المحتوى وتقييد VoiceOver في الأدوات التي يمكن استخدامها للوصول إلى الصفحة.
السلوك المحدد:
عند محاولة التنقل من المنشور الرئيسي إلى منشورات الرد، لم يتم بعد عرض العناصر المستخدمة في منشورات الرد على DOM، وبالتالي لا يمكن للمستخدمين استخدام التنقل السريع للانتقال إلى أي عنصر في أي منشور رد.
يتم تمييز منشورات الرد الفردية كعنوان المستوى 2 في DOM فقط عندما يكون قارئ الشاشة مركزًا عليها، مما يتطلب من المستخدمين التنقل في كل عنصر في الصفحة للوصول إلى منشورات الرد.
تُظهر أداة إمكانية الوصول ANDI بنية عناوين متغيرة باستمرار بعد تفاعلات العناصر.
تظهر العناصر أخطاء “تمت الإزالة من DOM” عند محاولة الوصول إليها.
يفقد قارئ الشاشة عرضًا ثابتًا لبنية الصفحة.
تفاصيل المنصة:
JAWS/NVDA: فشل كامل - لا يمكن الوصول إلى عناوين الرد على الإطلاق.
VoiceOver: الوصول عبر التنقل السريع ولكن لا يوجد وصول إلى الدوار (rotor) - نظرًا لأن VoiceOver يعمل عن طريق قراءة الصفحة مباشرة، يمكن للمستخدمين التنقل في عناوين الرد باستخدام مفاتيح التنقل السريع، ومع ذلك، فإن العناصر التي يركز عليها قارئ الشاشة فقط هي التي يمكن الوصول إليها داخل الدوار.
لماذا هي حرجة: لا يمكن لمستخدمي قارئ الشاشة إكمال المهمة الرئيسية المتمثلة في قراءة ردود المناقشة. هذا يمثل حاجزًا كاملاً أمام المشاركة في المناقشات.
تم الإبلاغ عن هذه المشكلات لأول مرة في Screen Reader Accessibility issues . يرجى المساعدة في حلها، فلدينا مجتمع كامل من المستخدمين المكفوفين وضعاف البصر غير قادرين على إكمال الوظائف الأساسية في لوحة المناقشة.
هل تعرف على أي موضوع (مواضيع) تم الاختبار عليها تحديدًا؟ سيكون من المفيد وجود مرجع مشترك لهذا للتأكد من أننا نرى نفس المشكلات، فهناك الكثير من الاختلافات في محتوى المنشورات لذا أود التأكد من أننا نركز جهودنا في المكان الصحيح.
يمكننا استخدام try.discourse.org، أو يمكننا استخدام منشور هنا على Meta كمرجع إذا كان ذلك سيساعد.
بواسطة “التنقل السريع” يبدو أنك تشير إلى قوائم العناصر تحديدًا؟ يمكنني التأكيد على أنه في كل من NVDA و VoiceOver، لا يمكن الوصول إلا إلى المحتوى المتوفر حاليًا في DOM في قوائم العناصر، وهذا ينطبق أيضًا على المستخدمين المبصرين وهو جزء أساسي من كيفية عمل Discourse. بدلاً من الترقيم اليدوي، نقوم بتحميل/إلغاء تحميل المحتوى أثناء قيام شخص ما بالتمرير لأسفل/لأعلى الصفحة.
هذا ما أتوقعه عادةً عندما يذكر شخص ما “التنقل السريع” على الرغم من أنني أدرك أنه لا يوجد دائمًا مصطلح متسق عبر التطبيقات.
لقد أكدت أن التنقل من عنصر إلى عنصر يعمل في NVDA و VoiceOver، ولكني حددت مشكلة في “المنشورات الصغيرة” لدينا ضمن المواضيع التي قد تمنع التنقل من الاستمرار وسأطبق إصلاحًا لها.
“المنشور الصغير” هو تحديث لحالة الموضوع مثل مثبت، مغلق/مفتوح، نشط، إلخ. المشكلة مع هذه هي أنها لا تحتوي على عنوان داخلي مثل المنشورات العادية، لذلك عندما تقع على العتبة قبل تحميل المزيد من المنشورات أثناء التنقل… قد يتوقف المستخدم ويسمع فقط “لا يوجد عنوان تالي”.
غالبًا ما تفشل الأدوات الآلية مثل ANDI في التعرف على تغييرات DOM في تطبيقات الويب مثل Discourse، فهي مبنية بشكل عام لسيناريوهات أبسط مثل الصفحات الثابتة. لذلك بينما نستخدم أحيانًا هذه الأدوات لتحديد المشكلات بأنفسنا، في السيناريوهات الأكثر تعقيدًا مثل التنقل، يتعين علينا التركيز على ما يمكننا تكراره بالاختبار اليدوي.
أفترض أن هذا أيضًا يتعلق بقوائم العناصر؟ هذا متوقع، ولكن ربما هناك تحسين يمكننا النظر فيه لجعل قوائم العناصر تعمل في Discourse، يمكنني طرح هذا الأمر على مهندسينا للحصول على مدخلاتهم.
هل هذا أيضًا في سياق قائمة العناصر تحديدًا؟ كما ذكرت أعلاه، لقد اختبرت التنقل في NVDA و VoiceOver للتنقل من عنصر إلى عنصر، ويمكنني تأكيد أن هذا يعمل… ولكن إذا كان هناك سياق محدد لا يعمل فيه، فيمكننا إلقاء نظرة فاحصة.
إضافة منطقة معلم تجعل من الواضح أن هناك المزيد من المشاركات أعلاه/أدناه - نقوم بتحميل/إلغاء تحميل المشاركات حتى لا نضطر إلى استخدام ترقيم الصفحات اليدوي، إذا كان الموضوع يحتوي على مئات المشاركات المحملة في DOM دفعة واحدة فقد يتسبب ذلك في مشاكل في الأداء.
جعل كل محتوى العناوين متاحًا في DOM دون تدهور الأداء للجميع سيكون تغييرًا معقدًا للغاية، لذا فهذه منطقة وسطى. على الرغم من أنها ليست مثالية، إلا أن التنقل إلى مناطق “تحميل المزيد من المحتوى” سيؤدي إلى تحميل المزيد من المشاركات بشكل صحيح، وعند هذه النقطة يمكن إعادة فتح قائمة العناصر.
لقد قمت بتحديث لتغيير عناصر تحكم المشاركة من منطقة تنقل إلى منطقة شريط أدوات، وهذا أكثر دقة دلاليًا ويسمح لقائمة منطقة المعالم بالتركيز على المشاركات.
لقد قمت أيضًا بتحسين التسميات على عناصر تحكم المشاركة أثناء قيامي بذلك.
لذلك نحن ننتقل من قائمة عناصر معالم متفرقة إلى حد ما داخل المواضيع
مرحباً @awesomerobot، لقد تم توظيفنا من قبل APH لتقديم استشارات حول إمكانية الوصول لهذه المشكلة. لقد قدمت رابطين للفيديو أدناه يوضحان مشكلتنا الأساسية المتعلقة بهذا الموضوع. سترى المشكلة في التسجيل الأول بدءًا من الطابع الزمني 08:36 في التسجيل الأول. تدقيق إمكانية الوصول في Discourse باستخدام JAWS
هذا لا يتعلق بقائمة العناصر ولكن بما نسميه المفاتيح السريعة أو التنقل السريع، حيث سنتنقل إلى نوع عنصر HTML التالي (في هذه الحالة العناوين).
المشكلة في حل هذه المشكلة عن طريق إنشاء معالم جديدة هي أن المعالم عادة ما تكون محجوزة للأقسام عالية المستوى، لذلك بالنسبة لمستخدم قارئ الشاشة، فإن التنقل بين الأقسام الصغيرة من الصفحة باستخدام المعالم سيؤدي إلى إزالة الوصول السريع إلى المناطق الكبيرة من الصفحة مثل شريط التنقل. هذا أيضًا ينتهك معايير WCAG المستوى A مما يخلق تجاوزًا للحظر.
عظيم، شكراً على التفاصيل الإضافية! سيساعد الفيديو بشكل كبير - يبدو أن الفيديو محمي بكلمة مرور، هل يمكنك إما إلغاء قفله أو إرسال الرمز إلى accessibility@discourse.org
مرحباً @awesomerobot، أنا زميل لكودي ومهندس إمكانية وصول. لقد ألقيت نظرة على المستودع لتشخيص المشكلة. كما تعلمون بالفعل، يبدو أن المشكلة الأساسية هي أن (1) المحتوى الموجود في المشاركات المخفية غير قابل للعرض بواسطة قارئات الشاشة و (2) يتم إلغاء إخفاء المشاركات فقط عندما تكون ضمن عرض المستخدم لكل PostStreamViewportTracker
بالتفكير في إصلاح محتمل، أريد تحسين شيئين: (1) تمكين التنقل في كل مشاركة حسب العنوان باستخدام قارئات الشاشة و (2) تقليل التغييرات في مستودع Discourse وتأثيرها على الأداء.
النهج الذي أوصي به هو الاحتفاظ بغلاف خفيف الوزن لكل مشاركة تم تحميلها يتضمن H2 الدلالي المستخدم للتنقل حسب العنوان، بينما يظل نص المشاركة الثقيل مخفيًا. هذا يحافظ على استقرار العناوين للتقنية المساعدة دون تضخيم DOM عبر الصفحة بأكملها. عندما يصل المستخدم إلى أي عنوان H2 للمشاركة عبر التنقل حسب العنوان، سيؤدي قارئ الشاشة إلى تمرير الصفحة، مما يؤدي بدوره إلى إلغاء إخفاء نص المشاركة في مكانه.
تعتمد جدوى هذا الحل على وقت تحميل الدفعة التالية من المشاركات. يتمثل التحسين الاختياري في عنوان إرشادي مخصص لقارئ الشاشة فقط “تحميل المزيد من المشاركات” (على غرار “منطقة تحميل المزيد” المقترحة في طلب السحب الخاص بك) الموجود في أسفل قائمة المشاركات التي تم تحميلها. عندما يأتي هذا العنوان في العرض أو يتم تحديده من دوار العناوين، فإنه يقوم بتحميل الدفعة التالية ويعلن عن الاكتمال عبر رسالة aria-live=polite.
كما اقترحت، نضيف بعض العناوين الخفيفة المخصصة لقارئ الشاشة فقط على جميع المشاركات (المخفية أو غير المخفية) بالإضافة إلى عنوان يؤدي إلى تحميل المزيد من المشاركات، إلى جانب الإعلان عن اكتمال التحميل.
لا يزال قيد التقدم، لذا سيحتاج إلى بعض التحسين، ولكن نأمل أن نتمكن من توفير هذا الإصلاح للجميع قريبًا.
تحديث سريع لتوقعات الجدول الزمني: نحن في فترة تجميد ما قبل الإصدار للأسبوع القادم تقريبًا وسيكون جزء كبير من فريقنا خارجًا في اجتماعنا السنوي… لذلك من المحتمل أن يستغرق الأمر بضعة أسابيع قبل أن يتم تطبيق هذا التغيير.
