В верхней части многих страниц нашего веб-приложения есть сообщения об ошибках и уведомления, «Сохранить» и другие кнопки, а , затем наш тег h1 с заголовком содержимого. Когда доступ к веб-приложению доступен, всегда ли приемлемо иметь контент выше тега структуры верхнего уровня, как мы здесь?Доступность в Интернете и заголовки h1-h6 - должен ли быть весь контент под этими тегами?
Да (вы можете положить вещи над ними). H просто означает «Заголовок». Речь идет о том, к чему относится заголовок.
Мое единственное предостережение: H2 не должно быть выше H1, а H3 не должно быть выше H2. Но я не думаю, что это фактическое правило. У нас есть меню, предупреждения, уведомления. Допускается размещать их над остальной частью вашего контента. Я не вижу, как это повлияет на доступность, если ваш контент упорядочен логически. Посмотрите на страницу CSS отключена. Это выглядит логично? Это самая важная часть доступности.
Хотя некоторые люди делают эту лишнюю милю и имеют меню в качестве последнего элемента в разметке и используют CSS, чтобы вернуть его к вершине. Лично я считаю, что решение работает продуктивно. Меню по-прежнему важно, оно находится в верхней части страницы.
Да, просто подумайте, что в этом порядке пользователь получит информацию. Итак, если вы только что сделали операцию, это звучит неплохо, чтобы получить какое-либо сообщение, связанное с ней, как первое. Если это уведомление, которое появляется на любой странице, не связанной с тем, что вы делаете, я бы не поставил его выше, поскольку это может быть немного странно. Также вы можете использовать текстовый браузер, который не использует стили, он должен выглядеть как документ с соответствующими заголовками.
В качестве пользователя для чтения с экрана я не люблю контент над основным заголовком. Обычно я перемещаюсь по заголовкам, поэтому пропускаю сообщение об ошибке. Лучшее решение состоит в том, чтобы вывести заголовок h1 над сообщением об ошибке, а затем оставить остальные заголовки в такте, давая вам два заголовка h1.
Теги заголовка служат для обозначения иерархии содержимого, находящегося под ним. У вас должен быть только один тег h1, и он должен быть первым содержимым, отображаемым на вашей странице (обычно это имя сайта). Кроме того, вы не должны пропускать теги заголовков при сверлении различных уровней содержимого.
В вашем случае вы все равно можете использовать CSS для позиционирования элементов выше тега h1, если он находится в правильном порядке в html.
Я предполагаю, что элементы над заголовком используются JavaScript. В этом случае предпочтительнее, если они созданы JavaScript, не включены в источник страницы.
Чтобы вернуться к исходному вопросу, вероятно, лучше всего, чтобы они были у подножия страницы. Однако, если они скрыты с помощью CSS «display: none»; или «видимость: скрытая»; свойства, то они не будут видны большинству (возможно, всем?) устройствам чтения экранов или многими другими вспомогательными технологиями, и поэтому это не должно быть проблемой. Я написал довольно подробный explanation of why accessibility technology ignores such elements.
Конечно, если кто-то отключит CSS, все будет выглядеть довольно грязно. Если на странице есть контент, который можно использовать, даже если CSS и/или JavaScript отключены, то размещение этих элементов в нижней части страницы по крайней мере сделает вещи менее загроможденными.