

As responsive websites become the industry standard, SVGs are being used more and more as they allow web graphics to be re-scaled to any size screen without distortion. Whilst this file type is not as common as some of the others mentioned, we think it’s well worth knowing about. SVG (Scalable Vector Graphic) is, as its name suggests, a format for vector graphics.

One differentiating feature of PNGs is alpha transparency. Like GIFs, PNGs are a lossless format so you won’t lose any data when you compress your image. PNGs (Portable Network Graphics) come in two varieties- PNG-8 and PNG-24. You require an image with a transparent background, i.e only the icon or logo showing, without a solid colour behind it.Your image contains hard edged shapes (like text or shape patterns).Your image has only a few, solid colours (like small web icons or simple images).Your image is going to be used online (websites, email mailouts).This can cause images to look ‘off colour’. The downside to GIFs is that they don’t have as rich a colour spectrum as jpegs, only using 256 colours, or 255 if you enable transparency. GIFs (Graphics Interchange Format) are also raster files but are a lossless format, which means that you don’t lose any data information when you save your file like you do with JPEGs. You have no need for image transparency.Your image has lots of complex colours and gradients.So when should you use a jpeg? General rule of thumb is when: JPEGs are suitable for use online and in print. This reduces the image size, making it easier to distribute and store. JPEGS (Joint Photographic Experts Group) are one of the best known raster image formats and what’s known as a ‘lossy’, which means that when you save the image, it partially discards some image data to compress the image. Common image file types and their uses JPEGs Whenever a designer creates a new graphic from scratch, such as a logo, generally they will create it as a vector, because it provides more flexibility in how they can later use that image.

Vector graphics file types include Adobe Illustrator (AIs), SVGs and EPS’. Due to the way that they are created, vector graphics can be infinitely stretched and resized without losing any image quality which makes them perfect for items like company logos. Vector graphics use mathematically based points, lines, curves and shapes to create graphics. This is what causes it to look blurry, pixelated or distorted. When you enlarge a raster image, your computer 'guesses' the information that should be used to fill in the newly formed space. The more pixels that the picture contains, the higher its resolution. A raster image is made up of a fixed number of individual coloured pixels that, when viewed together, form a complete picture. Some common raster graphics file types include PNGs, GIFs and JPEGs. Have you ever tried to enlarge a photograph, only to find it gets distorted at a larger size? This type of image is known as a raster. If you’re not working with graphics daily, chances are you’re not overly familiar with file formats and their different uses either–and that’s ok! Raster vs. Here, I'm going to cover some of the most popular image formats and their uses so that you know your PNGs from your SVGs and can use them with confidence in your work. Even if you work closely with a designer, having an understanding of this subject will ensure that the design that you’ve paid for always looks the best it can. There are a whole barrage of file formats, and using them in the correct way can have some neat perks like shortening website loading times and boosting Search Engine Result Page (SERP) rankings. If you don't know your PNGs from your SVGs, there's no time like the present to learn! While it may seem trivial, choosing the incorrect file format could be undermining your marketing campaign and devaluing your outward facing business image.
