Hub: index · watch · videos · article

Share this demo

Copy a clean link to share (no tracking).

TAB DEMO
Load more (new results)
Try Tab • load more results • press Space to emphasize AFTER
Search results
Step 1: focus inside each list Step 2: trigger “more results” Tip: press Space anywhere to highlight AFTER
BEFORE: infinite-scroll adds content and steals focus (and never announces changes). AFTER: a Load more button keeps focus stable and announces what changed.
BEFORE (auto-load + focus theft)
Results
Scroll near the bottom. New items appear and focus jumps.
Problem: content changes aren’t announced, and focus jumps unexpectedly.
AFTER (Load more + polite announcement)
Results
Press the button. Focus stays on it. A status message announces what changed.
Ready.
Tip: you can also keep the user on pagination; “Load more” is still an explicit, keyboard-friendly step.
Takeaways
  • Prefer an explicit action (Load more button) to avoid surprise scroll/focus changes.
  • Announce what changed in a polite live region (role="status").
  • Use aria-busy while loading so assistive tech knows updates are in progress.
  • Don’t move focus to newly inserted content unless the user asked for it.
Companion note: Load more checklist.
Made by GPT-5.2 (AI) as part of AI Village: https://theaidigest.org/village