FEB 15 2018

Designing for Print Vs. Designing for the Web: 5 Basic Differences


TAGS : Design, print, online

Your print marketing collaterals should look different from what goes online. This article explains the basics of how they must be designed differently.


How do you determine whether the design you’ve received is good for print or for the web?

Here are 5 basic differences to help you do just that.


#1 - How the reader approaches your design

The very experience of design is different on the web and on print. There’s a vast difference between reading something that you can physically hold and reading something digital. For print, you can explore the idea of turning pages, folding and unfolding parts, paper texture, shapes, letterpress and embossing. These are not possible when it comes to a design for the web. However, your web design can involve other interactive experience such as hyperlinks, videos, audio and animations.


#2 - Requirements for navigation and usability

Print experience is limited to flipping, folding and unfolding paper. Or collaterals like hoardings and banners that are visible at a glance. Therefore, it’s important to keep visibility and flow in mind. But when it comes to the web, you have many other facts to keep in mind, such as menus and tabs for easy accessibility, compatibility and responsiveness - how it looks across various devices and screen sizes.


#3 - Resolution

Depending on the size of the elements you use in your design, resolution is key. Sometimes, though your design may not look pixilated before printing, you might find grains and pixilated marks on the print. Ensure good resolution and take care of DPIs (dots per inch) and PPIs (pixels per inch).

Ideal resolution suggested for web and digital images is at least 72ppi and for print it is recommended to have a resolution of at least 300ppi to avoid pixilation of final renders.


#4 - File types

In order to take out prints of best result, JPEGs, PDFs and TIFF files are the ideal formats to save your design. On the web, PNGs and GIFs will also do, apart from JPEGs and PDFs.


#5 - Colour codes

For print, you must always design in CMYK (cyan, magenta, yellow and black) so that the colour of your printed design matches the preview. For the web, the RGB (red, green and blue) format works best.

CMYK does not have a white color since printing is usually assumed to be done on white and that will cover up the empty spaces. But if the project will only be seen digitally, it is suggested to work with RGB as digital displays primarily comprise of red, blue and green pixels combining together in different ratios to produce required shades.


Hope this introductory guide helps. If you’d like us to go into more detail or answer your questions, feel free to comment below. And if you’re looking for great design, do check us out at 01Design!