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? 

Should anything be added/removed to the current page link (#2)?

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

&lt;nav role="navigation" class="post-navigation"&gt;

     &lt;ul role="menubar" class="pagination"&gt;

        &lt;!-- Page Count --&gt;
        &lt;span class="page-count"&gt;Page 2 of 4 &lt;/span&gt;

        &lt;li aria-label="Previous"&gt;
            &lt;a role="menuitem" aria-posinset="1" data-pagenum="1" href="#"&gt;
                &lt;span aria-hidden="true"&gt;«&lt;/span&gt;
            &lt;/a&gt;
        &lt;/li&gt;
        &lt;li&gt;
            &lt;a role="menuitem" aria-posinset="1" data-pagenum="1" href=""&gt;1&lt;/a&gt;
        &lt;/li&gt;
        &lt;li class="active"&gt;
            &lt;span role="menuitem" aria-posinset="2"&gt;2&lt;/span&gt;
        &lt;/li&gt;
        &lt;li&gt;
            &lt;a role="menuitem" aria-posinset="3" data-pagenum="3" href="#"&gt;3&lt;/a&gt;
        &lt;/li&gt;
        &lt;li&gt;
            &lt;a role="menuitem" aria-posinset="4" data-pagenum="4" href="#"&gt;4&lt;/a&gt;
        &lt;/li&gt;
        &lt;li aria-label="Next"&gt;
            &lt;a role="menuitem" aria-posinset="3" data-pagenum="3" href="#"&gt;
                &lt;span aria-hidden="true"&gt;»&lt;/span&gt;
            &lt;/a&gt;
        &lt;/li&gt;

        &lt;!-- View All link handing --&gt;
        &lt;li aria-label="View All"&gt;
            &lt;a role="menuitem" href="#?viewall"&gt;View All&lt;/a&gt;
        &lt;/li&gt;

    &lt;/ul&gt; 
&lt;/nav&gt;
If you’re using HTML5 &lt;nav&gt; 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 &lt;div&gt;, for example, then you’d need to apply a role of ‘navigation’.

Role="menubar" has been correctly applied to the &lt;ul&gt; element, as has role="menuitem" to the &lt;a&gt; tags. 

I would suggest applying a role="none" to each &lt;li&gt; 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 &lt;ul&gt; 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 &lt;a&gt; elements – gives keyboard focus to link and makes a part of the tab order of the page. Alternatively, give a tabindex="-1" to make &lt;a&gt;s focusable but not part of the tab order of the page.