freeCodeCamp/curriculum/challenges/russian/01-responsive-web-design/applied-accessibility/make-screen-reader-navigati...

87 lines
3.2 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

---
id: 587d7788367417b2b2512aa3
title: Make Screen Reader Navigation Easier with the footer Landmark
challengeType: 0
videoUrl: ''
localeTitle: Улучшение навигации в Screen Reader с помощью нижнего колонтитула Landmark
---
## Description
<section id="description"> Подобно <code>header</code> и <code>nav</code>, элемент <code>footer</code> имеет встроенную функцию ориентира, которая позволяет вспомогательным устройствам быстро перейти к ней. Он в основном используется для хранения информации об авторских правах или ссылок на связанные документы, которые обычно располагаются внизу страницы. </section>
## Instructions
<section id="instructions"> Учебная страница Camper Cat продвигается вперед. Измените <code>div</code>, который он использовал, чтобы связать свою информацию об авторских правах в нижней части страницы с элементом нижнего <code>footer</code>. </section>
## Tests
<section id='tests'>
```yml
tests:
- text: В вашем коде должен быть один <code>footer</code> тег.
testString: 'assert($("footer").length == 1, "Your code should have one <code>footer</code> tag.");'
- text: У вашего кода не должно быть никаких тегов <code>div</code>.
testString: 'assert($("div").length == 0, "Your code should not have any <code>div</code> tags.");'
- text: Ваш код должен иметь тег открытия и закрытия <code>footer</code> .
testString: 'assert(code.match(/<footer>\s*&copy; 2018 Camper Cat\s*<\/footer>/g), "Your code should have an opening and closing <code>footer</code> tag.");'
```
</section>
## Challenge Seed
<section id='challengeSeed'>
<div id='html-seed'>
```html
<body>
<header>
<h1>Training</h1>
<nav>
<ul>
<li><a href="#stealth">Stealth &amp; Agility</a></li>
<li><a href="#combat">Combat</a></li>
<li><a href="#weapons">Weapons</a></li>
</ul>
</nav>
</header>
<main>
<section id="stealth">
<h2>Stealth &amp; Agility Training</h2>
<article><h3>Climb foliage quickly using a minimum spanning tree approach</h3></article>
<article><h3>No training is NP-complete without parkour</h3></article>
</section>
<section id="combat">
<h2>Combat Training</h2>
<article><h3>Dispatch multiple enemies with multithreaded tactics</h3></article>
<article><h3>Goodbye world: 5 proven ways to knock out an opponent</h3></article>
</section>
<section id="weapons">
<h2>Weapons Training</h2>
<article><h3>Swords: the best tool to literally divide and conquer</h3></article>
<article><h3>Breadth-first or depth-first in multi-weapon training?</h3></article>
</section>
</main>
<div>&copy; 2018 Camper Cat</div>
</body>
```
</div>
</section>
## Solution
<section id='solution'>
```js
// solution required
```
</section>