Nice-to-Know Niche Knowledge for the Savvy Web Developer.
1️⃣ - Taking accurate screenshots of web pages.
*using Google Chrome
To take clean screenshots in the right viewport, open Google Chrome Developer Tools, press
P and start typing the word
screenshot. Then you have the option to take a screenshot of the viewport, the whole page, a specific area, or of a DOM node.
The screenshot will end up as a PNG in your download folder.
2️⃣ - Clear caches when developing.
*in Google Chrome
Tired of hitting
SHIFT every time you reload a page you are developing on so that no caches are left? No problem!
Just go to the settings and check
Disable cache (while DevTools is open).
3️⃣ - Test websites on iOS - without iPad or iPhone.
To quickly test websites on an iDevice, all you need is a Mac with XCode. To make the simulator available for you, open XCode once and click on 'XCode' > 'Open Developer Tool' > 'Simulator' in the top menu. This will open the Simulator app, where you can open any iOS device under
Device. DevTools will run via Desktop Safari, just like on connected devices. Best of all, URLs hosted locally on your Mac work too!
Click here for Webworker Quick Tips Vol. 2.