<div class="ys-tabs" role="tablist" aria-label="Provide a label that describes ALL of the tabs">
    <button class="ys-tabs__tab" role="tab" aria-selected="true" aria-controls="tabTarget01" id="tab01">Tab One</button>
    <button class="ys-tabs__tab" role="tab" aria-selected="false" aria-controls="tabTarget02" id="tab02" tabindex="-1">Second Tab</button>
    <button class="ys-tabs__tab" role="tab" aria-selected="false" aria-controls="tabTarget03" id="tab03" tabindex="-1">The Third Tab</button>

HTML Guidelines

These tabs must always be implemented in an accessible manner — please refer to for HTML Structure and JavaScript functionality.

UX and Design Guidelines