There has been quite a bit of mystery related to photos and Site Resources. I wanted to give you guys a quick tip on choosing photos for your sites.
For help choosing an appropriate photo for your content, review the Full Resource on www.aauw.org.
How to Use Images on your Branch Website
You should always check that the images you use are in an acceptable format for your website. This means that after finding an image based on the tips in this article, you must check these four things: file type, size, resolution, and file name. (Note: This guide was written specifically for use with a Site Resources website but contains good rules to follow for any website.)
1. File type
Your website should contain only these types of images:
- JPEG (.jpg) images are preferred for photographs
- PNG (.png) images are preferred for logos and images with large color blocks
If the images you have are in a different format, see if you can get them in a JPEG or PNG version, or check if it’s easy to convert the image into one of those file types.
2. Image size
You want to choose images that will fill the space of your website’s content well without being pixelated. But if your image file is too large, the page will take longer to load, particularly on mobile devices or devices with a poor connection. On Site Resources websites, we recommend the following dimensions:
- Header images: 960 pixels wide by 250 pixels tall
- Web page images: 700–750 pixels wide by 300–500 pixels tall
WordPress (the platform that Site Resources websites use) will automatically create a medium (300 pixels wide) and thumbnail-sized (150 pixels wide) copy when you upload an image to your site.
(Hint: To find the image size on your PC, open the folder that contains your photo file. Right click on the file name and select Properties. Under the Details tab, look to Dimensions, which are measured in pixels. On a Mac, open your photo file in Preview, select Tools from the top menu bar, and select Adjust Size. In the window that pops up, you should see the width and height, as well as the resolution.)
Print-quality images are not the same as web-quality images. Read more about selecting images for print.
3. Resolution
Just like for image size, selecting resolution is a balancing act between quality and loading time. Websites don’t require the highest resolution images to still be quality. A good rule to follow is to set your image resolution to 72 dpi (dots per inch — check out this resource for how to find the dpi of your photos). Use this tool to quickly change your image size and resolution (for web images, select Medium Quality.)
Your website can only accept file sizes up to 3 MB (megabytes), but you should shoot for less than 1 MB (or 1,000 KB/kilobytes).
4. File name
File names for your images can be very important in how well your website ranks in search engines like Google and Bing. Use keywords including nouns that describe AAUW, your branch, or your event in the file name to help. The goal is to include as many keywords in a short, descriptive file name as possible. Eliminate extraneous words such as “compressed” or “small.” Numbers and letters that are not a part of the actual photo file name should be removed, too.
Look at these examples for do’s and don’ts in naming an image featuring your friend Sue at an AAUW table at a local event.
Don’t
Sue-1.jpg
Sue at the table.jpg
Do
AAUW table at fundraiser for NCCWSL scholarship.jpg
The last option is the best in terms of keywords and will benefit you both on search engines and for easy use of your branch’s photo archives.
These tips can make all the difference in your branch’s online image. Make sure your website is reflecting how inspiring and fun your branch or state work really is!