Несколько способов сделать ваш сайт легкодоступным

Структурирование страницы и ее ресурсов делает ее удобной для машин, какой бы ни была эта машина. Добавьте приемы, основанные на здравом смысле, которые позволяют пользователям (включая пользователей с ограниченными возможностями) и машинам получать прямой доступ к осмысленному контенту, и, несомненно, вы движетесь к тому, чтобы сделать ваш сайт легкодоступным и удобным для поисковых систем.

Мы все знакомы с мощью WordPress, которая позволяет новичку или неспециалисту проектировать и развивать свою собственную веб-собственность. Эта платформа проста в настройке и обеспечивает прочную основу для тем и плагинов, которые будут определять, как ваш контент и функциональность будут работать для любого посетителя.

Если вы хотите, чтобы ваш сайт был доступен для людей с ограниченными возможностями, вы обнаружите, что в базовом WordPress есть многое из того, что необходимо для облегчения разработки доступного веб-сайта, и нетрудно продвинуться дальше, добавив плагины и хорошие техника.

Прежде чем мы начнем, нужно знать два важных фактора. Во-первых, реализация этих четырех методов сама по себе не сделает любой веб-сайт полностью доступным для всех в той мере, в какой он будет соответствовать всем необходимым требованиям, но устранит наиболее распространенные барьеры для доступа к сети и обеспечит гораздо большую доступность.

Во-вторых, важно понимать, что доступность может быть достигнута только за счет сотрудничества проектирования, разработки и лучших практик создания контента. Дизайнер может разработать доступную тему, разработчик может добавить доступную функциональность, но если автор контента вставит осмысленное изображение без тега alt, полное значение веб-страницы будет недоступно.

Имея это в виду, вот четыре совета, которые помогут вам сделать ваш сайт легко доступным.

Альтернативный текст для ваших изображений

Хорошо известно, что самым большим препятствием для веб-доступности является правильное использование замещающего текста для описания изображений на веб-странице. Если бы к этому единственному пункту обращались все, кто создает веб-сайты, это устранило бы наибольшее количество жалоб на доступность. И именно по этой причине нам захотелось разработать замечательный плагин SEO Image Optimizer, который заполнит пробел в отсутствующих тегах alt на изображениях.

Главное, что нужно понять, это то, что если вы собираетесь размещать изображения на своем сайте, важно правильно пометить их альтернативным текстом. Другими словами, каждое изображение, которое вы размещаете в Интернете, должно иметь смысл, чтобы робот мог разместить ваше изображение в поисковых системах.

Информация в теге alt позволяет пользователям программ чтения с экрана (которые читают веб-страницы вслух для пользователей с нарушениями зрения), текстовых браузеров и медленных соединений, которые не загружают изображения, понимать информацию, передаваемую изображениями.

Если изображение не имеет смысла, например, используется исключительно для украшения, есть два способа справиться с этим. Если вы загрузите его как фоновое изображение с помощью CSS, программы чтения с экрана проигнорируют его, и для изображения не потребуется тег alt (будьте осторожны, потому что это также относится к осмысленным изображениям: если вы загрузите его в фоновом режиме, программа чтения с экрана его проигнорирует). ). Если изображение отображается с использованием HTML, но является чисто декоративным, используйте тег alt, но оставьте его пустым. Это говорит программе чтения с экрана, что изображение присутствует, но не имеет значения для пользователя и может быть проигнорировано, что позволяет сделать ваш сайт более доступным для читателя.

Когда вы помещаете ярлыки на свои изображения, используйте какой-нибудь описательный текст, который позволит людям, которые не видят, понять, что означает изображение. Это требует суждения: почему изображение было здесь и какое сообщение оно передает, и какие слова лучше всего передают то же самое значение. Не увлекайтесь буквальным описанием каждой визуальной детали, передайте смысл.

Классический пример — изображение увеличительного стекла, используемого в качестве кнопки для запуска поиска. Изображение имеет значение, поэтому его следует описать. Описание его как «увеличительное стекло» не поможет пользователю. Что им нужно знать, так это то, что нажатие на эту кнопку запустит поиск, поэтому альтернативный текст «нажмите здесь для поиска» или даже просто «поиск» может быть наиболее подходящим.

Только изображения, которые служат цели, должны быть помечены. Примеры:

Изображения, которые используются в качестве кнопок

Изображения, которые используются в качестве ссылок

Изображения, которые используются для любых других элементов управления

Изображения, которые непосредственно связаны с содержанием

Этот метод применим ко всем веб-сайтам, конечно, не только к сайтам WordPress. WordPress, однако, делает это проще, чем большинство других, во-первых, позволяя автору контента переключаться между представлениями Visual и HTML, а во-вторых, предоставляя поле для замещающего текста всякий раз, когда изображение вставляется с помощью функции «Добавить медиа».

Плагины для лучшей доступности

Доступность WordPress можно улучшить с помощью различных плагинов. Эти плагины легко настроить, и они позволят пользователям с широким спектром ограниченных возможностей получить доступ к сайту. Вот несколько плагинов, которые я нашел, которые сделают ваш сайт легко доступным.

Ключи доступа

Плагин Access Keys позволяет назначать ключи доступа ссылкам и элементам управления на вашем веб-сайте. Например, домашней ссылке может быть назначена комбинация клавиш доступа alt+h, а кнопке поиска может быть назначена комбинация клавиш alt+s. Ключи доступа, такие как приведенные примеры, позволяют пользователям с нарушениями зрения, а также людям с ограниченными физическими возможностями легко получать доступ к тому, что им нужно.

Легкий ретвит

Easy Retweet — это плагин, который позволит вам добавлять на свою страницу доступные кнопки, облегчающие обмен вашим контентом в Twitter. Таким образом, если люди с ограниченными возможностями захотят поделиться вашими страницами со своими друзьями, они смогут сделать это без каких-либо затруднений.

ASStickyPostOrderER

AstickyPostOrderER позволяет вам выбирать порядок отображения вашего контента. Вы можете выбрать отображение содержимого от самого старого к самому новому или в обратном порядке.

Hackadelic SEO Содержание

Плагин Hackadelic SEO Table of Contents позволяет вам предоставлять оглавление как для ваших сообщений, так и для ваших страниц. Это облегчит поиск вашего контента.

WP-опросы

WP-Polls позволяет людям с ограниченными возможностями участвовать в любых опросах, которые могут быть на вашем сайте.

Постоянно разрабатываются новые плагины. Используйте функциональность панели инструментов WordPress для поиска большего. Попробуйте разные плагины и попросите пользователей с ограниченными возможностями оставить отзыв.

При использовании любых плагинов убедитесь, что используемые плагины совместимы с выбранной вами темой, а также друг с другом. Если ваши плагины несовместимы с вашей темой, они либо не будут работать, либо создадут больше проблем для пользователей с ограниченными возможностями, которые попытаются просмотреть ваш сайт. Если ваши плагины несовместимы друг с другом, ваш сайт может стать непригодным для использования или контент может отображаться неправильно.

Способ пойти с заголовками

При разработке страниц очень важно структурировать контент, используя заголовки в правильном порядке: <h1> , <h2> , <h3> и так далее. Когда вы структурируете контент с помощью заголовков, люди, использующие программы чтения с экрана, могут получить сводку о том, о чем страницы, и легче перемещаться по ним. Пользователи программы чтения с экрана могут получить доступ к нужным разделам контента, нажав букву «H», чтобы перейти вперед, и «shift+H», чтобы вернуться назад.

Вы можете пометить свой контент, используя заголовки с первого по шестой, чтобы сделать ваш сайт легко доступным. Проверьте, как ваша тема использует заголовки (например, ваша тема может применять или не применять <h1> к заголовку сайта, и этот заголовок сайта может отображаться или не отображаться на каждой веб-странице. В любом случае убедитесь, что первым используемым заголовком является <h1> и следующие заголовки (название страницы, подразделы страницы, заголовки абзацев) опускаются по порядку до <h6> , где это уместно.

Существует некоторая гибкость в порядке упорядочивания, но наиболее разумный вариант — сохранять заголовки в порядке номеров и действительно не смешивать их, поскольку это создаст опасную ситуацию как для пользователя, так и для поисковой системы (не смешивайте их таким образом — > <h1> , <h4> , <h2> и т. д.).

Навигационные ссылки полезны

Наконец, вам нужно иметь навигационные ссылки в дизайне вашего сайта. Эти навигационные ссылки позволят пользователям с ограниченными возможностями пропускать панель навигации или другие меню и поля поиска и переходить к определенным местам на странице, щелкая эти ссылки. Или пользователь может быстро перейти к нужным разделам сайта. Эти ссылки должны появляться везде, где пользователям необходимо перейти к значимому контенту. Примеры того, что могут сказать эти ссылки:

Перейти к основному содержанию

Перейти к панели навигации

Перейти к поиску

Некоторые темы WordPress могут уже предоставлять такие ссылки. Если это так, вам нужно будет проверить эти ссылки, чтобы увидеть, нужно ли вам добавить какие-либо свои собственные. Однако другие темы не предоставляют навигационных ссылок. Таким образом, вам нужно будет добавить эти ссылки самостоятельно.

Подведение итогов

Я повторю то, что я сказал ранее, что ни один из этих шагов не гарантирует вам 100% доступность веб-сайта, но да, это повысит доступность вашего сайта для каждого посетителя, посещающего ваш сайт, и ваш сайт станет более доступным, чем 90% веб-сайтов WordPress. .

Посетители с ограниченными возможностями смогут перемещаться по вашему сайту так же, как и другие посетители. Поскольку эти посетители также включают поисковых роботов, вы должны быть уверены в одном: доступность вашего сайта также принесет пользу вашему бизнесу и поможет вам занимать первые места в поисковых системах, что в конечном итоге приведет к увеличению прибыли от вашего бизнеса.

Я надеюсь, что эта запись в блоге была для вас полезной, и вы взяли отсюда некоторые ключевые элементы, которые вы