Usage
Slider
<div class="slider">
<ul role="region" aria-label="Gallery" tabindex="0">
<li id="1"><figure><img src="slide-1.jpeg" alt="Slide 1"><figcaption>Caption</figcaption></figure></li>
<li id="2"><figure><img src="slide-2.jpeg" alt="Slide 2"><figcaption>Caption</figcaption></figure></li>
<li id="3"><figure><img src="slide-3.jpeg" alt="Slide 3"><figcaption>Caption</figcaption></figure></li>
<li id="4"><figure><img src="slide-4.jpeg" alt="Slide 4"><figcaption>Caption</figcaption></figure></li>
</ul>
</div>Navigation
<nav>
<a href="#1">1</a>
<a href="#2">2</a>
<a href="#3">3</a>
</nav>