Website Checking Tools » History » Version 6
Peter Amstutz, 08/11/2022 07:02 PM
| 1 | 1 | Sarah Zaranek | h1. Website Checking Tools |
|---|---|---|---|
| 2 | |||
| 3 | h2. Responsiveness/mobile |
||
| 4 | |||
| 5 | 2 | Sarah Zaranek | * Firefox Responsive Design Mode (CTRL + SHIFT + M shortcut on linux) |
| 6 | * Resize the window to really small (mobile, or xs- in bootstrap, then increase a little to about 400-800 px when the medium viewport must trigger, or md I think in bootstrap) |
||
| 7 | 1 | Sarah Zaranek | |
| 8 | 3 | Sarah Zaranek | h2. Accessibility |
| 9 | |||
| 10 | 2 | Sarah Zaranek | * WAVE - https://wave.webaim.org/ |
| 11 | * Firefox - Right click anywhere on the screen and "Inspect Accessibility Properties" |
||
| 12 | * Accessi - https://www.accessi.org/ |
||
| 13 | * pa11y.org - https://pa11y.org/ |
||
| 14 | * For contrast, my favorite is squinting my eyes… similar to how you can do to simplify colors in a painting… I find that when the text color fades and almost disappears, that's normally because of bad contrast, and users with disabilities/diseases that cause blurred vision probably won't be comfortable reading it (I did that for Arvados.org and noticed some text that was hard to read, before testing with WAVE & accessi :joy: I just try never let anyone see me doing it) - https://www.sightsize.com/the-value-of-squinting/ |
||
| 15 | * ORCA Linux screen reader - I find that these automated reports are useful for auditing, but for really confirm if a site is accessible, the best is always to ask a person with a disability to test it, or use a screen reader. Windows has a screen reader that's a lot better than ORCA. |
||
| 16 | 1 | Sarah Zaranek | |
| 17 | 2 | Sarah Zaranek | h2. Performance |
| 18 | 1 | Sarah Zaranek | |
| 19 | * Chrome Lighthouse - https://developer.chrome.com/blog/lighthouse-load-performance/ |
||
| 20 | |||
| 21 | 3 | Sarah Zaranek | h2. Link Check |
| 22 | 4 | Sarah Zaranek | |
| 23 | 1 | Sarah Zaranek | * W3C Link Checker - https://validator.w3.org/checklink |
| 24 | |||
| 25 | 3 | Sarah Zaranek | h2. Typos & Grammar |
| 26 | 1 | Sarah Zaranek | |
| 27 | 3 | Sarah Zaranek | * WebStorm (it has a "Inspect" feature that uses a dictionary for typos, and a mix of custom language-rules & LanguageTools for Grammar). Not perfect, and I only run it when I have the code (I didn't use it for Arvados.org) |
| 28 | 1 | Sarah Zaranek | |
| 29 | 3 | Sarah Zaranek | h2. SEO |
| 30 | 1 | Sarah Zaranek | |
| 31 | 3 | Sarah Zaranek | * These two pages recommended by google, for schema.org tags - https://developers.google.com/search/docs/advanced/structured-data (e.g. https://validator.schema.org/#url=arvados.org) |
| 32 | 1 | Sarah Zaranek | |
| 33 | 3 | Sarah Zaranek | h2. JS/CSS |
| 34 | 1 | Sarah Zaranek | |
| 35 | 3 | Sarah Zaranek | * Firefox console, checking for warnings/errors. |