General HTML best practices What is a screen reader? What is Semantic HTML? HTML semantic tags for text HTML semantic tags for structure What HTML tags are non-semantic? Accessibility guidelines Insert an element into the tab order Correctly set the visibility of offscreen content Keyboard access fundamentals Focus and the tab order Arrange elements in the DOM to be in logical order Use semantic HTML for easy keyboard wins Maximizing User Experience with Buttons Why links matter for keyboard navigation Control focus with tabindex Remove an element from the tab order Avoid tabindex > 0 How to make buttons accessible with meaningful names Write accessible link texts Add alternative text to images Ensure form elements have associated labels How to add labels to form elements Understand the difference between block and inline elements Reducing markup SCSS 7-1 pattern Variables, Mixins & Extend CSS Architecture BEM Naming Convention Why should we consider BEM? SCSS and BEM CSS best practices When is it ok to disable text selection? Viewport best practices Character encoding best practices VSCode Recommended Extensions - TailwindCSS