“So what’s the big deal?” I hear you cry!
Pixelated images are annoying for everyone – they make everything fuzzy and blurry and don’t present your business well at all.
As a graphic design trainer, and keen promoter of vector graphics, one of the things I get asked most is:
“What’s the difference between Vector Graphics and Bitmap Graphics?”
Basically, a Bitmap is composed of lots of tiny squares called Pixels.
Each Pixel has only one colour.
This is because the program you are using (eg. Publisher, Power Point, Word) is saving disk space by using an average colour for each square, thus making for a smaller file size when the graphic is saved.
If your file type is a Jpeg, PNG, Gif, Tiff, BMP to name the more common ones, your file is a Bitmap and therefore sized for a particular application.
When these tiny squares of colour are viewed from a distance, they visually combine to create a smooth image as long as they are viewed at the size they were drawn for.
A pixelated image occurs when a Bitmap image is used at a size it was not saved for. For instance if you try to use a small business card sized logo for a website or brochure, when you enlarge the image you also enlarge the size of the pixels within it.
Vector graphics on the other hand:
So to re-cap:
Vector Graphics give a smooth outline to anything you draw or type (this is the system used by expensive professional graphics programs such as Illustrator, Macromedia Freehand and Corel Draw) and it means that your work will not lose any definition even if you decide to use the same artwork on a business card or on an 8ft banner!
Vector graphics also mean that your design work, e.g., your logo, advert, flyer, etc., can be viewed on a website or social media and not lose any quality regardless of the device you use to view it on.
The diagrams here show you the dramatic difference between the two types of graphic.
As you can see, as the Bitmap is made larger, the pixels become more and more noticeable. You have probably seen this effect for yourself when looking at images on websites or at over enlarged printing.
These days, professional graphic designers and website designers always use Vector Graphics to design with because they are so versatile. They only have to draw the logo, for instance, once and then can re-size it for any purpose without having to draw it again but larger, and the pixels don’t show.
Graphic designers tend to send customers the bitmap versions, and keep the vector version for quick resizing when the customer needs a new promotional product. Very convenient!
Vector programs work on newer technology than bitmaps and are drawn using lines and shapes as before, but behind the scenes the program is based on a series of mathematical equations, keeping the file size small and the lines smooth. Professional designers all now use vector programs for designing on.
But what if I want to do my own design work?
Programs such as Publisher, Power Point and Word, while capable of acting as graphics programs in a limited capacity are Bitmap programs and therefore not suitable for professional looking graphics – and you want your business to look professional not pixelated!
It really is the little things like pixelated graphics that puts customers off responding to an advert or call to action.
“But I can’t afford to buy vector graphic software – it’s really expensive.”
Up until recently, you would have been right, but we have been researching on your behalf and have discovered a completely free open access Illustrator equivalent called Inkscape.
Quite simply, it’s brilliant!
“But I can’t find any straight forward information on how to use it!”
There is very little easy to follow, click by click information available on how to use Inkscape.
The few tutorials on line tend to be written for people who are already trained designers, and as Inkscape is based on Illustrator, the designers know more or less how to use it, so the online tutorials tend to be very technical. They show off what the program can do to other designers, but don’t teach anyone the actual basics of how to start using the software or the basics of graphic design – it is sort of assumed you already know.
I didn’t think this was fair… so I wrote some!
….and now I want to pass this knowledge on to you to help you be your own graphic designer and banish pixels back to where they belong!
I have written two Inkscape courses specially to train people just like you to be able to use this remarkable software.
‘Inkscape for Beginners’ has over 40 tutorials, videos and demonstrations to guide you in the basics as well as some interesting projects to inspire your creativity.
‘Inkscape for Business’ follows on from this to provide bespoke training and know-how to not only show you how to use the software for creating your own unique branding whenever you need it – with no design costs and no copyright or royalty issues.
It too has over 40 tutorials, videos and demonstrations but also contains essential graphic design training, printers terms and requirements and useful grids so you can begin working on real projects right away.
Because I really want to help you to be able to take control of your own design and branding, I have kept the cost of each entire course down to just £29.95, but should you wish to purchase both courses together there is a special offer right now to buy both as a package for just £50 – saving you £9.90.
And, because every so often we all need a bit of help, advice and reassurance, purchasing a course also gives you membership of our closed Facebook support group, so you can chat to other members or ask Kim and me for advice.
So why do we still have Bitmaps then?
Bitmap graphics (also known as Rasterized bitmaps) are best reserved for working with photographs.
You have probably noticed that if you zoom in on a photograph it becomes pixelated – this is basically because the amount of information contained in a photo is huge and if you vector a photo the file will be huge.
Large files not only take up memory, they can slow down the speed at which images load onto webpages.
Using Vector Graphics for drawn images and type takes much less memory than a Bitmap image and so they load really fast regardless of the resolution or size of the screen (e.g., from phone size up to widescreen TV or even home cinema!)
However, while your Vector Graphics will remain sharp, do bear in mind that at large sizes photographs will start to pixelate – it all depends on what dpi (dots per inch) the photo was saved at.
For printing, the best quality photos to use should have 300 dpi (dots per inch) or more and do bear in mind that the larger you blow photos up, the more noticeable the pixels will become.
How do I tell if a graphic has been saved in a PIXELATED format?
This photo of a Gerbera has been saved as a PNG (Portable Network Graphics) image and is therefore Pixelated.
Other common files such as JPEG (Joint Photographics Expert Group), BMP (Bitmap Image), GIF (Graphics Interchange Format) and TIFF (Tagged image File format) are also Bitmap files.
Vector files will be saved as SVG (Scalable Vector Graphic), EPS (Encapslated Post Script), AI (Adobe Illustrator) and sometimes PDF (Portable Document Format) although this will depend on the program the graphic was created in.
WARNING: Always trust your eyes!
If a bitmap image has been saved as a SVG file it will have an SVG file type but the image will still be pixelated – it is a one way process so don’t be fooled…Use your eyes!
So now you know…
I hope the above has explained the difference between Vector Graphics versus Bitmaps without going into too much technical detail, suffice to say that Vector Graphic are by far superior to Bitmaps excepting with photographic material – but make sure you keep the resolution to 300 DPI / PPI or more!
And if you would like to learn to use Inkscape Vector Graphics for yourself, just click through to take a look at our courses, Inkscape for Beginners and Inkscape for Business, and see how easy it can be for you to take control of your own design, marketing and branding!