Module 3 – Image Formats

The assignment was to create an image, save it in JPG, PNG, and GIF formats, and compare them. The result is on the page here:

http://jered.0fees.us/module3/

For the image, I took a picture with my phone. The phone stored the photo as a JPG. I then converted that image to the two other formats, and resized all three to a width of 1024 for better web viewing than the larger original.

I was surprised to see the GIF compare reasonably well to the other formats in terms of visual quality. Looking closely I can see that the colors in the GIF are bit washed-out compared to the others, but it wasn’t a difference that stuck out at first glance. I didn’t see a difference between JPG and PNG, though the initial image being in JPG format might have influenced that outcome.

The JPG was easily the most web-friendly of the three, coming in at around 61k. Next was the GIF, at 308k. Then the PNG, the lossless format, was 1220k, far and away the largest. The PNG would definitely be the least web-friendly format, as that size would slow a page’s load time quite a bit (especially a mobile phone using wireless data).

I was able to load the images in both desktop and mobile browsers.

This entry was posted in Web Design Technologies. Bookmark the permalink.

Comments are closed.