Designing for web and print are two different experiences.
Just because a designer is good at one doesn’t mean
they’ll be good at the other. It’s necessary
to understand that web and print share many similarities,
but they also have many differences.
Below is a list of things to consider when going from print
design to web design:
Resolution
Resolution is the quality of an image. It’s measured
in terms of pixels. If you see an image listed as “72
ppi”, that means the image has 72 pixels per inch (ppi).
Because web graphics are viewed on screen, they should be
no larger than 72 ppi. A large ppi image will load slower,
and won’t necessarily look any better.
Image Files – Gifs and Jpegs
JPEG stands for Joint Photographers Experts Group. It’s
a great format that retains color and detail found in photographs
and graphics with lots of color blends. JPEGs can display
millions of colors so it’s ideal for print work.
GIF stands for Graphics Interchange Format. Most web pages
use this format because it’s supported by all web browsers,
can display up to 256 colors, and can include transparent
backgrounds. GIFS are appropriate for image files with little
color variation, and for images that will only be viewed
on screen.
Photographs saved as GIFs may appear grainy. Single color
images saved as JPEGs may appear fuzzy. When you save a graphic
image, consider what type of file it is. Remember, GIFs work
best with images having few colors or color variations. JPEGs
work best with photographs or images to be printed.
Fonts
There is a major difference between choosing fonts for web
as opposed to print. With print design, your completed piece
will display the font specified during the design process.
You don’t have to worry that a reader will open your
brochure and not have the proper fonts displayed. However,
web designers never know for sure if their fonts will display
properly.
Unlike with print, web fonts differ based on the web browser
being used. Your audience can only view the same font you’re
viewing if it’s installed on their computer. If you
design a beautiful website using Chaucer Bold, and none of
your viewers have that font, their browsers will have to
find a substitute.
This is why it’s good to be conservative when it comes
to web fonts. Your beautifully designed page can look horrible
when displayed on someone else’s browser. Don’t
let your hard work go to waste. Stick to fonts such as Helvetica,
Arial, Times New Roman, or Verdana. All web browsers are
capable of displaying these fonts. However, if you do want
to use a creative font, you can include it in a graphic file.
But this will cause your page to load slower.
If you’re a print designer faced with designing a
web page, take time to study the subject. You will be able
to create a pleasing and effective site if you recognize
the differences between print and web design.