Whether it’s uploading the company logo, or allowing the user to upload photos of their cat, users need to be able to upload an image.
Bob signs up for your application. Bob likes taking photos, he’s an amateur photographer, and he’s got himself a 8 megapixel digital camera which takes beautiful high quality images. The super high quality image he uploads covers the entire page, distorting everything else!
You don’t see this happen in web applications, because everyone who does image uploading also offers Image Processing. Image Processing comes in two parts: Cropping and Resizing.
The first, and most commonly used method is resizing an image. Instead of letting an image go to it’s native dimensions you shrink it down to a manageable size. You will lose some quality when resizing them, but general web browsing, you don’t need extremely high quality images. Resizing itself, however, isn’t sufficient to solve all the problems.
If you have a rectangular image that needs to fit it into a square area, the image will be horribly distorted if it is just placed straight in.
To solve this problem, we also use Image Cropping. If you’ve ever set your Facebook profile picture, you’ve cropped an image. The essence of cropping is selecting an area of the correct size from the image.
The reason that both cropping and resizing are done as Image Processing is that you’ll generally want to do both at once. Cropping an image is worthless if all you can fit in is the little finger of the person you are photographing, and resizing an image doesn’t deal with dimensions that are at the wrong ratio.
Pros:
- Personable: Allowing your users to upload images gives them the ability to personalise their experience with your application. Whether this is a profile picture, or corporate logo, you can really engage the user with a well placed image upload. Think how Facebook would be without a profile picture!
- Resizeable: If you store the original images, you can adapt your application to any future needs. If you need a new type of thumbnail, with original images, you can easily produce an image of just the right dimensions
Cons:
- Sizeable: Images are big. If you are storing the originals for each image, you can very quickly get through a ridiculous amount of storage space. Storage space is cheap, but images are usually at least order of magnitude larger than anything else you’ll be storing (unless you are a video hosting firm!)
