HTML checks - Checking tables and bullet lists are styled properly

[Angelsaur]

Summary

Check that any tables and bullet lists have been styled properly. If they are not styled properly, screen reader software will not recognise what they are and will not convey the information in a way that makes sense to users.

Deadline

20/02/2021

What needs to be done?

View HTML page
The way you view your page’s HTML depends on which browser you’re using. If you’re using:

Google Chrome, right-click the page element you want to check and select ‘inspect’
Safari, right-click the page element you want to check and select ‘inspect element’ - you might need to enable Safari developer tools first
Edge, press ‘F12’, then hold ‘Ctrl’ and ‘B’ - once you’ve done that, left-click the page element you want to check
Firefox, right-click the element you want to check and select ‘inspect element’ - you might need to enable Firefox web developer first
This should open up a panel somewhere on your screen showing the HTML for the page.

Check a few tables and bullet lists from your sample pages. Once you’ve opened up the source code, look out for the following sorts of tags:

for tables, look out for td, th and tr in <>
for bullet lists, look out for ul and li in <>
If you can see these tags, it’s likely the elements have been styled properly.

Who can help?

[GeorgiaHCA]

The bullet lists do indeed have ul and li in the code - so this criterium is met/

For the tables, I've used a 'grid container" component which I took from gov.uk but it doesn't seem to have the tables requirement listed. I think it needs re-styling and reformatting and my guess is that it's because of compyning two different styles systems provided by Marvel and Gov.uk.

Perhaps you would be the best person to help with this @MaxwellRiess?

[gedankenstuecke]

Made issue #369 to create an accessibility checklist that can be used for the MVP and going forward. Closing this along with other accessibility checklist items for now.