Skip to content
Danny de Vries edited this page Jan 2, 2020 · 17 revisions

Audits

Audits aren't everything, they only highlight opportunities. It just means you’ve laid the groundwork for manual testing. These audits aren’t everything, it provides a good baseline but the best way still is to test with actual users.

Speed

Audit Description
Webpagetest Speed test from multiple locations around the globe using real browsers
PageSpeed Insights Analyzes the content of a web page, then generates suggestions to make that page faster
Lighthouse Automated tool for improving the quality of web pages

Images

Audit Description
Cloudinary Measurable and actionable information about how to go beyond simple image compression

Hint

Audit Description
Webhint Webhint is a linting tool that will help you with your site's accessibility, speed, security
W3C Validator This validator checks the markup validity of Web documents in HTML
W3C Link checker This Link Checker looks for issues in links
W3C CSS validator Check Cascading Style Sheets (CSS)
Web Dev Measure Get tips to improve your user experience
Axe Accessibility for Development Teams
a11y.css CSS file intends to warn developers about possible risks and mistakes that exist in HTML code
a11y Project Determine how accessible your site is

Compatibility

Audit Description
BrowserStack Browser Testing Made Easy
PolyPane A browser built from the ground up to create and test websites and apps.
Sizzy The browser made for responsive design

Stats

Audit Description
Project Wallance Analyze your CSS and keep track of changes in complexity and branding.
CSS Stats Analytics and visualizations for your stylesheets.

Contrast

https://whocanuse.com/ https://leonardocolor.io/

https://tenon.io/ https://khan.github.io/tota11y/

  • Navigate the navigation using the tab key.
  • Tab to see the focus ring around interactive elements.
  • Basic screen reader check. Use the basics of Voice Over (macOS)
  • Check the alt tags of some of the images, you can also check those with voice over.
  • Check the outline of the page; with landmarks in voice over.
  • Color and contrast check.

https://polypane.rocks/blog/responsive-design-ground-rules/

https://css-tricks.com/automated-and-guided-accessibility-audits-with-axe-pro/

You can’t perform that action at this time.