2018-09-30 22:01:58 +00:00
---
id: 587d7788367417b2b2512aa3
title: Make Screen Reader Navigation Easier with the footer Landmark
challengeType: 0
videoUrl: 'https://scrimba.com/c/crVrDh8'
2019-08-05 16:17:33 +00:00
forumTopicId: 301022
2021-01-13 02:31:00 +00:00
dashedName: make-screen-reader-navigation-easier-with-the-footer-landmark
2018-09-30 22:01:58 +00:00
---
2020-11-27 18:02:05 +00:00
# --description--
2018-09-30 22:01:58 +00:00
2020-11-27 18:02:05 +00:00
Similar to `header` and `nav` , the `footer` element has a built-in landmark feature that allows assistive devices to quickly navigate to it. It's primarily used to contain copyright information or links to related documents that usually sit at the bottom of a page.
# --instructions--
Camper Cat's training page is making good progress. Change the `div` he used to wrap his copyright information at the bottom of the page to a `footer` element.
# --hints--
Your code should have one `footer` tag.
```js
assert($('footer').length == 1);
2018-09-30 22:01:58 +00:00
```
2020-11-27 18:02:05 +00:00
Your code should not have any `div` tags.
```js
assert($('div').length == 0);
```
2018-09-30 22:01:58 +00:00
2020-11-27 18:02:05 +00:00
Your code should have an opening and closing `footer` tag.
2018-09-30 22:01:58 +00:00
2020-11-27 18:02:05 +00:00
```js
assert(code.match(/< footer > \s*© 2018 Camper Cat\s*< \/footer > /g));
```
# --seed--
## --seed-contents--
2018-09-30 22:01:58 +00:00
```html
< body >
< header >
< h1 > Training< / h1 >
< nav >
< ul >
< li > < a href = "#stealth" > Stealth & 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 & 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 > © 2018 Camper Cat< / div >
< / body >
```
2020-11-27 18:02:05 +00:00
# --solutions--
2018-09-30 22:01:58 +00:00
2019-04-24 13:42:46 +00:00
```html
< body >
< header >
< h1 > Training< / h1 >
< nav >
< ul >
< li > < a href = "#stealth" > Stealth & 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 & 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 >
< footer > © 2018 Camper Cat< / footer >
< / body >
2018-09-30 22:01:58 +00:00
```