Lighthouse Report: Improve Performance, accessibility and best practices
ychoy opened this issue · 0 comments
ychoy commented
Performance
- Eliminate render-blocking resources
- Preconnect to required origins
- Properly size images
- Serve images in next-gen formats
- Ensure text remains visible during webfont load
- Serve static assets with an efficient cache policy
- Minimize main-thread work
- Avoid chaining critical requests
- Keep request counts low and transfer sizes small
Best Practices
- Links to cross-origin destinations are unsafe
- Browser errors were logged to the console
- Add favicon
Accessibility
- Background and foreground colors do not have a sufficient contrast ratio.
- or <iframe> elements do not have a title
Manually check these for a11y:
- The page has a logical tab order
- Interactive controls are keyboard focusable
- Interactive elements indicate their true purpose and state
- The user's focus is directed to new content added to the page
- User focus is not accidentally trapped in a region
- Custom controls have associated labels
- Custom controls have ARIA roles
- Visual order on the page follows DOM order
- Offscreen content is hidden from assistive technology
- Headings don't skip levels
- HTML5 landmark elements are used to improve navigation