Dev Tools & Utilities | CX Resources

Dev Tools & Utilities

Performance audits, accessibility checkers, security scanners, code quality tools, and everyday utilities used on every project.

Run on every project before launch: Google PageSpeed (performance), WAVE (accessibility), SSL Labs (security), and W3C Validator (markup). These are the four core checks that catch problems before clients or users do.

Performance Auditing4Run before every site launch

Google PageSpeed InsightsCore Web Vitals score for mobile and desktop. Most important metric clients ask about.pagespeed.web.devFree GTmetrixDetailed waterfall, LCP/CLS/FID breakdown, and video of page loadgtmetrix.comFreemium WebPageTestAdvanced performance testing from real browsers worldwidewebpagetest.orgFree Lighthouse (Chrome DevTools)Built-in Chrome audit | performance, SEO, accessibility, best practicesdeveloper.chrome.comFree

Accessibility4

WAVEVisual accessibility checker | shows errors overlaid on the live pagewave.webaim.orgFree Accessibility InsightsMicrosoft's browser extension | guided WCAG 2.1 audit with step-by-step testsaccessibilityinsights.ioFree Contrast RatioCheck text/background contrast against WCAG AA and AAA standardscontrast-ratio.comFree axe DevToolsBrowser extension | finds accessibility issues without breaking the pageaxe.deque.comFreemium

Security5

SSL LabsGrade your HTTPS/TLS setup | A+ is what to aim for on every sitessllabs.comFree Security HeadersCheck HTTP security headers | CSP, HSTS, X-Frame-Options, etc.securityheaders.comFree Mozilla ObservatoryFull HTTP, TLS, and SSH security scan with a letter gradeobservatory.mozilla.orgFree Sucuri Site CheckCheck for malware, blocklist status, and outdated software on WP sitessucuri.netFree Have I Been PwnedCheck if client or agency email addresses appear in known data breacheshaveibeenpwned.comFree

Code Quality & Validation4

W3C HTML ValidatorOfficial HTML markup validation | catches broken tags and bad nestingvalidator.w3.orgFree W3C CSS ValidatorValidate your CSS for errors and deprecated propertiesjigsaw.w3.orgFree ESLintJavaScript linter | catches errors, enforces code style in your repoeslint.orgFree PrettierOpinionated code formatter for HTML, CSS, JS, PHP | consistent styleprettier.ioFree

Image Optimisation4

SquooshGoogle's browser-based image compressor | WebP, AVIF, JPEG. Best quality/size control.squoosh.appFree TinyPNGFast PNG and JPEG compression | drag and drop, API availabletinypng.comFreemium SVGOMGOptimise SVG files | strips metadata and reduces file size dramaticallysvgomg.netFree CloudinaryCDN-hosted image optimisation and transformations on the flycloudinary.comFreemium

API & Testing Tools4

HoppscotchOpen-source Postman alternative | test REST, GraphQL, and WebSocket APIshoppscotch.ioFree PostmanIndustry-standard API client | collections, environments, automated testspostman.comFreemium JSON FormatterValidate and pretty-print JSON responses | quick sanity checkjsonformatter.curiousconcept.comFree ReqBinOnline HTTP client | test API endpoints without installing anythingreqbin.comFree

Everyday Utilities6

Can I UseBrowser support tables for every CSS and JS feature | check before usingcaniuse.comFree Regex101Build and test regular expressions with live explanationregex101.comFree CarbonCreate beautiful code screenshots for proposals and social postscarbon.now.shFree TransformConvert between formats: JSON↔TypeScript, HTML↔JSX, CSS↔JS object, and moretransform.toolsFree BrowserStackTest sites on real iOS and Android devices in the cloudbrowserstack.comFreemium readme.soSimple drag-and-drop README builder | good for GitHub projectsreadme.soFree

SEO Technical Checks3

Rich Results TestCheck if structured data (schema.org) is valid for Google rich snippetssearch.google.comFree Robots.txt GeneratorGenerate a robots.txt file for any site quicklysmallseotools.comFree XML Sitemap GeneratorAuto-generate sitemaps for static sites or non-WP projectsxml-sitemaps.comFreemium