Add skip navigation / skip to content links for accessibility

[jancborchardt]

Add "skip navigation" links according to https://webaim.org/techniques/skipnav/

First tab gets you directly to the main #app-content (skipping both header and left sidebar):

Second tab gets you to #app-navigation (left sidebar of the app):

After that it continues in the header through the apps as usual.

Please review @nextcloud/accessibility @nextcloud/designers :)

[skjnldsv]

Ooh, very clever!!! 👍

[skjnldsv]

We should create an entry related to the accessibility in the docs!

[codecov]

Codecov Report

Merging #10004 into master will increase coverage by <.01%.
The diff coverage is 0%.

@@             Coverage Diff              @@
##             master   #10004      +/-   ##
============================================
+ Coverage      31.7%    31.7%   +<.01%     
+ Complexity    26017    26014       -3     
============================================
  Files          1661     1660       -1     
  Lines         96171    96153      -18     
  Branches       1290     1290              
============================================
  Hits          30490    30490              
+ Misses        65681    65663      -18

Impacted Files	Coverage Δ	Complexity Δ
core/templates/layout.user.php	0% <0%> (ø)	0 <0> (ø)	⬇️
apps/files_external/lib/Lib/Auth/AuthMechanism.php	100% <0%> (ø)	5% <0%> (ø)	⬇️
apps/files_external/lib/Lib/Backend/SMB.php	0% <0%> (ø)	3% <0%> (-1%)	⬇️
apps/files_external/lib/AppInfo/Application.php	0% <0%> (ø)	4% <0%> (ø)	⬇️
...s/files_external/lib/Lib/Auth/SMB/KerberosAuth.php
apps/files_external/lib/Lib/Storage/SMB.php	1.06% <0%> (+0.01%)	119% <0%> (-1%)	⬇️

[jancborchardt]

@skjnldsv yeah, a section in the design docs where we recommend testing with WAVE, by keyboard, Lighthouse, or Firefox accessibility inspector :)

[MorrisJobke]

What is this?

[MorrisJobke]

It seems that those fonts are not needed for this PR, right?

[jancborchardt]

@MorrisJobke sorry – miscommitted, will fix.

[jancborchardt]

@MorrisJobke fixed :)

[MarcoZehe]

Accessibility bits approved, rest is yours to clean up. :)

[kevgathuku]

Good idea!

[tyrylu]

It is probably too late to comment it there, but should not the texts be put through the translation machinery? The wording is the one i saw everywhere else, however, translating them could be a good idea.

[skjnldsv]

That is an excellent point!
@jancborchardt

[jancborchardt]

@tyrylu oops, good catch! Will fix tomorrow :) or if you want to open a pull request for it, you are very welcome! :)

[jancborchardt]

Follow-up PR for translation at #10019 :)