Bridging the Gap: Difference between Print and Web Design

Posted in Tips, Web Design • Posted on 16 Comments

It’s becoming more and more common for modern-day graphic designers to take on more than one role. In the area of design, many have to be familiar with both print design and web design, which doesn’t sound like a hard task. However, don’t be fooled into thinking they are essentially the same thing; the truth is they are extremely different and any designer who focuses on one sector will more than likely have difficulty becoming comfortable in the other.

We can take myself as an example: I am a print designer that can whip up a business card or flier for you in a few hours. My clients almost always ask me for help with web design and I found myself having to turn it down constantly. Eventually I decided to try my hand at web design and I found it extremely difficult. It’s a completely different development process that takes a while to get used to and I could never really create anything I was happy with. I ended up doing a bunch of research and worked on my technique, and while I’m still not 100% there, I would definitely say I am improving.

Knowing print and web design standards shouldn’t be something you learn in order to be functional in them, but to be able to provide a product to your client that can be easily transferred between sectors. I’ve put together a little list of some of the things I think are most important when dealing with print and web design.

Print Design


Image by: Brian Lary

Freedom of Print Design

File Size – When one goes to get, for instance, their business card printed, the printer usually does not have a limit on the size (megabytes, etc.) of submitted designs. When doing print, and really getting into bigger projects (like full color booklets, folders, etc.), it is extremely typical to see files sizes reach the gigabyte mark. This has a lot to do with setting your document up to print at 300 dots per inch. This creates a bigger file size because you demand a higher quality print than you would using the standard web resolution of 72 dpi.

Bigger Canvas = Bigger Design – Not that it is not acceptable to do really huge designs with web, but this is where the idea started from. You will almost always be able to see a huge design in one viewing rather than having to scroll and slide around websites and piece it together in your mind.

One-Size Design – When you design for a standard business card, that design is only going to appear on that size. When you design for a standard folder, that design will only be on that folder. There is no need to really try to make sure everything in a design is in such a way that it can be printed in different sizes. There are a few exceptions, but most of the time the design you create will only be viewed on the paper size it was created for.

Paper or Printed Factor – Sometimes when you design for print you have to design with the entire finished product in mind. For example printing with a letterpress or spot-UV technique, is an added element to your already magnificent design. Printing on matte paper is another technique that can take your design to another level, as well as using a die-cut.

Fluid Layouts – In my research, web design is a bit boxy; you have to kind of think of elements within boxes and lined up correctly. In print, there is a similar quality but I don’t believe it’s as boxy. You can essentially put everything wherever you want it go. For example, fliers and postcards are almost always designed to wow you and take design to another level sometimes without regard to a box or standard set up.

Limitations of Print Design

Color Selection – You have to be careful when choosing your colors in whatever design program you use. Every time I send something to be printed I’m always anxious and nervous to see the print, because the colors can sometimes end up being way different that what was picked in your design program. To be safe, you want to get a hold of a Pantone Color Picker and pick colors that way. It’s almost impossible to pick really bright, neon colors with a traditional printer, as well.

Technique Translation – Some techniques that are heavily used in web, aren’t easily picked up in print design. Do your research to figure out what does and does not work, especially if you find yourself doing the technique a lot in web design. Things that I found don’t work too hot are subtle gradients (for example medium gray to dark gray/black) and hair lines (1 pixel lines), which I depend a lot on in website design. There are ways around it, but just be sure before you try a different technique in print.

Measurement Limitations - If you want your image to be printed to the edge (with no white border), you must set up what is called a ‘bleed’ in your print design. This is usually 1/8 of an inch of dead space around your design so it can be cut off. With that you have to make sure the rest of your elements are within a safe distance of the bleed so nothing is cut off. You may also have a gutter when creating booklets that is the part of the page that will be coming from the spine. This isn’t the biggest print limitation but something that can alter the appearance of your design if not taken into consideration.

Web Design


Image by: Ben Lancaster

Freedom of Web Design

Infinite Color Selection – The color difference between your mock up and your finished product is almost always the same. The aren’t a ton of limitations on color (not as much as in print) and you can do a bunch more with your colors. The only issue here is hoping other monitors have similar settings to yours in order to translate the design correctly.

Easier to imagine things in motion – I think this was and still is my biggest hurdle with web design. As time progresses integrating web design with motion is becoming more and more standard. This isn’t just another technique but a way to really make your website pop and get your audience to really engage with it.

Technique Translation – Much like the opposite in print design, you can do a lot of your more intricate techniques in web design. Hair lines, gradients and pixel perfect art really work well with web design. If you have more flat colors used in print, you can really use your web design to really add some extra character to the designs.

Limitations of Web Design

One-Size Fits All – When you are creating for the web you aren’t just creating for your monitor’s size, but you must create something that will look good in every monitor size, and presently, you have to even keep in mind the small sizes of iPads and Android cellphones and such. Once this is understood it isn’t a huge deal, but starting out this is one of biggest things newbies skip; optimizing designs for all monitor sizes.

Loading Sizes – Another opposite of print design, you almost always have to optimize your designs for the web. File sizes are to be as small as possible so that can load for your audience as quickly as possible. The trick here is lowering your file size and keeping the quality of your pictures.

The Importance of Bridging the Gap

The biggest importance here is what the client wants. If you’re a web designer and you create a site for your client, it needs to be something that can be easily translated into print design, especially if your client asks you to create the print design. This, in short, is a part of branding and brand recognition: having an audience be able to connect an image or colors or a logo with a company. Knowing the two, even if you are just a web or print designer will allow you to create in a way that can be beneficial for both sectors, and ultimately, your client.

What are some other freedoms and limitations you’ve found in either design sector?

5 Written ArticlesWebsite

16 Comments Best Comments First
  • Sean Allen

    Monday, April 25th, 2011 00:06

    1

    Great article! I could not agree more. Being well versed in both has made my skill set extremely valuable to some companies.

    0
  • Eric

    Tuesday, April 26th, 2011 20:46

    7

    One thing I would add is while both have different specific standards for design, it’s important as a graphic designer to be flexible in both web and print. Additionally, I’d emphasize photography and video as additional sources to be savvy in. Remember, many design elements are the same regardless of the medium.

    It’s easy to assume more differences than similarities, but in short, it’s all art.

    0
  • Vishal

    Monday, April 25th, 2011 19:07

    5

    Interesting article, have been worked on both print and web. but web is something i die for. I am crazy for web layouts.

    0
  • Kian Ann

    Monday, April 25th, 2011 16:35

    4

    Yes yes! But its sometimes hard to explain to clients (esp the “dinosaur” type) why web design needs to be flexible and not only look good on their screen, in their browser and with their broadband Internet connection…

    0
    • Matt

      Tuesday, April 26th, 2011 14:41

      6

      Hahah, “Dinosaur” type clients… I like your way of expressing them (Y)

      0
  • Bratu Sebastian

    Monday, April 25th, 2011 00:41

    2

    Interesiting article, I enjoyed reading it, thanks!

    I am more of a web designer, but have done work for print too.

    0
  • Cody

    Monday, April 25th, 2011 07:16

    3

    Its insane, that is what i can say concerning this post. Because this def is what the whole thing is about right? Keep it up!

    0
  • Paul Mckay

    Thursday, April 28th, 2011 10:52

    8

    Whilst at uni, I was heavily involved with print and typography, however since leaving, I have opted to broaden my horizons and choose to work at a web design company.

    During my time designing and building websites, I have found that it’s a lot easier to produce areas of the design that leap out to the customer/viewer with the use of Flash, JQuery, CSS3 and HTML5, hence keeping them interested for longer periods of time and guiding them to certain areas with ease. With print, the designer is limited to the use of type and photography and the challenge to arrange the necessary information into an interesting, eye catching and possibly inspiring piece of design in order to attract the target audience.

    Both have their pros and cons, but working on a project that involves both aspects of design allows the designer to have more flexibility in producing an experience that immerses the target audience.

    0
  • Jamie

    Wednesday, June 8th, 2011 11:42

    9

    Great article with lots of valid points.

    Being a traditional Graphic Designer that moved into web design and keeps a toe firmly dipped in both, it is often not understood the differences between paper and pixels.

    I’ve sent this article to all my employees and clients!!

    0
  • Nord

    Friday, February 17th, 2012 16:39

    15

    Some who don’t understand web design nevertheless have the job of creating websites or supervising web designers and developers. Others who don’t understand web design are nevertheless professionally charged with evaluating it on behalf of the rest of us. Those who understand the least make the most noise. They are the ones leading charges, slamming doors, and throwing money—at all the wrong people and things.

    0
  • Matt Spencer

    Tuesday, May 15th, 2012 05:47

    16

    Both print and web design has its own challenges, and one should not expect a web designer to know everything about print design, and vice versa. A good web design team should have a member who is functional in print design, because more and more customers are knowledgeable in that area as well.

    0
  • Lisa

    Saturday, February 11th, 2012 20:30

    14

    A friend of mine who has always been a graphic designer and who has graduated from an art school, just can’t make herself love web design. To her web design is the imperfect sibling of graphic design. She just hates it when she has web projects because it feels like dirty work to her, the artist, to have to deal with some browsers and other web nightmares.

    0
  • Bojan Živković

    Saturday, January 21st, 2012 15:12

    13

    One big limitation of web design is font choice, you are very limited while in print design you can use any embeddable font. For Windows users Font properties extension, free extension to check Open Type embedding permission.

    0
  • Cindy

    Tuesday, July 5th, 2011 15:28

    10

    Pros and cons for print design and web design. I think you should choose what you love to do. If you love to make designs for different sites, blogs or other projects, why do something else?

    0
  • John Marble

    Sunday, July 24th, 2011 19:45

    11

    I have worked for both of them but my love remains web design. I am satisfied when i make a client happy about my job.

    0
  • Darren

    Wednesday, August 3rd, 2011 14:47

    12

    Interesiting article, I enjoyed reading it, thanks!

    I am more of a web designer, but have done work for print too.

    0
  • Matt Spencer

    Tuesday, May 15th, 2012 05:47

    16

    Both print and web design has its own challenges, and one should not expect a web designer to know everything about print design, and vice versa. A good web design team should have a member who is functional in print design, because more and more customers are knowledgeable in that area as well.

    0
  • Nord

    Friday, February 17th, 2012 16:39

    15

    Some who don’t understand web design nevertheless have the job of creating websites or supervising web designers and developers. Others who don’t understand web design are nevertheless professionally charged with evaluating it on behalf of the rest of us. Those who understand the least make the most noise. They are the ones leading charges, slamming doors, and throwing money—at all the wrong people and things.

    0
  • Lisa

    Saturday, February 11th, 2012 20:30

    14

    A friend of mine who has always been a graphic designer and who has graduated from an art school, just can’t make herself love web design. To her web design is the imperfect sibling of graphic design. She just hates it when she has web projects because it feels like dirty work to her, the artist, to have to deal with some browsers and other web nightmares.

    0
  • Bojan Živković

    Saturday, January 21st, 2012 15:12

    13

    One big limitation of web design is font choice, you are very limited while in print design you can use any embeddable font. For Windows users Font properties extension, free extension to check Open Type embedding permission.

    0
  • Darren

    Wednesday, August 3rd, 2011 14:47

    12

    Interesiting article, I enjoyed reading it, thanks!

    I am more of a web designer, but have done work for print too.

    0
  • John Marble

    Sunday, July 24th, 2011 19:45

    11

    I have worked for both of them but my love remains web design. I am satisfied when i make a client happy about my job.

    0
  • Cindy

    Tuesday, July 5th, 2011 15:28

    10

    Pros and cons for print design and web design. I think you should choose what you love to do. If you love to make designs for different sites, blogs or other projects, why do something else?

    0
  • Jamie

    Wednesday, June 8th, 2011 11:42

    9

    Great article with lots of valid points.

    Being a traditional Graphic Designer that moved into web design and keeps a toe firmly dipped in both, it is often not understood the differences between paper and pixels.

    I’ve sent this article to all my employees and clients!!

    0
  • Paul Mckay

    Thursday, April 28th, 2011 10:52

    8

    Whilst at uni, I was heavily involved with print and typography, however since leaving, I have opted to broaden my horizons and choose to work at a web design company.

    During my time designing and building websites, I have found that it’s a lot easier to produce areas of the design that leap out to the customer/viewer with the use of Flash, JQuery, CSS3 and HTML5, hence keeping them interested for longer periods of time and guiding them to certain areas with ease. With print, the designer is limited to the use of type and photography and the challenge to arrange the necessary information into an interesting, eye catching and possibly inspiring piece of design in order to attract the target audience.

    Both have their pros and cons, but working on a project that involves both aspects of design allows the designer to have more flexibility in producing an experience that immerses the target audience.

    0
  • Eric

    Tuesday, April 26th, 2011 20:46

    7

    One thing I would add is while both have different specific standards for design, it’s important as a graphic designer to be flexible in both web and print. Additionally, I’d emphasize photography and video as additional sources to be savvy in. Remember, many design elements are the same regardless of the medium.

    It’s easy to assume more differences than similarities, but in short, it’s all art.

    0
  • Vishal

    Monday, April 25th, 2011 19:07

    5

    Interesting article, have been worked on both print and web. but web is something i die for. I am crazy for web layouts.

    0
  • Kian Ann

    Monday, April 25th, 2011 16:35

    4

    Yes yes! But its sometimes hard to explain to clients (esp the “dinosaur” type) why web design needs to be flexible and not only look good on their screen, in their browser and with their broadband Internet connection…

    0
    • Matt

      Tuesday, April 26th, 2011 14:41

      6

      Hahah, “Dinosaur” type clients… I like your way of expressing them (Y)

      0
  • Cody

    Monday, April 25th, 2011 07:16

    3

    Its insane, that is what i can say concerning this post. Because this def is what the whole thing is about right? Keep it up!

    0
  • Bratu Sebastian

    Monday, April 25th, 2011 00:41

    2

    Interesiting article, I enjoyed reading it, thanks!

    I am more of a web designer, but have done work for print too.

    0
  • Sean Allen

    Monday, April 25th, 2011 00:06

    1

    Great article! I could not agree more. Being well versed in both has made my skill set extremely valuable to some companies.

    0

Comments are closed.

54.198.33.96 - unknown - unknown - US