Posted by Mardi Elwood


Let your website take a load off: Why optimizing and resizing photos for web and social media is so important.


When we say “load off” we literally mean allowing your website to load faster and not have to work so hard. The use of photos on websites and social media has become increasingly more common with the trend in website design. It may not seem like image size is a big concern, but it is. Resizing and optimizing your photos can largely impact how efficiently your nonprofit’s website runs. Using large file sizes will slow the loading process of your site. And a long loading time can cause those who are clicking to your site to not want to wait.

But wait...what does it mean to optimize photos?

An easy definition of optimization is compressing a photo file size to make it smaller. Keep in mind that the file size of an image is not the same as the image’s dimensions. We’re talking going from megabytes to kilobytes. Since large-dimension photos on sites are all the rage right now, appropriately compressing the file size of an image is extremely important. And doing so will not change its dimensions—it will make the image more web accessible.

Resizing your photos for the dimension sizes on your site is critical to have your photo fit correctly on the page. But also resizing your photos for social media can make it easier for your audience to view them.

Here are a few tips and free resources that can help speed up the loading time and get your visitors to stick around.

Photoshop—Save For Web option.

If you have access to Adobe Photoshop, the program has an internal tool that compresses photo file sizes. This lets you see the change real-time so you can keep the quality of the photo in tact. Here are the steps:

  1. Open Photoshop.
  2. Go to File > Export > Save For Web (Legacy).
  3. In the bottom left corner, you can see the file size of your photo and what file type it is saved as (JPG, PNG, GIF).
  4. In the menu to the right, you can change the file type and change the image size. JPGs usually tend to have smaller file sizes than PNGs and GIFs, so double check to see what yours is set as. At this step, keep in mind what size (dimensions) your photo will be on the screen. If you have a smaller photo, changing it to the correct dimension that you want it to be can help decrease your file size.
  5. Once you have the file size and photo size you want, press save and you’ll be allowed to save the optimized photo to your computer.

You can also follow the same steps listed above OR go to Image > Image Size and change the dimensions. Tip: Make sure the zoom on your screen is set at 100%. This will allow you to see the exact size the photo will appear online.

If you are a nonprofit who doesn’t like to get too technical or are on a budget, here are a few FREE online sites that compress photos quickly and easily.

  1. TinyPNG: This is one of the simplest online photo compression sites out there. Just download the photos (JPG or PNG) you want compressed, and it does all the work for you. The compression of the files on this site keeps the quality of your photo intact and you can save them to your computer like magic. (Plus, they have a cute animated panda on their site.)
  2. Compressor.io: This site set up is generally the same way, where you add your file and it compresses the photo for you. This site can optimize JPGs, PNGs, GIFs, and SVGs. Download to your computer and you have a killer kilobyte image file size ready to bring all the people to your nonprofit site. Boom.
  3. Other sites include ImageOptimizer, ImageOptim, Picresize, FastStone Photo Resizer and LunaPic.

Since resizing a photo is a simple task, here are few free mobile apps to use if you need quick access. All of these apps can be downloaded from the App Store.

  1. Resize It Free
  2. Photo Resizer
  3. Image Size

And finally, even though this site isn’t free, check out PicMonkey, one of the simplest site for resizing and editing images. Comparing the low price with the functionality it provides, it’s worth the investment. Just open your photo in the website, and you can change the dimensions, crop the photo if needed and save it right to your computer. The site also offers other great tools such as photo effects and fonts. PicMonkey offers a monthly or annual billing options for your convenience.

Start taking a hard look at your website’s efficiency. If you’re making it too hard for your audience to easily navigate your website and find the information they need, you’ve potentially lost potential donors and supporters. Taking the time to optimize your photos for your website can make all the difference. So let your website take a load off. Or at least some of it. And if you need help choosing photos for your nonprofit to tell a story, read the article Nonprofit Social Media: How to Tell Your Nonprofit’s Story With Photos.

Firespring provides beautiful, mobile-friendly websites with built-in fundraising and event management tools that are affordable for nonprofits of any size. You can start your free demo, or get more information by calling 877.447.8941 or email hello@firespring.org.


← BACK TO ARTICLES