Hey HN, Josh here. I’m a frontend developer at a devtools company, and I keep noticing obvious mistakes like typos and accessibility problems make it into production.
I wanted to find something like pagespeed insights that would run against commits when they were first pushed, instead of after changes were deployed
That’s why I built Website Linter, a zero-configuration tool that scrapes pages on your site to find layout, spelling, and accessibility issues. It also gives you screenshots of the above-fold content across multiple device sizes.
Horizontal and spelling errors are easily overlooked during code reviews, which is why they enter prod often. Website linter helps you catch those issues as they appear instead of weeks later.
Under the hood, website linter uses:
- Lighthouse to get performance metrics and screenshots for different device sizes
- Pa11y to find accessibility issues
- Chromedp in Go to get HTML nodes that are larger than the width of the screen
- Fuzzy (in Golang) to find spelling errors on a trained dictionary (using a cleaned version from the words_alpha.txt file here: https://github.com/dwyl/english-words
I built Website Linter by re-using the infrastructure from the startup I work for, but you can use it on any internet visible page. Would love to know if you try it out!
Hey, could you give me a little more detail on what you're seeing (i.e. what browser are you using), would love to fix it so you can check it out. Thanks!
I wanted to find something like pagespeed insights that would run against commits when they were first pushed, instead of after changes were deployed
That’s why I built Website Linter, a zero-configuration tool that scrapes pages on your site to find layout, spelling, and accessibility issues. It also gives you screenshots of the above-fold content across multiple device sizes.
Horizontal and spelling errors are easily overlooked during code reviews, which is why they enter prod often. Website linter helps you catch those issues as they appear instead of weeks later.
Under the hood, website linter uses:
- Lighthouse to get performance metrics and screenshots for different device sizes
- Pa11y to find accessibility issues
- Chromedp in Go to get HTML nodes that are larger than the width of the screen
- Fuzzy (in Golang) to find spelling errors on a trained dictionary (using a cleaned version from the words_alpha.txt file here: https://github.com/dwyl/english-words
I built Website Linter by re-using the infrastructure from the startup I work for, but you can use it on any internet visible page. Would love to know if you try it out!
To see what it looks like, visit here: https://webapp.io/website-linter-report/0 for a sample report (netlify’s homepage) or install webapp.io on GitHub: https://github.com/apps/webappio/installations/new and go to the “website linter” tab in the webapp.io dashboard after signing up.