Website Images - Best Practices
Adding images to your WordPress media library is easy, but there are some best practices to keep in mind when selecting images for your website.
- Use .jpg files for images. GIF files do not hold enough information and tend to look pixelated. PNG files are generally larger (in terms of file size) than a JPG file of the same dimensions, which can 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 be the dimensions they will be used on the page where they are added. 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 cause your page to load more slowly and occupy 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" - Avoid uploading files with excessively 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.
NOTE: Try to make the titles of your images match the content of the image. For example, if the image you are using is of Pounce in Hurt Park, change the image title to something like "pounce-in-hurt-park.jpg". This will keep the title short and help in SEO. - Don't upload any unshrunken screenshots to WordPress. If you need to add a screenshot to your site, take the screenshot and then shrink it to the actual size that you will need it to be on your site. Don't forget to change its name to something more concise and descriptive.
For example, change "Screen Shot 2024-11-30 at 4.17.21 PM.jpg" to "homepagescreen.jpg". - Don't upload files larger than 1MB in size. You should compress your files before uploading them. Even 2000 x 1200 pixel .jpg files should be no larger than 400 KB in size. Anything larger will cause your page to load more slowly and occupy more space in your media library.
- Marquee images should be 16: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. Add a very brief description of what the image is. For example, a photo of Centennial Hall should have the alt text of "Centennial Hall" or "Centennial Hall at night".
NOTE: If you add an image to your media library, but forget to add alt text to it before putting the image on a page in your site, but then you go back and add the alt text to the image in your media library, THAT ALT TEXT WILL NOT AUTOMATICALLY GET PULLED TO THE PAGE that you put the image on. You will need to re-add that image to your page after you have added the alt text to the image in your media library.