Resizing photos for web use
Mon, 16 Sep 2013 17:09:00 +1000
I find a lot of people who are put in charge of updating a website have very little knowledge of images and their size. One reason for this is that technology is making it easier to handle these images, the other is that they haven't had to worry about this prior to updating a website.
If I give a user access to upload images to a page on a website, a lot of the time they will take thge photo straight from the digital camera and upload that image. There are several problems with this approach. First the image will probalby be quite large and the web server may reject it on filesize limits. Secondly if it does upload and the user places it on a page as is, then it can take a while to download when viewing it. This will also consume bandwidth on the hosting server which may end up over-using your limits.
The best option is to actually resize the image before uploading. This saves uploading time and your end users downloading time.
How to resize your images
I generally use something like Photoshop to resize images, but if you don't have any image editing programs, something like Irfanview is simple and effective. Open your image in this program and just use CTRL-R on your keyboard to resize. Type in one new dimension (either height or width) and then resave the image to a new filename. Use this new file as the one to upload.
What size should it be?
If you a placing an image inline with your text on your page, then the image should be no wider than your website layout width. This would normally be around 1000 pixels wide. So anything less than that should be ok.
If you are uploading images to the gallery or a slideshow then the size isn't as important as these plugins will resize the images for you anyway. It still helps to resize very large images though as they may still be too large to upload. Resizing them can also speed up the upload process as well.