w3c seo wcag Flashcards
помогает делать элементы веб-страниц более доступными для пользователей с ограниченными возможностями
Aria что делает
помогает делать элементы веб-страниц более доступными для пользователей с ограниченными возможностями
помогает делать элементы веб-страниц более доступными для пользователей с ограниченными возможностями
Aria что делает
aria-label=”Открыть меню”
Используется для добавления описания к элементам, у которых нет собственного текста.
Пример: кнопка с иконкой без текста.
Используется для добавления описания к элементам, у которых нет собственного текста.
Пример: кнопка с иконкой без текста.
<button aria-label=”Открыть меню”
<i></i
</button</i>
Когда использовать aria label:
когда элемент не имеет видимого текста, но требует описания для экранных читалок.
Когда элемент не имеет видимого текста, но требует описания для экранных читалок.
Использовать aria label:
role=”button” аттрибут
Определяет назначение элемента. Это помогает экранным читалкам понять, как с элементом взаимодействовать.
Определяет назначение элемента. Это помогает экранным читалкам понять, как с элементом взаимодействовать.
role=”button” аттрибут
<meta></meta>
Краткое описание страницы, показывается в результатах поиска.
Краткое описание страницы, показывается в результатах поиска. HTML тег
<meta name=”description” content=”Описание страницы”
Сколько должно быть h1 h2 h3 на странице
Рекомендуется только один <h1>.
Можно использовать несколько <h2>. Заголовки <h2> служат для обозначения основных разделов или разделов второго уровня внутри страницы.
Можно использовать столько <h3>, <h4>, <h5>, и <h6>, сколько требуется для создания иерархии контента.
Рекомендуется только один <h1>.
Можно использовать несколько <h2>. Заголовки <h2> служат для обозначения основных разделов или разделов второго уровня внутри страницы.
Можно использовать столько <h3>, <h4>, <h5>, и <h6>, сколько требуется для создания иерархии контента.
Сколько должно быть h1 h2 h3 на странице
Описание примерное структуры тегов h1 h2 и тд
Описание структуры:
<h1> используется для заголовка всей страницы ("Современные технологии").
<h2> обозначает главные разделы, такие как "Информационные технологии", "Промышленные технологии" и "Заключение".
<h3> используется для разделов внутри <h2>, например, "Программное обеспечение", "Интернет-технологии".
<h4> выделяет подразделы внутри <h3>, такие как "Операционные системы" и "Веб-разработка".
<h5> используется для обозначения тем еще более узкого уровня, например, "Windows", "macOS" и "Сварочные роботы".
Описание структуры:
<h1> используется для заголовка всей страницы ("Современные технологии").
<h2> обозначает главные разделы, такие как "Информационные технологии", "Промышленные технологии" и "Заключение".
<h3> используется для разделов внутри <h2>, например, "Программное обеспечение", "Интернет-технологии".
<h4> выделяет подразделы внутри <h3>, такие как "Операционные системы" и "Веб-разработка".
<h5> используется для обозначения тем еще более узкого уровня, например, "Windows", "macOS" и "Сварочные роботы".
Это описание примерное структуры тегов h1 h2 и тд
<link rel=”canonical” href=”https://example.com/страница”
Предотвращает дублирование контента, указывая на основную версию страницы.
Предотвращает дублирование контента, указывая на основную версию страницы.
<link rel=”canonical” href=”https://example.com/страница”
<meta property=”og:title” content=”Заголовок страницы для соцсетей”
<meta property=”og:description” content=”Описание для соцсетей”
<meta property=”og:image” content=”https://example.com/image.jpg”
Open Graph теги для социальных сетей. Улучшают внешний вид ссылки, если ее делятся в соцсетях.
Open Graph теги для социальных сетей. Улучшают внешний вид ссылки, если ее делятся в соцсетях.
<meta property=”og:title” content=”Заголовок страницы для соцсетей”
<meta property=”og:description” content=”Описание для соцсетей”
<meta></meta>
Тег иконки странички
<link rel=”icon” href=”path/to/favicon.ico” type=”image/x-icon”
<link></link>
Тег иконки странички
Какой правильный вариант
1. <img></img>
2. <img></img>
2 вариант, по какому то там стандарту не стоит писать пикселы
<!-- Изменено: уникальные id для каждого элемента -->
<div>...</div>
<div>...</div>
id должны быть уникальными для каждого элемента
(Нету ответа просто чтобы повторил что id даже для элементов hidden у которые нужно ставить уникальный id)
Понял
Используется для верхней части страницы или секции, где располагаются логотип, название, навигация или другие элементы, характеризующие содержимое.
<header>
</header>
Указывает на навигационную область с основными ссылками по сайту, облегчая структуру сайта для поисковых систем.
<nav>
</nav>
Описание изображения
