DOM reordering (dynamic-DOM)
When page sections are reordered dynamically via JavaScript, ensure that the focus order is recalculated so users can navigate the updated content logically.
Visual-only reorder without DOM update:
The sections below are visually reordered using CSS (order), but the DOM order
remains 1 → 2 → 3. Keyboard focus still follows the DOM (1 → 2 → 3), which does not match
the visual reading order (2 → 3 → 1), creating an illogical focus sequence.
Section 1 (DOM position 1)
This section is shown last visually via CSS order.
Section 2 (DOM position 2)
This section is shown first visually via CSS order.
Section 3 (DOM position 3)
This section is shown second visually via CSS order.