- Accessibility and responsiveness must always be at the forefront.
- An element's purpose must always be clear.
- Minimize markup, and optimize for portability.
- Cohesion, but not shtick.
- Only links get underlines, especially if blue is in the design system.
- Focus states should be prominent, especially since this is an accessibility blog.
- Color should never be the sole indicator of information.
- Distinguish between
<b>
/<i>
and<strong>
/<em>
. - Adhere, as best as possible, to CUBE CSS.
- Typography should be used intentionally. Every change in typography should tell a story.
- Brand font: Should absolutely be used for headings. Can be used sparingly as accents.
- Body font: Normal text. Optimize for legibility, pair with brand font.
- Monospace font: Can appear inline or in a code block. Should contrast from body font, but pair with it.
- Animations, if any, must be sparse and subtle.
- Images must have an option to be big, to account for diagrams and anything that requires fine detail.