Focus Order Should Follow the Experience

Try It

• Normal keyboard navigation generally follows document and DOM order. A visual layout that says one thing while focus jumps around says another.
• `tabindex="0"` places an element in the normal sequential focus order according to its document position. `tabindex="-1"` removes it from normal Tab navigation but still allows programmatic focus. Positive values such as `tabindex="1"` or `tabindex="5"` create a custom order and should generally be avoided.