DEV Community

Discussion on: Improving Skip Navigation on DEV

 
s_aitchison profile image
Suzanne Aitchison

I will have a proper read but I dont see an aria-live region in the elements tab in dev tools to indicate the current page?

You're right! It's not related to @metamoni 's PR, but actually I missed this when implementing the skip links originally - we'll get this fixed 😄 But yes, that's the pattern we've been incrementally adopting, based on the research presented.

Thread Thread
 
grahamthedev profile image
GrahamTheDev • Edited

It is a really interesting pattern I haven't seen before so I look forward to seeing it in full form.

I think the aria-live region is the way they decided to address the problem I raised (I still haven't had chance to test, just my gut reaction from experience) in that if you manage focus it will interrupt reading the page title etc.

I hope the pattern works well as I do actually prefer the keyboard interaction this way (1 extra tab stop removed is always welcomed!) and once you have all had the headaches of implementing it I can learn from out of the way I might just be stealing it 😋🤣.

Thanks for the super quick responses @s_aitchison !

Sorry @metamoni didn't mean to hijack this as the work you have done is great!

Thread Thread
 
grahamthedev profile image
GrahamTheDev • Edited

I would imagine the fix for this would be super simple for a quick fix while a more flexible solution is created:

Add an aria-live region to all pages for site announcements. ID = "ariaLiveDiv";

// page load complete stuff before here

let announcerDiv = document.querySelector("#ariaLiveDiv");

announcerDiv.innerHTML = document.title;

//the focus step after page load
mySkipLink.focus();

Enter fullscreen mode Exit fullscreen mode

It would stop gap the issue while you set more meaningful text for each page (as the titles aren't always the best for things like comments etc but work great for the core part of the site such as articles, reading list, home etc.)

Thread Thread
 
metamoni profile image
Monica Mateiu

Wow, some interesting discussions here while I was at work. Thank you, @inhuofficial and @s_aitchison , I'm learning a lot from all of this 😄