Skip to content

Accessibility: Use proper semantic HTML #81

@Lenni009

Description

@Lenni009

Issue

On the item pages, the name, subtitle and description are all heading tags.

Subtitle and Description are not headings.

Also these pages do not have an h1.

Suggestion

Use h1 for the item name.
Use a <p> or <div> tag with font-size: 1.6rem as subtitle.
Use a <p> tag with font-size: 1rem as description.
For multi-line descriptions, use <span> with display: block to emulate a <div>, while conforming to the HTML spec.
The tooltips on the keyboard bindings can probably also be done with <span>.
Elements like <div> and <p> are not permitted inside <p> itself.

See Content Categories on MDN

Here's an example of what I mean:
html_mockup

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions