Handy web dev tools
Key shortcuts:
- Paste plain text (get rid of weird formatting): 
Ctrl + Shift + V - Override a page’s custom context menu (so you can access your normal one): 
Shift + right click 
Browser support:
Tests:
- Web Vitals
 - Lighthouse tests
 - Page Speed
 - mobile-friendly
 - Rich Results Test (replaces discontinued Structured Data Testing Tool)
 - Facebook Sharing Debugger
 - webpagetest (test on actual devices and connections)
 
Web Master utilities:
Colors:
Accessibility:
- Who Can Use (color checker)
 - Accessibility Developer Guide
 - ARL web accessibility toolkit
 - Usability.gov
 - Chrome Accessibility Developer Tools
 - WAVE tool
 - W3C Easy Checks documentation
 - Accessibility testing and tools (MDN web docs)
 - captioning videos for free
 
Stop using “click here”:
- Writing Hyperlinks: Salient, Descriptive, Start with Keyword
 - Why Your Links Should Never Say “Click Here”
 
Also, don’t use link shorteners
Free images:
- Unsplash
 - Flickr Commons
 - PEXELS
 - Old Book Illustrations
 - Coverr (free stock video)
 - Storyset (free illustrations)
 
Image optimize:
- For one off, Page Speed has a little link at the bottom of the analysis to download optimized images, css, and js (see Optimize Image)
 - Essential Image Optimization by Addy Osmani
 - Squoosh web app
 - Image Magick (notes)
 
Reference:
JQuery?
Design:
- design examples
 - Components Gallery
 - Laws of UX
 - Web Field Manual
 - Performance Tooling Today
 - Butterick’s Practical Typography
 - Planet Friendly Web Guide
 - Open Source Guide
 - ac4d Design Library
 
Quick local server:
- Python 3: 
python -m http.server 8000then surf tolocalhost:8000(part of python standard library) - Ruby: 
ruby -run -e httpd . -p 8080then surf tolocalhost:8080(note in ruby 3.0+ webrick is removed from the standard library, so you will have to installwebrickgem) - Node: install 
npm install -g http-server, runhttp-server 
Ultra minimal computing notebook:
- new-note (see article)
 - or paste into address bar 
data:text/html, <html contenteditable style='padding:10%;'>, type, then save withCtrl+S. 
Minimal hosting:
Find good font for your editor:
- Programming Fonts, test out mono fonts in web based editor
 
Check content of certificate file:
openssl x509 -in libcal_uidaho_edu_cert.cer -noout -text