w3c seo wcag Flashcards

помогает делать элементы веб-страниц более доступными для пользователей с ограниченными возможностями

1
Q

Aria что делает

A

помогает делать элементы веб-страниц более доступными для пользователей с ограниченными возможностями

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

помогает делать элементы веб-страниц более доступными для пользователей с ограниченными возможностями

A

Aria что делает

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

aria-label=”Открыть меню”

A

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

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

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

A

<button aria-label=”Открыть меню”
<i></i
</button</i>

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

Когда использовать aria label:

A

когда элемент не имеет видимого текста, но требует описания для экранных читалок.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

Когда элемент не имеет видимого текста, но требует описания для экранных читалок.

A

Использовать aria label:

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

role=”button” аттрибут

A

Определяет назначение элемента. Это помогает экранным читалкам понять, как с элементом взаимодействовать.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

Определяет назначение элемента. Это помогает экранным читалкам понять, как с элементом взаимодействовать.

A

role=”button” аттрибут

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

<meta></meta>

A

Краткое описание страницы, показывается в результатах поиска.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

Краткое описание страницы, показывается в результатах поиска. HTML тег

A

<meta name=”description” content=”Описание страницы”

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

Сколько должно быть h1 h2 h3 на странице

A

Рекомендуется только один <h1>.

Можно использовать несколько <h2>. Заголовки <h2> служат для обозначения основных разделов или разделов второго уровня внутри страницы.

Можно использовать столько <h3>, <h4>, <h5>, и <h6>, сколько требуется для создания иерархии контента.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

Рекомендуется только один <h1>.

Можно использовать несколько <h2>. Заголовки <h2> служат для обозначения основных разделов или разделов второго уровня внутри страницы.

Можно использовать столько <h3>, <h4>, <h5>, и <h6>, сколько требуется для создания иерархии контента.

A

Сколько должно быть h1 h2 h3 на странице

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

Описание примерное структуры тегов h1 h2 и тд

A

Описание структуры:

<h1> используется для заголовка всей страницы ("Современные технологии").
<h2> обозначает главные разделы, такие как "Информационные технологии", "Промышленные технологии" и "Заключение".
<h3> используется для разделов внутри <h2>, например, "Программное обеспечение", "Интернет-технологии".
<h4> выделяет подразделы внутри <h3>, такие как "Операционные системы" и "Веб-разработка".
<h5> используется для обозначения тем еще более узкого уровня, например, "Windows", "macOS" и "Сварочные роботы".
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

Описание структуры:

<h1> используется для заголовка всей страницы ("Современные технологии").
<h2> обозначает главные разделы, такие как "Информационные технологии", "Промышленные технологии" и "Заключение".
<h3> используется для разделов внутри <h2>, например, "Программное обеспечение", "Интернет-технологии".
<h4> выделяет подразделы внутри <h3>, такие как "Операционные системы" и "Веб-разработка".
<h5> используется для обозначения тем еще более узкого уровня, например, "Windows", "macOS" и "Сварочные роботы".
A

Это описание примерное структуры тегов h1 h2 и тд

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

<link rel=”canonical” href=”https://example.com/страница”

A

Предотвращает дублирование контента, указывая на основную версию страницы.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

Предотвращает дублирование контента, указывая на основную версию страницы.

A

<link rel=”canonical” href=”https://example.com/страница”

17
Q

<meta property=”og:title” content=”Заголовок страницы для соцсетей”
<meta property=”og:description” content=”Описание для соцсетей”
<meta property=”og:image” content=”https://example.com/image.jpg”

A

Open Graph теги для социальных сетей. Улучшают внешний вид ссылки, если ее делятся в соцсетях.

18
Q

Open Graph теги для социальных сетей. Улучшают внешний вид ссылки, если ее делятся в соцсетях.

A

<meta property=”og:title” content=”Заголовок страницы для соцсетей”
<meta property=”og:description” content=”Описание для соцсетей”

<meta></meta>

19
Q

Тег иконки странички

A

<link rel=”icon” href=”path/to/favicon.ico” type=”image/x-icon”

20
Q

<link></link>

A

Тег иконки странички

21
Q

Какой правильный вариант
1. <img></img>
2. <img></img>

A

2 вариант, по какому то там стандарту не стоит писать пикселы

22
Q

<!-- Изменено: уникальные id для каждого элемента -->

<div>...</div>

<div>...</div>

id должны быть уникальными для каждого элемента

(Нету ответа просто чтобы повторил что id даже для элементов hidden у которые нужно ставить уникальный id)

A

Понял

23
Q

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

A

<header>
</header>

24
Q

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

A

<nav>
</nav>

25
Q

Указывает на основное содержимое страницы, исключая повторяющиеся элементы, такие как заголовки, меню, боковые панели и нижние колонтитулы.

A

<main>
</main>

26
Q

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

A

<article>
</article>

27
Q

Логически выделяет определенные части страницы, которые относятся к одной теме. Часто используется для структурирования внутри <main>.

A

<section>
</section>

28
Q

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

A

<aside>
<aside>
<h3>Рекомендованные статьи</h3>
<ul>
<li><a>Статья 1</a></li>
</ul>
</aside>
</aside>

29
Q

<figure> и <figcaption>
</figcaption></figure>

A

Тег <figure> используется для изображений, графиков и других иллюстраций, а <figcaption> добавляет подпись к ним.
Пример:</figure>

html

<figure>
<img src="example.jpg" alt="Описание изображения"
<figcaption>Описание изображения</figcaption>
</figure>

30
Q

Тег ?? используется для изображений, графиков и других иллюстраций, а ????????? добавляет подпись к ним.

A

<figure> и <figcaption>
</figcaption></figure>

31
Q
A