1.7 File Formats

Websites are much more engaging today than they were in the early 90s. There are now multiple media types that are supported online and are great way to engage your audience and share information.

However, to protect UX, you need to make sure that your media is optimised for the web. This stops long loading times which would discourage users from leaving your site out of boredom and frustration. Here’s a brief guide to file formats and their best usage.


When optimising  images you want to consider its file size, px size and format. You want to strike a balance between quantity (size) and quality.

JPEG – Joint Photographic (expert) Group

Good for photos as they have 265 colours, tonal range and  a resolution for web of 72ppi (pixels per inch)

Not so Good for keeping quality when scaled or printed as they often pixelate and distort.


SVG – Scalable Vector Graphics 

Good for sending vector images and icons with vector path information too. handy for sending to designers.

Not so Good for preserving brand integrity as you don’t want people messing with your logo and identity!

PNG – Portable Network Graphics

Good for Icons, logos and simple designs with a reduces number of colours. Also supports transparency which is handy for web design and placement.

Not so Good For image(no gradients, icons, logos, transparency)

Screen Shot 2018-02-20 at 12.19.35


GIF – Graphic Interchange Format

Good for graphics and basic animations.

Not so Good For complex colours or gradients as the colour profile will stripe instead of blend.


PDFs Portable Document Format

Good for documents as PDFs keep their resolution and formatting after being compressed and uploaded, helping to guarantee how they’ll display.

Not so Good For editing as specialised programmes, which are often not free, are needed. It can also be difficult to edit text as it is perceived as a picture.





Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.