Пользуясь интернетом и посещая разнообразные сайты, вы наверняка встречали на некоторых из них такую кнопку, которая включает версию страницы для слабовидящих людей. Если на неё нажать, то сайт обретает иной вид, буквы становятся крупнее и контрастнее, а иногда даже есть синтез текста в речь, чтобы читателю не приходилось даже читать.
В этой статье мы рассмотрим плагин для слабовидящих WordPress, узнаем, что он умеет, какие у него возможности и функции, и расскажем, на каких проектах может понадобится это использовать.
- Каким сайтам нужна версия для слабовидящих
- Плагин Button visually impaired
- Установка и настройка
- С помощью шорткода
- Виджет от плагина
- С помощью кода
- ГОСТ и законодательство
- Установка плагина
- Button visually impaired – кнопка для слабовидящих
- Озвучка текста для слабовидящих – ResponsiveVoice
- Плагин wordpress для слабовидящих – заключение
Каким сайтам нужна версия для слабовидящих
Преимущественно, версия для слабовидящих нужна на тех сайтах, у который большая часть аудитории относится к людям с проблемами со зрением либо имеет пожилой возраст.
На описанных выше типах проектов версия для слабовидящих рекомендуется. Но вовсе не запрещается реализовать её на каких-то других сайтах. Ничего плохого от этой функции не будет. Но другой вопрос – будут ли ею пользоваться. Поэтому после установки такой возможности, было бы не плохо провести исследование и проверить, переходит ли кто-то в версию для слабовидящих, нужно ли это вашей аудитории.
Ниже мы рассмотрим как в WordPress сделать версию для слабовидящих с помощью простого плагина.
Плагин Button visually impaired представляет собой простое средство для реализации версии для слабовидящих на сайте на WordPress. К его достоинствам относится наличие понятного и интуитивного русскоязычного интерфейса. А также он совершенно бесплатный и в нём нет никаких скрытых функций, которые открываются в платной версии. Всё становится доступно сразу после установки и активации.
Установите и активируйте данный плагин на своём сайте, чтобы воспользоваться им. После активации в консоли появляется новый раздел BVI. Все настройки находятся там. Перейдите в него, чтобы изучить их. Рассмотрим опции плагина:
Скриншот выше показывает вам, как выглядит панель управления и сама версия сайта для слабовидящих, созданная с помощью этого плагина для WordPress.
Плагин Button visually impaired
Искал Button visually impaired минут десять, хотелось дать лучшее решение.
Установка и настройка
Устанавливается стандартно, можно с помощью поиска по плагинам в админке WordPress.
Устанавливаем и активируем, появится новый раздел в панели под названием bvi v1.0.8 (версия может отличаться). Заходим и видим не большой список настроек.
Внизу нажимаем Сохранить или сбросить.
Плагин настроили под свой вкус, теперь надо его вставить в необходимое место. Можно использовать два метода это:
С помощью шорткода
Плагин имеет единственный шорткод, который можно вставить в WordPress, например в статью или виджет.
Давайте выведем его в сайдбаре.
В шорткоде есть надпись «Версия для слабовидящих», можно ее изменить. Переходим на главную и смотрим на результат. В сайдбаре появилась кнопка.
Нажимаем на нее, и видим как сверху появилось меню для настройки.
Крутая панель, человек со слабым зрением будет рад такой возможности, и останется на веб сайте больше времени.
Виджет от плагина
Чтобы вывести на экран, воспользуемся стандартным виджетом WordPress, который создает плагин. Заходим в виджеты и находим раздел «Версия для слабовидящих» и перетаскиваем в ту область где необходимо вывести кнопку.
Переходим в любую статью и смотрим что получилось. Отлично, работает, можем переходить к следующему методу.
С помощью кода
Если захотите вставить шорткод напрямую в код темы, то у вас ничего не получиться, в лучшем случае– не отобразиться, в худшем–блог заклинит.
Поэтому используем PHP код, который позволяет обработать и вывести действие shortcode на экран, вот так он выглядит.
Хочу вывести под заголовком статьи, придется покопаться в файлах темы и найти искомый документ. Универсальной инструкции не дам, потому что темы разные, обычно это single.php но в Twenty Sixteen представлен как content-single.php. Нашел место, вставляю код и сохраняю.
Переходим в любую запись и смотрим, появилась ли кнопка под заголовком.
Да отлично, плагин CMS WordPress для людей с ограниченным зрением работает. Что мне особенно понравилось:
Нужно немного поработать со стилями и настроить внешний вид, но факт, что инструмент работает и с ним может разобраться любой новичок.
Список дополнений для слабовидящих не ограничен только Button visually impaired, приведу остальные варианты:
К сожалению специальных шаблонов для слабовидящих нет, потому что не часто приходится им пользоваться, продвигать такой ресурс будет сложнее. Можно использовать и адаптировать для людей с плохим зрением всплывающие формы обратной связи.
ГОСТ и законодательство
Версия для слабовидящих должна отвечать ГОСТу, установленный законодательством. Особых требований нет, но первый вариант отвечает всем пунктам из документа.На этом закончу, в статье мы разобрали супер плагин WordPress для создания версии сайта для слабовидящих, успехов!
Установка плагина
Откройте файл bvi-init.js для редактирования настроек. Таблица настроек. Пример шаблона страницы.
Активация плагина. В файле bvi-init.js добавлем класс включения плагина ‘bvi_target’ : ‘.bvi-open’ и спользуем следующий код.
Плагин wordpress для слабовидящих сделает ваш вордпресс – сайт доступным для людей с инвалидностью по зрению буквально за 5 минут. Эта возможность увеличит посещаемость и удобство пользования ресурсом.
Всех приветствую на своем блоге!
На сегодня я подготовил серию видео обзоров, или уроков, кому как нравится, по теме «плагин wordpress для слабовидящих».
Лично я считаю, что для проектов не относящихся к государственным образовательным порталам, совсем не обязательно придерживаться строгих правил указанных в ГОСТе
Если рассматривать эту тему с точки зрения тематических блогов, то и подходить к этому вопросу нужно индивидуально. Большинство популярных блогеров знают свою аудиторию.
Допустим, для обучающих видео уроков желательно иметь озвучку текста. Т. есть, полное описание видео в текстовом варианте.
Совсем недавно из новостей я узнал, что более 15% мужского населения дальтоники от рождения. Совсем не мало. Отсюда простой вывод, что для своего блога мне не хочется терять эту аудиторию и при выборе плагина wordpress для слабовидящих, я учту этот момент.
В итоге, необходимо подбирать плагины, или на худой конец скрипты, под свой проект. Я несколько таких уже перепробовал и хочу поделиться с вами своими наработками.
Button visually impaired – кнопка для слабовидящих
Первым и наверное, самым удачным, на мой взгляд – плагин Button visually impaired (кнопка для слабовидящих). Полностью бесплатен и на русском языке.
После установки в меню появится пункт BVI.
Установил, включил и добавил виджет. В результате появится кнопка с названием «версия для слабовидящих».
В настройках можно задать нужные параметры сразу по умолчанию, либо сделать это позже, на панели инструментов. Кроме того, можно изменить текст, цвет кнопки и вставить ее в любом месте с помощью шорт кода.
Шаг № 2 – Включаем виджет и переходим в меню под названием Accessibility Statement
На этом этапе главное правильно заполнить поле с адресом сайта, все остальное не важно. Именно адрес является главным параметром для настройки виджета.
Шаг № 3
Возвращаемся назад в меню Your Widget и кликаем на кнопку Sign In.
На основании этих данных на сайте разработчика создается личный кабинет откуда и происходят все настройки.
Шаг № 4
Настраиваем функционал и внешний вид кнопки для слабовидящих.
Шаг № 5
После настройки копируем полученный код и вставляем в тему оформления wordpress.
Сразу опишу плюсы данного плагина:
Очень простой плагин, не требующий никаких виджетов и вставки кодов. После активации появляется в меню админки и имеет три пункта меню с различными настройками.
По умолчанию все настроено на включение, нужно немного подправить заголовки на русский язык.
Основной функционал – это изменение текста, фона, контраста и подчеркивание ссылок.
Пункт меню settings – настройки включения и отключения различных опций, а так же на какой срок настройки панели инструментов будут запоминаться (от 12 часов, до 1 месяца).
Пункт меню toolbar – настройка заголовков меню виджета. Здесь все поля можно заполнить своими названиями. Кроме того, есть возможность подставить 3 ссылки на страницу с картой сайта, страницу отзывов и справки. Эти страницы могут быть созданы на вашем сайте.
Пункт меню customize – настройка иконки (3 варианта), позиция кнопки (слева, справа), размер иконки для декстопной версии и для мобильной. Можно настроить фон иконки и контур при наведении.
Плагин полностью бесплатен. Cкачать его можно с сайта разработчика, или установить обычным способом, из репозитария wordpress.
Главный минус – скудный функционал, но обратных ссылок нет и полностью бесплатен. Возможно подойдет блогам с основной информацией в виде текста.
Простой как три копейки плагин. После установки необходимо только добавить виджет в нужную позицию блога. Основными настройками являются изменение размеров тегов HTML/CSS. В основном это текстовые теги (параграфы, списки и таблицы).
Размеры текста можно устанавливать на свое усмотрение.
В данном случае я назвал виджет доступности. И все что было указано в полях, будет отображаться в виджете.
Цифры в процентах можно заменить на текст: smail, medium, large, x-large, xx-large. Соответственно и виджет будет выглядеть по другому.
Видео по этому плагину я не записывал, так как проще не придумаешь.
Озвучка текста для слабовидящих – ResponsiveVoice
Достойный плагин wordpress для слабовидящих, в котором можно не заморачиваться с размером текста, а просто прослушать весь контент.
В бесплатном варианте доступны всего три параметра:
Чтобы прослушать текст, необходимо его выделить курсором.
После установки появится еще один пункт меню responsivevoice и страница с полем для ввода API.
Для работы плагина необходима регистрация на сайте разработчика, затем заполнить нужную информацию (адрес сайта), получить код скрипта, вставить в шапку сайта и подтвердить его установку.
После этого будет предложено настроить три параметра о которых речь шла чуть выше и язык на котором будет озвучиваться текст.
Этот плагин так же имеет минимум настроек и опций. В основном это минимальный набор:
После установки нужно только включить все параметры. Никаких виджетов и шорткодов, все устанавливается по умолчанию.
Настроить можно только иконку кнопки – выбрать нужный вариант из четырех предложенных, фоновый цвет, цвет текста, цвет кнопок и цвет кнопки закрытия.
Плагин wordpress для слабовидящих – заключение
Как я уже говорил, из всех рассмотренных бесплатных плагинов, на мой взгляд, Button visually impaired – оптимальное решение. Но не стоит и недооценивать свою аудиторию. Возможно, что все “плюшки” с изображениями и фонами совсем не то, что нужно, а вот с озвучкой текста (ResponsiveVoice), как раз оно.
Конечно, таких плагинов существует намного больше. Но часть их устарела, а часть не доведена до логического завершения. Если вдруг вам попадется достойное решение, буду рад если вы мне сообщите об этом в комментариях.
На этом пока все!
Тема сегодняшнего поста: автоматическое преобразование в блоки Gutenberg классического контента на сайте WP. Как массово преобразовать все ваши старые записи (существующие) сделанные в классическом редакторе WordPress в отдельные блоки Gutenberg?
Привет, друзья! Вы хотите добавить бесконечную прокрутку на свой сайт или блог? Тогда читайте как это сделать. Бесконечная прокрутка WordPress позволяет автоматически загружать следующий набор записей, когда посетители приближаются к
Здравствуйте, дамы и господа! Как сделать сайт WordPress доступным для слабовидящих? Версия сайта для слабовидящих в WordPress делается с помощью специального плагина. Поскольку установка плагина осуществляется автоматически и не требует
Привет, всем поклонникам WordPress! Как мы можем внести разнообразие в наш текст? Это выделить важные участки в записи с помощью цветных блоков внимания. Для этого, нам нужно добавить блоки внимания
Друзья, «тёмные времена наступили». Хотите реализовать ночной режим для своего сайта? Вернее, как сделать в теме/шаблоне WodPress — ночной режим. Тогда читаем — как добавить тёмный/ночной режим на сайт WordPress.
Плагин кэширования WordPress. Пошаговое руководство по полной настройке SEO плагина W3 Total Cache.
Site Kit от Google предоставляет пользователям WordPress доступ к информации и статистике из инструментов Google прямо в панели управления.
Всем привет! Сегодня мы узнаем, как создать файл ads.txt и app-ads.txt для WordPress и Google Blogger? Если вы видите в своем аккаунте Адсенсе уведомление о проблемах с файлом ads.txt, то
Здравствуйте! Тема данного поста: как установить и запустить WordPress на локальном компьютере. Сейчас вы узнаете, как быстро и легко установить WordPress локально на ПК Windows (Linux, Mac) с помощью программы
Создавайте дочерние темы WordPress одним нажатием кнопки. Вы можете создать дочернюю тему для любой темы в WordPress. Child theme используются, когда вы хотите внести изменения на сайте без изменения кода или файлов в исходной теме.