Quality image is a big factor in blogging? Suppose, you get quality web images for free and now, you may need to resize them. So, what is the best image size for your blog? Are you inadvertently slowing down your blog’s load time? What is this PPI/DPI thing?
I’ve heard the questions being asked on different forums so I thought I’d try to explain a little of what I know, especially as it pertains to my own blog. Who knows, maybe you’re in the same boat and have some of the same questions, and these little tips might come in handy!
Size your images only as large as your blog content width
For example, if your blog content area is 690 pixels wide. There is no need for me to size my photos any larger than 690 pixels, since the content area will only display up to 690 pixels. An image of 800 pixels will automatically be shrunk when shown on screen.
There is no concept of “per inch” in a web layout
So PPI (pixels per inch) and DPI (dots per inch) are not relevant when editing your photos for your blog, even though they may be available as options in your software. You can save the images at different PPIs, but there won’t be any difference in picture quality!
Don’t focus on PPI and DPI
PPI and DPI are not relevant to web displays, but they are important when creating printable. Images that are meant to be downloaded and printed should be created at 300 PPI. If you download the photos above and try to print them, you’ll see they print at different sizes, with the 1000 PPI image printing at under 1 inch wide.
Same file size
An image at 600 pixels wide by 400 pixels in height will have the same file size regardless of what the PPI is set to. This image will have 240000 pixels of information, and that’s what determines the file size. However, an image at 800×600 will have a larger file size than one at 600×400 because it contains 480000 pixels of information. Since the larger image contains more data and the file is larger, this will slow down your page load time.
Save your JPEG images somewhere around the 80% quality range
This would mean about a 20% compression. Do some experiments with different JPEG qualities to see what works best for you.
Use proper image size
WordPress stores multiple copies of your uploaded images in different sizes – a thumbnail, a medium copy and a full size copy – and they are different in file size. If you need to display an image at a particular size, pick the smallest copy that is the same or larger than your desired display size, and use the <img> tags to adjust display size. To display an image at 400 pixels wide, use the full size copy and shrink down to fit – do not enlarge the medium copy, as that will result in pixilation or blurriness.