HTMLKhi route thay đổi trong SPA, focus phải chuyển đến nội dung mới (thường là <h1> hoặc <main>). Không có page reload tự nhiên nên screen readers không nhận biết nội dung đã đổi.
Các approach: React Router/Next.js dùng useEffect + ref.focus() trên heading sau khi navigation; Next.js App Router tự quản lý một phần nhưng nên kiểm tra lại. Lỗi phổ biến: focus container div thay vì heading bên trong — screen reader cần heading để announce trang mới. Kết hợp aria-live region để announce page title change.
When a route changes in a SPA, focus must move to the new content (typically the <h1> or <main> area). There's no natural page reload, so screen readers don't know the content has changed.
Approaches: React Router/Next.js use useEffect + ref.focus() on a heading after navigation; Next.js App Router handles some of this automatically but should be verified. Common bug: focusing the container div instead of a heading inside it — screen readers need a heading to announce the new page. Combine with an aria-live region to announce page title changes.