Related page: Image Editing Tools, Where to Find Images
In regards to size, there are two things to understand about images.
- Image file size, which is measured in KB or MB
- Image dimensions, which is measured in pixels (px)
The smaller the image (px), the smaller the file size.
Our general rule is to use the smallest images we can use without losing quality.
Featured Images
The featured image is the image that will show on the homepage of our website and on our Facebook page.
Featured images need to be landscape rectangular and between 640 and 700 pixels wide and at least 400px tall. They can be JPG or PNG.
640px – 400(ish) px
While there is a required width for featured images, the height of the featured image doesn’t have to be precise, as long as the featured image is rectangular in shape. We’ve found 640×400 to be a good ratio. If you need help with resizing images, see our Image Editing Tools help page.
The featured image isn’t automatically inserted into the finished article, so if you want it there, you’ll need to add it.
Images in articles
All images within articles look best if they are 640px wide, but not more than 900px wide. If you align an image to the left or right, you need to choose the medium size.
If you are doing a listicle with multiple photos, images need to all be the same size. Our default preference for these images is 600px, and not more than 640px.
Smaller devices such as smartphones and tablets have a better user experience if we follow the “640 rule.”
Can I use GIFs?
Yes. Upload them as you would any other image.
Do I have to find my own featured images?
Liberal America writers aren’t required to include their own featured images. Your editors will do this for you. If you want to use a specific featured image, make sure it is 640px – 400(ish) px and rectangular in shape.
Do not upload featured images that are larger than 750px wide. Even though they will automatically resize to a featured image size, large images cause problems. See the section below.
Default image sizes
WordPress allows us to set our default image sizes. When you upload an image, you’ll see these options.
This is very useful because it makes it easy to upload images of differing sizes, but display them at the same size in your content.
Note: you can make the decision to align your image to left, center, or right. Most of our images at Liberal America are centered.
Furthermore, you can link to an outside source if you need to. By default, Liberal America photos link automatically to the media file. Once the image is in your content, you can edit it to a custom size by clicking on the image and then clicking the little pencil in the top right corner.
At Liberal America, we’ve customized our default image sizes to these sizes:
Important note: WordPress will automatically detect the last image size you chose, so be sure to watch the drop-down to make sure you’re inserting the image sized as you want it to show on the page.
For more detail about how image sizes work, visit this site.
Can I load images from my phone or camera directly into WordPress?
From your smartphone, sometimes, if the images aren’t huge. From your camera, no. Images from your camera are designed for print, and are generally very large files.
If you are using high quality (and therefore, huge) images, you can compress them to work for our site by using a variety of free online tools.
The problem with large images
- Your pages will load slowly, which could deter visitors.
- Large images take up a lot of space on our server and cost us additional money.
- Our site’s SEO could be negatively affected – page speed is a ranking factor.
- Our mobile visitors will use up their data allowance faster if your pages are big.
- Our images will not have meaningful filenames.
For your images to load as quickly as possible, it is important to resize them BEFORE uploading them to your website. Don’t upload images larger than what you actually need to display. Scaling images in the HTML code might display them as desired, but it won’t reduce its original file size. For example, a JPG image that is 800×800 pixels with a 100kb file size will take just as long to load when coded to display at a 200×200 size as it would if you displayed it at full size. If you optimize the JPG to only 200×200 before you upload it, you might be able to get it down to 20kb and reduce the load time significantly.
The PNG image format is actually the best choice as it allows to store high quality images with a high level of compression. Unfortunately, PNG files are usually large due to the simple fact that they are not compressed. To compress PNG images, you can use TinyPNG.org, a free online tool that allows you to compress PNG files without losing quality while preserving alpha transparency.
