Restructure heading levels to be sequential

[JEThompson97]

Part of #68

Skipped heading level

What it is: A heading level is skipped. Why it matters: Headings provide document structure and facilitate keyboard navigation by users of assistive technology. These users may be confused or experience difficulty navigating when heading levels are skipped.

Many of the app's pages contain skipped heading levels.

Note: the below are not up-to-date/exhaustive lists. But they give an idea of the issue.

User role

Page Title	URL	Heading Levels	Modal?
Dashboard	/	h1 > p ("HOMEPAGE") > h6 ("My proposals")
New Proposal	/ProposalCreate	h1 > h4 ("New Proposal")
Shipments	/MyShipments	h1 > h4 ("Shipments")	('Create' button doesn't load)
Dashboard	/HelpPage	h1 > p ("HELPPAGE")
Select a call	/ProposalSelectType	h1 > h6 ("Select a call") > for each call { h6 (Call name) }

User Officer role

Page Title	URL	Heading Levels	Modals?
Proposals	/ProposalPage	h1 > h6 ("Proposals")
Calls	/CallPage	h1 > h6 ("Calls")	CREATE > h6 ("Create new call")
Users	/PeoplePage	h1 > h6 ("Users")
Invite User	/PeoplePage	h1 > h1 ("Invite User")
Invite Reviewer	/PeoplePage	h1 > h1 ("Invite Reviewer")
Instruments	/InstrumentPage	h1 > h6 ("Instruments")	CREATE > h6 ("Create new instrument")
Scientific evaluation panels	/SEPPage	h1 > h6 ("Scientific evaluation panels")
Set x homepage	/PageEditor	h1 > h6 ("Set x homepage")
Institutions	/InstitutionPage	h1 > h6 ("Institutions")	CREATE > h6 ("Create new institution")
Templates	/ProposalTemplates	h1 > h6 ("Templates")	CREATE > h6 ("Create new template")
Templates	/SampleDeclarationTemplates	h1 > h6 ("Templates")	CREATE > h6 ("Create new template")
Templates	/ShipmentDeclarationTemplates	h1 > h6 ("Templates")	CREATE > h6 ("Create new template")
Questions	/Questions	h1 > h6 ("Questions")
Samples	/SampleSafety	h1 > h6 ("Samples")
Units	/Units	h1 > h6 ("Units")	CREATE > h6 ("Create new unit")
Proposal statuses	/ProposalStatuses	h1 > h6 ("Proposal statuses")	CREATE > h6 ("Create new proposal status")
Proposal workflows	/ProposalWorkflows	h1 > h6 ("Proposal workflows")	CREATE > h6 ("Create new proposal workflow")
API Access Tokens	/ApiAccessTokens	h1 > h6 ("API Access Tokens")	CREATE > h6 ("Create new api access token")
(Template name)	/QuestionaryEditor	h1	Add (data type) button > h4 (data type) > h6 ("Constraints")

Summary of above

Most (up to API Access Token in table above) heading levels for User Officer pages seem to fall into the following categories:

1. h1 > h6
2. h1 > h6 -CREATE button-> h6
3. h1 > h1

Other

The Privacy Page and Help Page are currently modals. The 'title' for these is are <p> element (which appear to be placeholders). When these are created properly, they should use a sequential heading element

Note: I think some of the modals use the same 'components' but require different heading levels between them

---

These heading levels should be restructured such that in all cases they cascade as h1 > h2 > h3 > etc.

/overwrite opened 2020-09-04

[JEThompson97]

This issue has been held up by some cases which need further thought.

Panda and I discussed these cases on 26/05/21 and decided the following next steps:

• Document all these 'tricky' cases
• Make a PR which fixes the 'non-tricky' heading levels and improve the trickier heading levels as much as possible for now.

[JEThompson97]

It should also be noted that while heading level structure is important, the impact this has is how clear and easy to navigate the information is, rather than whether the information can be accessed or not.

While we should aim for our heading levels are as well structured as possible, there may be some instances where a complete, solution may not be feasible due to the nature of how the code is structured.

This approach is supported by the official guidance, as it describes heading levels as a 'where possible' rather than 'absolutely necessary' criteria:

Skipping heading ranks can be confusing and should be avoided where possible Source: w3.org

[JEThompson97]

I have a local branch to fix all the 'non-tricky' heading levels, and improve the trickier ones (mentioned above).

I'm holding off on pushing this as a PR until I get back from leave so I have time to merge with develop, resolve issues, and respond to PR reviews.