مخفی بودن محتوای خارج از صفحه از فناوری کمکی

مطمئن شوید که فقط بخش‌های مرتبط صفحه برای خوانندگان صفحه و سایر فناوری‌های کمکی قابل دسترسی است. به عنوان مثال، محتوایی که خارج از صفحه یا صرفاً نمایشی است باید برای فناوری‌های کمکی پنهان شود.

نحوه آزمایش دستی

برای بررسی اینکه محتوای خارج از صفحه پنهان است، باید این محتوا را به صورت دستی با استفاده از یک خواننده صفحه آزمایش کنید. - برای کاربران مک، این ویدیو را در مورد استفاده از VoiceOver بررسی کنید. - برای کاربران رایانه شخصی، این ویدیو را در مورد استفاده از NVDA بررسی کنید. - برای کاربران Chromebook، ChromeVox را بررسی کنید، خواننده صفحه داخلی. از کلید TAB برای حرکت در صفحه خود استفاده کنید. خواننده صفحه نباید محتوای پنهان را اعلام کند.

نحوه رفع مشکل

برای پنهان کردن محتوای خارج از صفحه، عنصری را که حاوی آن محتوا است از ترتیب تب حذف کنید، این کار را با تنظیم آن به display: none یا visibility: hidden انجام دهید.

مثال:

.remove-me {
  visibility: hidden;
}

<button class="remove-me">Can't reach me with the TAB key!</button>