# WAI-ARIA and Pagination

I would like to get some advice on WAI-ARIA markup I have added to my paginated post navigation.

Does this look correct, am I missing anything?

Also, curious on my "Page Count" and "View All" sections what if anything can be added to make it more ARIA-friendly.

<nav role="navigation" class="post-navigation">

<!-- Page Count -->
<span class="page-count">Page 2 of 4 </span>

<li aria-label="Previous">
<span aria-hidden="true">«</span>
</a>
</li>
<li>
</li>
<li class="active">
</li>
<li>
</li>
<li>
</li>
<li aria-label="Next">
<span aria-hidden="true">»</span>
</a>
</li>

<!-- View All link handing -->
<li aria-label="View All">
</li>

</ul>
</nav>


If you’re using HTML5 <nav> element, it’s not necessary to apply a role of ‘navigation’ – certain HTML elements inherently pass their relevant roles to the accessibility API. If you were wrapping the navigation menu in a <div>, for example, then you’d need to apply a role of ‘navigation’.
Role="menubar" has been correctly applied to the <ul> element, as has role="menuitem" to the <a> tags.
I would suggest applying a role="none" to each <li> element; otherwise this could confuse some users of assistive technologies since listitems and menuitems would be interspersed with each other.
Might be an idea to provide an aria-label to the <ul> with role="menubar"; used to help people understand the menu purpose and uniquely identify it from other menubars on the page.
Can also apply a tabindex="0" to first and last <a> elements – gives keyboard focus to link and makes a part of the tab order of the page. Alternatively, give a tabindex="-1" to make <a>s focusable but not part of the tab order of the page.