Why shouldn’t I upload small images to the media library?

On occasion a customer will ask me this question, thinking they should be uploading the image size they require to the WordPress Media Library. For example, if they require a 300x200px sized image for their content, then they upload a 300x200px image to the Media library. What they don’t realize is that WordPress isn’t meant to be used this way, and they’re actually breaking an essential WordPress feature (ie. responsive images) by doing this — not to mention that WPSSO will probably reject the image for being too small for Facebook and Google’s Rich Results.

WordPress and several 3rd party plugins provide different image sizes based on the resolution of the viewing device (aka responsive images). For example, a 300x200px image in your content will look blurry on high resolution screens (almost all current mobile phones, tablets, and laptops) because the browser must “upscale” the image to 450x300px or 600x400px in order to fill a 300x200px space on these high resolution screens. WordPress includes additional image markup in the webpage to provide alternative sizes (300x200px, 450x300px, and 600x400px for example), which allows the browser to choose an appropriate image based on the screen resolution. If you upload a 300x200px image to the Media library, WordPress will not be able to offer these additional image sizes, and WPSSO will not be able to use this image for most social sites and search engines (which have minimum image size requirements).

So, what should you do if you want a 300x200px image in your content?

That’s what WordPress image sizes are for. ;-)

In the WordPress Settings > Media page, you can select dimensions for a variety of different image sizes, like thumbnail, medium, medium-large, large, etc. Your theme and other plugins may also define additional image sizes, and some plugins allow you to define custom sizes as well. When you need to add an image to your content, you select an image from the Media library and choose the image size you require. You should never use the full size image in your content. If you need a 300x200px image, for example, you should have defined a 300x200px image size in the WordPress settings (cropped or uncropped, depending on your requirements) and then select that image size.

So, what image size should you upload to the Media library?

That’s easy — the largest size you can. ;-)

Currently, Facebook uses 600x315px images to display shared links, so your site should offer 1200x630px images (for high resolution devices) in its Open Graph meta tags. So at a minimum, you should upload 1200px wide images, but hopefully even larger to future proof your images for evolving requirements — both Facebook and Google may require larger images in the near future.

See the WPSSO Setup Guide for more information on image sizes.