Добавляем иконки сайта для iPhone, iPad и Android
Если Ваш сайт достаточно популярен, то многие пользователи заходят на него даже с телефонов и планшетов! Многие добавляю его в закладки на рабочий стол телефона или планшета, для того чтобы на рабочем столе отображалась красивая иконка вашего сайта, необходимо…
- Главная
- Все про HTML
Если Ваш сайт достаточно популярен, то многие пользователи заходят на него даже с телефонов и планшетов!
Многие добавляю его в закладки на рабочий стол телефона или планшета, для того чтобы на рабочем столе отображалась красивая иконка вашего сайта, необходимо:
Первым делом, нам необходимо создать нужную иконку в формате .png. Рисуете (или подбираете) ее. Желательно, в хорошем разрешении.
Качество (разрешение) экранов устройств от Apple постоянно растет и меняется, поэтому нужно оптимизировать эти «картинки» под разные устройства.
Второе, необходимо сделать иконки разных размеров для разных устройств:
для старых iPhone размер иконки должен быть 57х57, для новый, начиная с 4-го действуют следующие размеры:
- 60х60 — IPhone
- 76×76 -iPad
- 120×120 — iphone-retina
- 152×152 — ipad-retina
Третье, вставить в код указав пути к картинкам:
<link rel="apple-touch-icon" href="touch-icon-iphone.png"> <link rel="apple-touch-icon" href="touch-icon-ipad.png"> <link rel="apple-touch-icon" href="touch-icon-iphone-retina.png"> <link rel="apple-touch-icon" href="touch-icon-ipad-retina.png">
Safari на iOS 7 не добавляет эффекты к иконкам. А старые версии Safari добавляли эффекты для иконок , чтобы эффект не применялся — нужно к именам файлам добавить —precomposed.png
А что Android!?:
Все дело в том, что Android-девайсы также подхватывают файлы apple-touch-icon.
Справедливости ради, хочу заметить, что ОС Android намеренно не ищет эти иконки, а только в том случае, если пользователь решил добавить сайт на «рабочий стол».
В заключении — если не хотите заморачиваться со вставкой кода, подготовкой картинок разного размера, то просто закиньте в корень сайта картинку (размером 60 на 60 пикселей) с названием «apple-touch-icon.png». Это самый простейший способ.
Мы советуем использовать сервис ICONOGEN
Укажите файл с иконкой и сервис быстро сделает иконки разных размеров:
Файлы можно скачать архивом.
Сервис так же генерирует html код для вставки в шаблон сайта:
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" /> <link rel="apple-touch-icon" href="/apple-touch-icon-57x57.png"> <link rel="apple-touch-icon" href="/apple-touch-icon-60x60.png"> <link rel="apple-touch-icon" href="/apple-touch-icon-72x72.png"> <link rel="apple-touch-icon" href="/apple-touch-icon-76x76.png"> <link rel="apple-touch-icon" href="/apple-touch-icon-114x114.png"> <link rel="apple-touch-icon" href="/apple-touch-icon-120x120.png"> <link rel="apple-touch-icon" href="/apple-touch-icon-144x144.png"> <link rel="apple-touch-icon" href="/apple-touch-icon-152x152.png"> <link rel="apple-touch-icon" href="/apple-touch-icon-180x180.png"> <link rel="icon" type="image/png" href="/favicon-16x16.png"> <link rel="icon" type="image/png" href="/favicon-32x32.png"> <link rel="icon" type="image/png" href="/favicon-96x96.png"> <link rel="icon" type="image/png" href="/android-chrome-192x192.png"> <meta name="msapplication-square70x70logo" content="/smalltile.png" /> <meta name="msapplication-square150x150logo" content="/mediumtile.png" /> <meta name="msapplication-wide310x150logo" content="/widetile.
png" /> <meta name="msapplication-square310x310logo" content="/largetile.png" />
png">
<link rel="apple-touch-icon" href="/apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" href="/apple-touch-icon-114x114.png">
<link rel="apple-touch-icon" href="/apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" href="/apple-touch-icon-144x144.png">
<link rel="apple-touch-icon" href="/apple-touch-icon-152x152.png">
<link rel="apple-touch-icon" href="/apple-touch-icon-180x180.png">
<link rel="icon" type="image/png" href="/favicon-16x16.png">
<link rel="icon" type="image/png" href="/favicon-32x32.png">
<link rel="icon" type="image/png" href="/favicon-96x96.png">
<link rel="icon" type="image/png" href="/android-chrome-192x192.png">
<meta name="msapplication-square70x70logo" content="/smalltile.png" />
<meta name="msapplication-square150x150logo" content="/mediumtile.png" />
<meta name="msapplication-wide310x150logo" content="/widetile.
Установка иконки для сайта
- Что такое иконка сайта?
- Как создать иконку для сайта?
- Установка иконки на сайт
- Смена иконки сайта
Что такое иконка сайта?
Как вы могли уже заметить, когда страница сайта открыта в браузере, во вкладке отображается не только заголовок страницы, но также и маленькая
иконка, которая располагается перед заголовком и помогает нам отличать страницы одного сайта от страниц других сайтов
(см. рисунок №1). Это
особенно удобно, когда в браузере одновременно открыто много различных страниц, принадлежащих разным сайтам. Кроме того, иконка веб-сайта
отображается рядом с ссылкой при добавлении страницы сайта в закладки браузера, в истории браузера, а также в некоторых поисковиках, например,
Яндексе, где иконки сайтов располагаются опять же перед заголовками страниц сайтов, выданных по текущему поисковому запросу.
Рис. №1. Пример содержимого корневой папки сайта
Как видно из скриншота выше, иконка действительно помогает сделать сайт оригинальным и запоминающимся, тем самым привлекая внимание
большего количества пользователей. Так что отнестись к созданию иконки сайта следует подобающим образом, иначе рядом с его страницами
будут отображаться однообразные пиктограммы текущего браузера. Кроме того, отсутствие иконки сайта относится к правилам дурного тона
и говорит скорее всего о неопытности веб-мастера либо временных неполадках на сайте.
Как создать иконку для сайта?
Для создания иконки сайта нужно воспользоваться либо специальной программой, либо одним из онлайн сервисов в Интернете, либо создать квадратное изображение размера 16х16 и более пикселей самостоятельно, сохранив его в виде файлика favicon.ico (как можно легко догадаться, имя файла представляет собой сокращение от словосочетания favorites icon). При этом хотелось бы сделать пару уточнений:
- разрешается использовать иконки и больших размеров, а точнее 32х32, 48х48 и более пикселей, однако браузеры в основном все равно сжимают их до стандартного значения в 16х16 пикселей;
- несмотря на то, что на сегодняшний день стандартным универсальным форматом для иконки, который поддерживают все основные браузеры, является формат ICO, большинство браузеров поддерживают также форматы PNG, JPEG и GIF.
В виду того, что размеры иконки очень маленькие, не имеет смысла использовать для них высококачественные изображения.
Установка иконки на сайт
После того, как иконка будет готова ее необходимо поместить в корневую папку сайта. Именно там браузеры по умолчанию будут искать ее для дальнейшего отображения на экране. При этом иконка будет отображаться рядом с заголовками всех страниц сайта. Если же необходимо разместить иконку в другой папке или для какой-то страницы требуется установить свою иконку, следует воспользоваться тегом <link> (см. пример №2).
HTML htmlCodes
<!DOCTYPE html> <html> <head> <!-- Указываем кодировку страницы --> <meta charset="utf-8"> <!-- Зададим базовый адрес --> <base href="https://site.name/"> <!-- Иконка отобразится во вкладке возле данного заголовка страницы --> <title>Использование «link» для установки иконки сайта</title> <!-- Подключаем к странице иконку в формате ICO --> <link rel="icon" href="favicon.
ico" type="image/x-icon">
</head>
<body>
Если необходимо подключить иконки других форматов,
следует использовать следующие конструкции:
<link rel="icon" href="favicon.jpeg" type="image/jpeg">
<link rel="icon" href="favicon.png" type="image/png">
<link rel="icon" href="favicon.gif" type="image/gif">
</body>
</html>
Пример №2 Использование элемента «link» для подключения иконки сайта
Как видно из примера, в теге <link> необходимо прописать абсолютный или относительный путь к файлу иконки, в качестве значения атрибута rel указать «icon», а в атрибуте type сообщить mime-тип подключаемого изображения.
Смена иконки сайта
Для того чтобы заменить уже установленную иконку сайта, которая расположена в корневой папке сайта, необходимо удалить из нее старую иконку и
просто загрузить в нее новую. После обновления страницы и кеша браузер автоматически произведет замену старой иконки сайта на новую.
Если же иконка расположена в папке, отличной от корневой, то следует поместить в данную папку новую иконку, а старую удалить (хотя, если форматы иконок будут отличаться, то старую иконку можно и не удалять). Далее, если формат новой иконки будет отличаться от формата старой, нужно будет обязательно прописать в теге <link> новые значения атрибутов href и type, т.к. при смене формата изображения изменится как расширение файла (а значит и путь к нему), так и его mime-тип.
Быстрый переход к другим страницам
- Понятие файловой структуры сайта
- Установка иконки сайта
- Карта сайта
- Вернуться к оглавлению учебника
Как добавить и удалить логотип и значок сайта в редакторе сайтов
В этом уроке вы узнаете, что такое логотип и значок сайта. Где они отображаются, как добавить и удалить без Настройщика.
Задачи
После завершения этого занятия участники смогут:
- Определять логотип и место его появления
- Добавление и удаление логотипа на вашем сайте без Customizer
- Определите значок сайта и место его появления
- Добавление и удаление значка сайта на вашем сайте без Customizer
Предварительные навыки
Участники получат максимальную отдачу от этого урока, если они знакомы с:
- Локальными установками WordPress
- Установка темы
- Знакомство с редактором сайта и редактором шаблонов
- Простой дизайн сайта с полным редактированием сайта
Вопросы о готовности
- Можете ли вы установить WordPress?
- Можно ли установить тему WordPress?
- Знакомы ли вы с редактором сайта?
Необходимые материалы
- Локальная установка WordPress под управлением WordPress 5. 9 или более поздней версии
- Twenty Twenty Two или любая тема блока
- Графика для логотипа вашего сайта
- Графика для иконки вашего сайта
9 или более поздней версииПримечания для докладчика
- Перед этим уроком будет полезно создать локальный сайт с установленной темой Twenty Twenty-Two. Если вы используете другую тему блока, вам может потребоваться адаптировать схему урока.
- Участникам может потребоваться загрузить и установить WordPress 5.9 или более позднюю версию, а также тему Twenty Twenty-Two перед началом
- Смело меняйте графику для сайта
План урока
- Объясните, что такое логотип и зачем он вам нужен.
- Продемонстрируйте, как добавлять и удалять логотип сайта без настройщика.
- Объясните, что такое значок сайта и зачем он вам нужен.
- Продемонстрируйте, как добавить и удалить значок сайта без настройщика.
Оценка
Зачем нужен логотип сайта? (выберите все правильные ответы)
- Чтобы выглядеть круто
- Чтобы помочь людям узнать ваш бренд
- Чтобы завоевать доверие аудитории
- Быть доступным
Ответ: #2 и #3
Где обычно появляется логотип сайта ? (выберите все правильные ответы)
- В нижнем колонтитуле сайта
- Домашний экран смартфона
- В шапке вашего сайта
Ответ: #3
Где появляется значок сайта (выберите все правильные ответы)
- Строка меню браузера
- Главный экран смартфона
- Нижний колонтитул сайта
Ответ: № 1 и № 2
В качестве значка сайта можно использовать только свой логотип.
- Правда
- Ложь
Ответ: #2
Дополнительные ресурсы
- Документы поддержки: тема Twenty Twenty-Two
- Документы поддержки: Редактор сайта
- Документы поддержки: как обновить значок сайта
- Изучите курс WordPress: простой дизайн сайта с полным редактированием сайта
Пример урока
Что такое логотип и зачем он нужен?
Логотип — это графическое изображение вашей компании (или вас, если у вас его нет). Он представляет ваш бренд и помогает вашим посетителям легко узнать вас и завоевать доверие. Например, когда вы видите большой красный крест, о чем вы думаете? Красный крест. Как только вы увидите логотип, вы сразу поймете, что это за компания.
Проверьте, есть ли в вашей теме WordPress ограничения на размер логотипа. Хорошо иметь логотип для светлого фона и еще один для темного фона.
Как добавить и удалить логотип сайта без Настройщика
Перед полным редактированием сайта (FSE), если вы хотите внести изменения в свою тему, вы можете сделать это с помощью Настройщика.
С FSE внесение изменений в вашу тему теперь выполняется в редакторе сайта.
Добавление логотипа сайта
- Откройте локальный тестовый сайт
- Выберите Внешний вид > Редактор.
- По умолчанию это экран редактора сайта, где вы можете вносить изменения в различные страницы и элементы своего сайта. Вы также видите, как любые внесенные вами изменения будут выглядеть на внешнем интерфейсе (на компьютере, планшете и мобильном устройстве).
- Подтвердите, что они на правильной странице. При использовании Twenty Twenty-Two они увидят заголовок с изображением птицы.
- Покажите им, что они могут:
- Нажмите на элемент блока
- Перейти к списку, чтобы увидеть элементы на их странице
- При наведении курсора на блок с логотипом сайта должно появиться «Добавить логотип сайта». Нажмите на блок с логотипом сайта, чтобы открыть «Медиатеку».
Нажмите на блок с логотипом сайта, чтобы открыть «Медиатеку».- Выберите изображение, которое хотите использовать. Если файл еще не существует, нажмите «Загрузить», чтобы просмотреть свой компьютер и добавить его в свою библиотеку. При добавлении любых медиафайлов в свою библиотеку обязательно добавляйте замещающий текст (alt-text). Альтернативный текст используется программами чтения с экрана для посетителей сайта с потерей зрения. Узнайте все об альтернативном тексте и о том, как описать назначение изображения.
- По умолчанию ваш логотип будет обрезан, если он не квадратный и не ведет на вашу домашнюю страницу. Вы можете изменить стиль и настройки, нажав на одну из доступных опций в «Стили» или на панели «Настройки» в выбранных настройках Блока.
- Чтобы увидеть, как значок выглядит на разных устройствах, нажмите ссылку «Предварительный просмотр» в верхней части экрана и выберите нужный вариант.
- Если вам нравится, как это выглядит, нажмите кнопку «Сохранить» в верхней части экрана.
Удаление логотипа сайта
- Нажмите на блок логотипа сайта, а затем нажмите кнопку «Заменить».
- Возможно, вам придется нажать на три вертикальные точки в верхней части экрана, чтобы кнопка «Заменить» появилась в ваших вариантах.
- Теперь у вас есть три опции.
- Заменить логотип сайта на изображение из «Медиатеки».
- «Загрузить» новый со своего компьютера.
- «Сбросить» блок логотипа сайта. Сброс блока логотипа сайта удаляет значок, и теперь блок отображается как пустой.
Что такое значок сайта и зачем он нужен?
Значок сайта, также известный как Favicon, представляет собой небольшое изображение, связанное с вашим сайтом.
Вы видите их в своем браузере (закладки, панели поиска, результаты истории, панели инструментов) и на своих устройствах в виде значка приложения.
Наличие значка сайта облегчает идентификацию посетителей вашего сайта. Он также скрывает слоган вашего сайта при добавлении значка на главный экран мобильного устройства или при просмотре нескольких вкладок в браузере, занимая гораздо меньше места и облегчая поиск.
Добавление значка сайта
- Выберите блок логотипа сайта для доступа к панели «Настройки».
- Если вы хотите использовать свой логотип, переключатель «Использовать как значок сайта» включен по умолчанию.
- Если вы хотите использовать другой значок, щелкните ссылку «Настройки значка сайта».
- Щелкнув ссылку «Настройки значка сайта», вы перейдете к Customizer > Site Identity.
- Внизу в разделе «Значок сайта» нажмите кнопку «Выбрать значок сайта».
- Если на сайте уже есть значок, вместо него вы увидите кнопку «Выбрать изображение».
В вашей теме WordPress могут быть рекомендации по форме и размеру значка вашего сайта.
- Вы можете выбрать изображение из своей «медиатеки» или «загрузить» файл со своего компьютера.
- После того, как вы выбрали графику, которую хотите использовать, нажмите кнопку «Выбрать» в нижней части экрана. Не забудьте включить альтернативный текст.
- Если ваше изображение не квадратное, вам будет предложено обрезать изображение.
- После обрезки, если это необходимо, вы вернетесь в настройщик и сможете увидеть предварительный просмотр значка вашего сайта на вкладке браузера.
- Если вам нравится, как это выглядит, нажмите кнопку «Опубликовать» в верхней части настройщика, чтобы сохранить изменения.
Удаление значка сайта
- После нажатия на ссылку «Настройки значка сайта» на панели настроек блока логотипа сайта вы попадете в раздел «Настройщик» > «Идентификация сайта».
- Внизу в разделе «Значок сайта» нажмите кнопку «Удалить». Это удалит значок сайта.
- Нажав кнопку «Изменить изображение», вы попадете в медиатеку, где сможете использовать существующую графику или загрузить новую со своего компьютера.
- Нажмите кнопку «Опубликовать» в верхней части настройщика, чтобы сохранить изменения.
Упражнения
Добавление логотипа сайта на сайт
Чтобы добавить логотип сайта на сайт, выполните указанные выше действия
Удалить логотип сайта
Выполните шаги, описанные выше, чтобы добавить логотип своего сайта на сайт
Добавьте значок сайта на свой сайт
Выполните шаги, описанные выше, чтобы добавить логотип своего сайта на сайт
Удалите значок своего сайта
Следуйте шаги выше, чтобы добавить логотип вашего сайта на сайт
Завершение урока
Совет: 💡 Выполните упражнения и оценку, описанные выше.
10 причин, по которым вам следует разместить значок веб-доступности на своем веб-сайте
Доступность Интернета является одной из наиболее важных цифровых проблем в настоящее время, влияющих на каждый бизнес. В связи с этим предприятия в настоящее время прилагают усилия к тому, чтобы их веб-сайты предоставляли равные возможности для всех, адаптировались к сложным рекомендациям WCAG и соответствовали мировым стандартам доступности.
Однако, имея дело с трудностями доступности, веб-дизайнеры часто упускают из виду некоторые незначительные вещи, которые могут иметь огромное влияние. Необходимо знать, что доступность не ограничивается содержанием веб-сайта; им также необходимо получить значок веб-доступности, чтобы охватить всех пользователей Интернета.
Вам должно быть интересно, какую роль значок играет в игре доступности? Продолжайте читать эту статью, чтобы понять, почему значки доступности веб-сайтов так важны.
Что такое значок веб-доступа?
Изображение: Источник.
Независимо от того, о чем значок и какой бы дизайн вы ни выбрали, значок должен быть видимым. Это сделает значок доступным.
Таким образом, функция, которая доступна для всех типов людей для чтения и взаимодействия на веб-сайте, называется значком веб-доступности. Он включает в себя изображения, значимые тексты, сочетания клавиш, преобразование текста в речь и т. д., чтобы люди с ограниченными возможностями могли легко получить доступ к информации на любом веб-сайте.
Например, посмотрите на этот значок. Это влечет за собой блокировку и строку пароля, это указывает на то, что вам нужно добавить свой пароль здесь, чтобы войти в эту учетную запись.
В другой учетной записи см. здесь, как W3C использовал значки для демонстрации человека с инвалидностью.
Почему важен значок веб-доступности?
Почему бы не сделать ваш сайт доступным для широкой аудитории? И не только доступный, но и опыт, когда пользователь доволен внешним видом и представленной информацией.
Есть сотни причин, по которым вы должны получить значок веб-доступности на своем веб-сайте. У нас есть несколько здесь для вас.
1. Добавьте значок веб-доступности, чтобы захватить весь фрагмент:
Около 15% населения во всем мире страдает какой-либо формой инвалидности. Отсутствие значка веб-доступности на вашем веб-сайте является барьером между вами и вашей потенциальной аудиторией.
Добавив значок веб-доступности, вы можете реально увеличить посещаемость своего веб-сайта. Кроме того, только 2% веб-сайтов предлагают функцию значков веб-доступности по всему миру, что дает вам самые большие шансы. Вы можете использовать его, чтобы охватить почти все 15% населения с ограниченными возможностями, так как на вашем пути почти нет конкурентов.
Более того, с каждым годом инвалидность увеличивается, и не только это, но и технологии развиваются самыми высокими темпами. Так почему бы не использовать его для себя и для улучшения общества? Когда человек с инвалидностью нажимает на ваш веб-сайт, он уйдет, если не сможет найти значок доступности.
Следовательно, добавление значка принесет пользу им и компенсирует это вам. В конце концов, разве одной из целей вашего сайта не является увеличение посещаемости и кликов аудитории? Помогите себе в достижении этого, просто добавив значок веб-доступности.
2. Никогда не упускайте из виду меньшинства:
Помните, что не все наделены всеми органами чувств, которые ограничивают их использование Интернета. Разве вы не хотите, чтобы ваш сайт вмещал всех? Материальные блага и привилегии автоматически отбрасываются, когда вы понимаете, что ваша работа приносит пользу только избранным. Следовательно, чтобы сделать ваш сайт доступным, вы никогда не должны упускать из виду меньшинство.
Наденьте их обувь на некоторое время и протестируйте свой веб-сайт сегодня. Это позволит вам узнать, где вашему веб-сайту не хватает доступности. Наряду с другими мерами также рассмотрите возможность добавления значка веб-доступности для людей с ограниченными возможностями.
Это не только поможет пользователям с ограниченными возможностями максимально использовать веб-сайт, развлекаясь, но и поможет вашему бизнесу.
Кроме того, он включен в нормы морали, потому что имеет большое значение и говорит о правах меньшинств. Получите один для вашего веб-сайта, а также!
3. Получите значок веб-доступности для улучшения репутации:
Поскольку мир все больше и больше движется в сторону общественного благосостояния и брендов, которые участвуют в таких мероприятиях, если вы тоже занимаетесь ими, вы может создать положительный образ вашего бренда в глазах всего мира. Более инклюзивный веб-сайт поможет вам связаться с социально сознательными потребителями и повысит вероятность того, что они будут продвигать ваш бренд.
КСО является важной основой для всех крупных и малых предприятий по всему миру, и вы также должны включить этот принцип в свой бренд. Если вы укрепите свои позиции в области корпоративной социальной ответственности, общий имидж вашего бренда повысится.
Вы получаете тысячу кликов на своем сайте в день. Когда пользователи видят на нем значок веб-доступности, название вашего сайта, скорее всего, останется в их памяти из-за вашего внимания к людям с ограниченными возможностями. Однако, как только становится известно, что веб-сайт не поддерживает или не поддерживает людей с ограниченными возможностями, это действительно разрушает имидж. Вы должны следить за этим, не так ли?
4. Никогда не недооценивайте силу преданного поклонника:
Благодаря высоким технологиям увеличилось использование Интернета, а учитывая количество людей с ограниченными возможностями, они, как правило, больше взаимодействуют в цифровом формате. Почему бы не сделать это конкретное место безопасным и подходящим для них? Когда ваш конкурент не предоставляет значок веб-доступности, а вы это делаете, вы автоматически создаете доверие и лояльность к своему веб-сайту для пользователей, что в конечном итоге выгодно для вас. Следовательно, пользователи будут отдавать предпочтение вашему сайту над другими.
Во-вторых, поскольку вы будете тем, кто предоставит эту функцию, очевидно, что население с ограниченными возможностями будет доверять вам и будет лояльно только к вам. Сарафанное радио никогда не следует недооценивать. Чем больше имя вашего веб-сайта будет вращаться среди людей, тем больше будет расти доверие, лояльность и подлинность.
5. Почему бы и нет?
Существует распространенное заблуждение, что добавить значок, доступный через Интернет, сложно. Однако все наоборот. Удобный веб-сайт намного проще разработать, чем не очень удобный. Разработчик веб-сайта в конечном итоге знает, как сделать веб-сайт доступным и доступным для всех типов пользователей; следовательно, он автоматически инициирует веб-доступный значок на вашем веб-сайте.
Например, чтобы сделать вашу иконку доступной, вам нужно сделать ее более четкой и заметной, сделайте так, чтобы вы могли учесть следующее:
— посмотрите на размеры пикселей и квадратов.
– установите цветовой контраст по необходимости.
— добавить скрытый текст позади, позволяющий программам чтения с экрана интерпретировать.
— ваши семантические значки должны сопровождать видимый текст, чтобы избежать двусмысленности.
Помимо этого, есть еще много тактик, которые могут помочь вам решить проблему доступности. Как только вы сделаете свой веб-сайт способным охватить всех, вы почувствуете заметный импульс роста вашего бизнеса.
6. Существуют юридические требования:
Различные области и даже страны приняли законы, касающиеся значка доступности, чтобы все люди могли пользоваться контентом/информацией с веб-сайтов. Например, сайты получат финансирование в США, если они добавят функцию на свой веб-сайт, чтобы побудить разработчиков к действию. Кроме того, сайты, предназначенные для образовательных целей, должны иметь значок доступности, чтобы каждый учащийся мог воспользоваться этой возможностью. Однако Закон об американцах-инвалидах не распространяется на коммерческие сайты; используются многочисленные дискриминационные законы, в том числе о равенстве по отношению к меньшинствам.
Эти причины могут помешать, если вы не получите значок веб-доступности. Следовательно, вы должны идти дальше.
7. Это касается не только слепых:
Значок веб-доступности предназначен не только для людей с ограниченными возможностями. Это просто дополнительная функция, которую может использовать и широкая публика. Это только улучшает ваш сайт и делает его доступным для различных пользователей по всему миру. Например, человек может понимать определенный язык, но не может его читать. Функции преобразования текста в речь могут помочь им воспользоваться информацией с вашего сайта. По сути, это поможет вам привлечь максимальную аудиторию. Простота — это то, что пользователю потребуется для развлекательных целей. Если ваш веб-сайт не обеспечивает осуществимости, у пользователя есть миллион других вариантов для изучения, и вы потеряете потенциального клиента. Помните, потеря будет на вашей стороне.
8. Значок веб-доступа привлекателен!
Если вы организатор или художник, вы должны знать, что дополнительные функции, дополнения или ретуши придают вашим вещам экстравагантный вид.
Говоря о веб-сайте, добавление некоторых дополнительных полезных функций чрезвычайно привлекательно. Привлекательный веб-сайт автоматически заставит пользователей оставаться на нем надолго и, возможно, заставит их вернуться к нему снова. Кто знает? Графика, изображения, видео, искусство слов, звуки, речь и т. д. будут яркими и дополнительным фактором для посещения вашего веб-сайта.
9. Думайте со стороны пользователя:
Вы можете иметь привилегии и хотите посетить определенный тип веб-сайта; однако предпочтения пользователя могут быть противоположными. Вы делаете контент для пользователя; почему бы не оправдать их ожидания? В идеале веб-сайт должен содержать все, что может понадобиться любому пользователю. Функции, контент, графика должны развлекать любого пользователя по всему миру. Следовательно, использование значка веб-доступности будет плюсом, чтобы пользователь остался доволен.
10. Для поисковой оптимизации:
Значок веб-доступности делает веб-сайты более доступными и удобными для пользователей.
Интересно, как? Включение значка веб-доступности автоматически обнаружит ваш веб-сайт, сделав его в рейтинге поисковой оптимизации. Положительный опыт работы с клиентами и удобство использования являются общей целью как значка веб-доступности, так и поисковой оптимизации. Усиление одной из этих функций автоматически повышает другую. Было подсчитано, что веб-сайты, которые использовали значки веб-доступности, привлекали на 30% больше трафика, чем веб-сайты, которые их не использовали. Теперь вы можете представить чудеса, не так ли? Тем не менее, есть определенные функции, которые необходимо учитывать для вашего SEO. Это включает в себя якорный текст, теги заголовков, текст заголовка, подписи к изображениям, атрибуты alt, расшифровку видео и т. д.
Вывод:
Рассмотрите добавление значка веб-доступности как процесс разработки веб-сайта, а не просто функцию, которую можно добавить позже. Это важная часть для пользователей и вашего сайта; придание ему важности равнозначно расстановке приоритетов целей вашего веб-сайта.