Free Web Development Tools

Code Editors

Sublime Text is a highly recommended, minimalist coding editor that lets you make changes simultaneously to multiple selections.
Brackets is an open-source editor written in HTML, CSS, and JavaScript with a focus on front-end web development created by Adobe. Live preview feature is a little like working in the Chrome developer tools inspector.
Code Beautify may help with some formatting along the way.

WordPress Local Development

WPEngine Local is a free local development environment for WordPress.


Code Academy is the always the first place I recommend to those who say they want to learn to code.

Graphics: Faster, Sharper, Stronger

Aspect Ratio Calculation

Find the aspect ratio for video images without opening Photoshop or getting out a calculator.

Smaller Images

Squoosh LogoSquoosh is a free tool from Google that minimizes images, optimizes SVG files, and even converts images to WEBP. This may be my new favorite image optimization tool.

tinypingTinyPNG uses smart lossy compression techniques to reduce the file size of your PNG or JPEG files. Trusted by thousands of companies around the world. It says so right on their website. I use this and it rocks but I do have to say that the paid plugin has been crashing in the latest Mac Photoshop (updated 8/18). I’m praying that a new release will fix this.

SVG Optimization

Optimize how SVGs are written, reduce file size, and make them easier to work with. Note that this doesn’t seem to work when images are included in the file in Illustrator it returns an error of “Namespace prefix xlink for href on image is not defined” in my testing.
SVG Optimizer

Placeholder Images

placeholder image Dummy Image allows you to set the color, show the size or use your text for your placeholder images. So create your own or just copy/paste the following to add an image in your code.
<img src="" alt="placeholder">


Free, “do wtf you want with” pixel-perfect icons from

QR Codes

QR Codes can now be generated in multiple formats including vector from Adobe for free here:

Social Tools & Validators

SSL Checkers

It’s painfully easy for techs to partially mis-install SSL certificates. Always use a 3rd party tool to check the install so your green lock is visible in the browser toolbar.

Free Stock Images

The deal with “free stock” images is that you should read their license and terms of service to be sure, but usually, the photographer has given up their rights to the image. This doesn’t mean there are no other rights that could come into play, though. For instance, on UnSplash, they say the following:

Note that the UnSplash License does not include the right to use:

  • Trademarks, logos, or brands that appear in Photos
  • People’s images if they are recognizable in the Photos
  • Works of art or authorship that appear in Photos

I’m not a lawyer (obviously), but lawyers are searching for misuse of stock photography. In general, I’ve seen that they don’t send a cease and desist order but instead send a bill to settle right off the bat.


Free (do whatever you want) high-resolution photos.


Beautiful photos of Black and Brown people, for free.


Beautiful Royalty-Free Photos Sorted By AI.


Free stock photos for entrepreneurs from Shopify

New Old Stock

Vintage Photos from Public Archives. Free of known copyright restrictions.


Stock photos of another kind.

WordPress Photos

This directory hasn’t yet been fully launched, but the photos are all free to use without attribution.

Diverse Stock Images (Not all Free)

Website Scanning and Validation

There are a lot of page speed scanners available, but what about Analytics? Google Tag Manager? The fastest, easiest way to check for theses on a website is Mobiah, the technical team behind the scanner, keeps adding new features, so it’s worth bookmarking and checking back on it.

More Website Scanners

Web Page Speed Tests

WP Rocket - WordPress Caching Plugin
Here’s a whole bunch of web page speed tests to choose from.