A bit more keyboard love

[StommePoes]

As a user, I would like to be able to, from the first page load on Desktop, be able to skip to the sidebar and back (skip links). I would also like to be able to see the funny arrow-thing at the bottom left of the page, but when I'm tabbing I'm almost always on a link and the URL the browser displays is just larger than the arrow (so if the arrow were either a bit bigger or moved up a bit from the bottom, it could be seen). I also have to discover what these arrows do as they're kinda mystery-meat-- unless the title that is supplied to mouse users could be added on focus?
arrow-thingie:focus:after { display: whatever; content: attr(title); //and some styles to put it in a useful place}

And as someone using either IE or any of the Blink browsers, I would like clicking a link in the sidebar to bring not only my visual focus but also my keyboard focus to the destination. Due to long-standing bugs that seem unlikely to be addressed soon, could the devs consider adding tabindex="-1" to the link destinations, which allows focus to go to the right place in these browsers? I've unfortunately been using this hack for years myself, but it doesn't seem I'll be removing them anytime soon, and offers functionality to users who maybe cannot choose to switch UAs while viewing these pages.

[ZoeBijl]

+1 to tabindex=-1

I didn't even notice the arrow before just now.

[StommePoes]

I only noticed it after Matt May metioned it, I did see the top arrow after the heading which also does something with that functionality (and I had a guess what it did, but I was wrong-- I thought it would skip me over to the main area, but it collapses the sidebar).

[fantasai]

Is the focus-shifting also a problem on the current TR pages like https://www.w3.org/TR/css-flexbox-1/#contents or is this a problem specific to the redesign?

[ZoeBijl]

There are no skip links in the current TR's (as far as I know anyway); this is specific to the new design.

Ignore me, listen to the stupid cat.

[StommePoes]

No no, if I click something from the TOC it's the same issue. It's a huge issue on most sites, because most sites are writing correct code and Blink just has this nasty bug. I can't recall what cause's IE's bug and it's not the same cause, however the negative tab-index fixes both engines for different reasons.

Blink bug https://code.google.com/p/chromium/issues/detail?id=262171

Pat added this to the bootstrap project for the same reason twbs/bootstrap#15714

So I'm arguing this as an improvement to go along with the work already done for a redesign. Like when you refactor code you come across, you sometimes add a little extra to take care of an annoyance. This annoyance means me constantly opening op Firefox (my only working option here on Linux) to view sites with long TOCs while I do my dev work in chromium.

[fantasai]

This is stupid. Let's just get somebody to fix the bug. I'll go harass some Google and Microsoft devs about it tomorrow.

@yatil filed skip links as #40 and button improvements as #42, so let's discuss those there.

[StommePoes]

zomg I love you, this would magically fix like a bazillion sites. This is an ancient bug btw-- came originally from KHTML, inherited by Webkit, inherited by Blink. It's also one of the reasons I still use old Presto Opera-- doesn't have it.

[ZoeBijl]

👍

[fantasai]

I've updated the style sheet to address these comments (other than the WebKit bug): http://fantasai.inkedblade.net/style/design/w3c-restyle/2016/sample
Please play with it and file further issues as necessary.

...Note, however, there's one issue I can't easily fix: the blank link text of the unfocused link when the other one is focused by keyboard. Maybe I'll come up with a solution tomorrow. Or maybe it'll just look a bit awkward for now. :/

[ZoeBijl]

There is one issue in both Firefox and Chrome:

Could be solved by placing them in the right hand corner, or a bit higher :)

[StommePoes]

Zomg @fantasai what did you threaten the Googles with??? https://bugs.chromium.org/p/chromium/issues/detail?id=262171 (dupe of old bug) :P :D

Can you do this over at MS now? I'm dancing.

[yatil]

@StommePoes Wait, what?! After all those years! \o/ :dancer: :dancers: :dancer:

[StommePoes]

@yatil it might be because of Rodney Rehm bugging them with a new bug copy, or secretly in a dark alley @fantasai sent men with clubs looking for knees.... shrug

[ZoeBijl]

Maybe she sent @tabatkins after some devs at Google.

[fantasai]

I sent @cbiesinger, who knew how to find the right person. :)