--- id: 587d7788367417b2b2512aa2 title: Make Screen Reader Navigation Easier with the nav Landmark challengeType: 0 videoUrl: 'https://scrimba.com/c/czVwWSv' --- ## Description

The nav element is another HTML5 item with the embedded landmark feature for easy screen reader navigation. This tag is meant to wrap around the main navigation links in your page. If there are repeated site links at the bottom of the page, it isn't necessary to markup those with a nav tag as well. Using a footer (covered in the next challenge) is sufficient.

## Instructions

Camper Cat included navigation links at the top of his training page, but wrapped them in a div. Change the div to a nav tag to improve the accessibility on his page.

## Tests

```yml tests: - text: Your code should have one nav tag. testString: assert($('nav').length == 1); - text: Your nav tags should wrap around the ul and its list items. testString: assert($('nav').children('ul').length == 1); - text: Your code should not have any div tags. testString: assert($('div').length == 0); - text: Make sure your nav element has a closing tag. testString: assert(code.match(/<\/nav>/g) && code.match(/<\/nav>/g).length === code.match(/

## Challenge Seed

```html

Training with Camper Cat

Stealth & Agility
Combat
Weapons

Stealth & Agility Training

Climb foliage quickly using a minimum spanning tree approach

No training is NP-complete without parkour

Combat Training

Dispatch multiple enemies with multithreaded tactics

Goodbye world: 5 proven ways to knock out an opponent

Weapons Training

Swords: the best tool to literally divide and conquer

Breadth-first or depth-first in multi-weapon training?

```

## Solution