Server: Headings semantics

[pixelipo]

@nextcloud/designers I've noticed some issues with semantics that might be worth fixing - notably, headings. This might have to be separated into several issues/PRs:

• [ ] <h1> is used twice (it shouldn't be): once in the NC logo <h1 class="hidden-visually">Nextcloud</h1> and once in the header-appname-container menutoggle (app name). Possible solutions are changing the tag of the first one or removing the whole link from the Nextcloud logo (it's a weird link anyway, since it targets default app (Files), not Nextcloud itself)
• [ ] because of the :arrow_up: , <h1> should never be used in apps - e.g. @nextcloud/news and @nextcloud/deck are breaking this "rule"
• [ ] we have a default (core) style rules for <h2> and <h3>, but <h4> might be useful as well
• [ ] <h3> should be used in right sidebar (I guess?) - in which case, we should come up with a good default rule for #app-sidebar h3; on a related note, should it actually be an input field, like in @nextcloud/calendar ?
• [ ] default style for subtitle might be useful. @nextcloud/news has .subtitle which might be a good starting point (missing a more distinction for links IMO), @nextcloud/mail might apply something similar instead of the .transparency
• [ ] the above mentioned apps could use <header> tag to group title and subtitle

Also possibly related to @nextcloud/theming

P.S. Sorry for bringing out such low-level issues :disappointed:

[skjnldsv]

Never apologize for reporting a bug! 😉😙

[jancborchardt]

I thought I replied to this. :D Great points and agree with all of them. :)

Only thing: The first issue doesn’t exist anymore now that we moved away from the app dropdown to listing the apps directly in the header.

[pixelipo]

@jancborchardt first issue still exists, even though it's not visible (but it might show up on screen readers) - see this:

https://github.com/nextcloud/server/blob/master/core/templates/layout.user.php#L45

I'm guessing that is deprecated code?

[jancborchardt]

Yeah, as far as I can see it's not used. @juliushaertl?

[juliushaertl]

@pixelipo Yes we should get rid of that. But we should also add the app name to other h1 element, so it is still there for screenreaders.