Website Images - Best Practices

Adding images to your WordPress media library is easy to do, but there are some best practices to keep in mind when looking for images to put on your website.
  • Use .jpg files for images. Gif files do not hold enough information and tend to look pixelated, and .png files are generally larger (file-size wise) than a .jpg file of the same dimensions and will affect the performance of your site.  png files may be used if transparency is required in the image.
  • The largest dimensions that an image should be are 2000 X 1200 pixels. Only images used for full-width header backgrounds should be this large, all others should only be the dimensions that they will be used on the page you are adding them too
    For example, if you need an image that will only take up 500 X 500 pixels on a webpage, only use a 500 X 500 pixel .jpg file. Anything larger will simply make your page load slower and take up more space in your media library.
  • Don't upload images with filenames with periods or hyphens in the title.  This can cause data problems. The only period in an image file should be before the .jpg itself. 
    Example: "filename.jpg"
  • Don't upload files with super long names. Extra long file names when combined with the image path can exceed character limits causing 404 errors. Try to keep file names below 56 characters including the period and extension. 
  • Don't upload any un-shrunken screenshots to WordPress. If you need to add a screen shot to your site, take the screenshot and then shrink it to the actual size that you will need it for on your site. Don't forget to change its name to something smaller and more descriptive.
    For example, change "Screen Shot 2019-05-31 at 4.17.21 PM.jpg" to "homepagescreen.jpg".
  • Don't upload files larger than 2MB in size. You should compress your files before uploading them, and even 2000 X 1200 pixel .jpg files should be no larger than 500kb in size. Anything larger will simply make your page load slower and take up more space in your media library.
  • Marquee images should be 16 X 9 ratio. Profile images should be square with a minimum size of 300 X 300.
  • All images require that the "Alt Text" field in their settings be filled in for SEO and 508 Compliance. Simply add in a very brief description of what the image is. E.g. "Centennial Hall"
This website is a great resource for resizing and compressing images, https://www.iloveimg.com/.

Feedback and Knowledge Base