URL: /category/{id}
Criterion: 2.4.3 Focus order (A)
Content is visually laid out in a specific order to convey a sense of priority. The focus order should match the order in which the content is laid out.
Although CSS allows the order of the elements in the markup to be modified in the presentation, it is generally not recommended. It causes the screen readers to read the content in the wrong order and messes up tab navigation for keyboard users.
On category pages, when the materials section is displayed, it is rendered before the main content in markup order, but laid out in reverse order using CSS. This cases focus order to prefer the materials section over the main content, which is contrary to the expected order based on the presentation.
I will address this by updating the markup to have the correct semantic order (as intended by the presentation), and also update the CSS used for the layout so that the intended presentation is achieved using flexboxes. This should also have the effect of making the category and event lists responsive.