Public

You can catch the majority of issues by performing testing using the screen readers that your users rely on the most.

Here's an overview of the landmark elements in HTML, their ARIA role and what they mean:aside (role: complementary) can be used to show content that is complementary to the main subject of the page. For example, links to related documents or meta info related to the main subject.footer (role: contentinfo) is where you put all the information about a page. Typically that's things like copyright info, related links, the authorform (role: form) can be a landmark element if it has a accessible name (set with aria-label, aria-labelledby or title attributes)header (role: banner) is where your page's "introduction" goes. Things like your logo, search and main navigation all go in here.main (role: main) contains the main content or functionality of your page.nav (role: navigation) is where you provide navigational links. They can be for your entire website (think your main menu), but also for your current page (think table of contents).section (role: region) This is a "generic standalone section of a page". Essentially, if you have a part of the page that stands alone, try to go down this list and if none of them fit but it's still a separate part of the page, use a section. Like forms, it'll only be a landmark if it also has an accessible name.There is still one more landmark that we need to discuss: the search landmark. All the landmarks above are HTML elements with a specific landmark role, but the search landmark role has no associated HTML element. It only exists in ARIA. As you might guess, the search landmark is used to indicate search functionality and practically, you'd add a search role to a form element to change it from a generic form to a search form.

I believe the solution is staring us directly in the eyes. CSS is a declarative language that enhances HTML. CSS is agnostic of how the HTML is produced. Despite this CSS is extremely ergonomic and powerful. The path is there for web components to be used in a responsible and progressive manner. We just need people with the drive and desire to find a better way than the hole we've dug ourselves in. I'm building my version of this vision with Corset. I look forward to seeing what other solutions arise. Corset

And then a few months later, the people actually running those instances are going to start flexing their muscle, and the users' response will be, "Wait, who even are you? This sucks. I just wanted my memes".

Naming ConventionsDefinitive naming (Avoid!!!)Semantic naming (Describe color intent)Contextual naming (Describe color use)Combining Semantic+ContextualSemantic for DesignersContextual for EngineersColor weightsSemantic+weighted (tints/shades with numbers)Meaningful/useful weights (Use of L* values)Incidental vs. Essential weights (WCAG compliance)

Designing for people who struggle with numbers We need to deliver services which convey numbers plainly and in a way that is easy for everyone to understand.