Print Design vs Web Design - Part 1



Get Web Design Tips and Tricks on mps-web-design.com. Print Design vs Web Design - Part 1 topic will increase your understanding on Web Design Tips and Tricks. We at mps-web-design.com only provide news, articles, information in Web Design Tips and Tricks. Web Design Tips and Tricks at mps-web-design.com provides the most up to date news and articles. If you have questions please do not hesitate to contact us.

Despite the lucrative business opportunities on the web, many web site design companies create web sites that receive such low sales that do not even cover online costs. The problem here though is not the web, but an inability of inexperienced graphic and web site designers to distinguish web site design and promotion from everything that's come before it.

When some people turn on their computer, they actually think they're seeing a printed page on their screen. They then assign print strategies to a web layout. But many of the rules of print simply don't apply to the web, so the end result is usually a mess, and the original promotional message of the business lost.

To avoid these same pitfalls so many businesses have faced, this 'Print Design vs. Web Page Design' guide will help you identify some common problems involved in the creation of a web page and how to keep the focus on promoting your online business effectively:

Resolution, GIFs & JPEGs, Fonts, Typography, Plug ins, Navigation, Colours, Computer monitors, Conclusion

Resolution

Resolution is the image quality measured in terms of how many pixels make up your image. It is commonly referred to as 'ppi' (pixels per inch). Because your images are to be viewed on a screen, all web graphics should be no larger than 72 ppi. Anything higher has no improved effect, and only creates longer download times

GIF's and JPEG's

GIF is short for Graphics Interchange Format. GIF's advantages are that it is supported by practically all web browsers, can include transparent backgrounds, supports interlacing (providing a low-resolution preview of the graphic to the viewer while it downloads), and can be used as an image map (allowing the viewer to click on the graphic as they would a regular link to another site).

JPEG is short for Joint Photographers Experts Group. JPEG is superior in rendering color and detail found in photographs or graphics using blends, gradients, and other tonal variations.

Sometimes it's obvious that a graphic on someone's web page was saved in the wrong file format. Photos may look too grainy, or flat-colour images may look too fuzzy. When selecting GIF or JPEG for your graphics conversion, it is important to consider the type of image you will be working with. Use a GIF format if your graphic consists primarily of line art or flat colors without gradients. JPEG-converted graphics are best for photographs or images with fine tonal variations in colors, such as images with gradients or metallic images. Choosing the right file format is not only important for the quality, but for keeping your image's file size to a minimum.

Fonts

For your audience to view the same font (a unique set of type characters) you see on your own screen, they must also have the same font installed on their own individual computers. Otherwise, their browser will instead show a substitute font, which designers have no control over.

For this reason, be more conservative with your choice of fonts. Display only what the general public already has on their computers. If you're looking for a contemporary look, use standard fonts like Helvetica or Arial. If you're looking for a more sophisticated look, use fonts like Times or Verdana. If you absolutely MUST have everybody see your creative font, then convert the selected text into a graphic. Use this option sparingly, though, since it will increase your web pages' download time.

Typography

The harsh reality of web design is that you simply don't have the kind of control over how your text appears. It is far less sophisticated than what is possible in print media. The choice of font, the exact size of the text, where the text breaks, and how the text reads - all are aspects of typography. And on a web page, they are mostly determined by the web browser, not by the creator or owner of a web site.

At a screen resolution of only 72 dpi, text is nowhere near as sharp on screen as it is on a print publication. For this reason, be very careful not to overload your readers with too much text and allow for some open white space.

Plug-Ins

There are several mistakes designers can make when it comes to adding plug-ins (a software extension that provides added capabilities to the browser) to their site. They may:

1. fail to include a warning to the visitor in advance that a plug-in is needed to view the site and where they can download it, or

2. create a link to the plug-in creator's web page but the visitor is no longer at the original company's web site.

Some solutions to keeping your visitors' attention: code the link to the plug-in so that when it is clicked a new browser window will appear, rather than losing your web page. Better yet, try to obtain direct access to the plug-ins FTP site so that people will only see your web site while the plug-in downloads.

Navigation

The web is a much more interactive experience than a print publication. The viewer controls the sequence of web pages and jumps from page to page using links. As a result, the web designer must organize the content on the web pages very differently from the way one might organize them from a brochure, newsletter, or book. Remember, your web site is not a document your audience can physically hold. You can't assume the viewer has seen previous pages or will proceed to subsequent pages on your web site. Each page must be able to stand on its own. Your audience always needs to be reminded where they are and how to get to anywhere else on your site.

Colours

The advantage of colour on the web is that it's cheap. Technically, you can produce millions of colours on your screen, provided your monitor and video display are a decent quality. The disadvantage is that there are actually only 216 web-safe colors - meaning that these are the only colors that appear the same on all monitors and operating systems without dithering, be they PCs or Macs.

It is important to understand that colours from a print piece cannot be effortlessly transferred to a computer screen. Many print variables - paper thickness, texture, colour, absorbency; inks - are not available for a computer monitor - a convex glass surface producing a screen flicker to project the image you see.

Also, too much colour on a web page can be distracting and counterproductive. The most successful strategy is to use colour sparingly. Adding too many colorful items can create the visual equivalent of noise. Instead, leave room for white space. This will help your visitors focus on the items that are highlighted in colour - a perfect opportunity to showcase your promotional message.

Computer Monitors

A web site that looks clean on a monitor with millions of colours could look dithered and jagged on a monitor with only 256 colors. Colours that appear bright and sharp on your screen may appear dark and dull on another's. A web page that appears well suited for a 17' or larger screen will appear cut-off on a smaller one. Even the operating system can affect your monitor display. Macintosh computers, for instance, have a higher gamma display, and web pages show up brighter on them than on Wintel PCs.

Before making any design revisions, first view your web page on several computers. If you only have one computer, go somewhere off-site and view it. See how the web site reads under poor lighting as well. All of these factors can be observed before reaching an acceptable medium.

Conclusion

A successful web site requires not only individuals who are skilled in their own particular fields, but a cohesive team effort where everyone performs their work with the other partners in mind. For the client, it means trusting in your designer's experience and an understanding of what are the realistic possibilities and limits of the web page. For the designer, it requires switching from the mentality of 'look what I can do,' to 'look what I can do for your business'




Hot* Brand New: AdwareAlert. - Our Highet Converting/Paying Designs Ever! Easy Ppc Sales! Also try SpywareRemover.com. Now with Msn/Goog/Yhoo Tracking!
Save My Marriage Today. - New design now has a 1/50 conversion rate!


Article Index: | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79


More Articles:


1. Perfectly Formed?
Recently I have found myself chewing over the pros and cons of on-line forms with a number of clients, so I thought I would set down a few points about how we really ought to be handling that critical moment when the viewer crosses that all important barrier and becomes a customer – or else clicks away and is lost. I do not suggest that there is a right and wrong to this – I just want to share a few ideas about the way we are soliciting for information from our viewers.Consider; our goal is to n…

2. Bad Web Design: Strange Cursors
I've been to some sites lately which have some pretty fantastic cursors. Youprobably know what I'm talking about - cursors that have little ballsdangling from them, look like a heart or consist of a string of letterswaving as if in the wind.The first time I saw these cursors I thought, 'that's pretty cool, I wonderhow they did that?' The answer was obvious since the cursor required thedownload of a special Internet Explorer plug-in.I see these cursors all over the place. I visit a lot of sites, …

3. Converting Print Advertising For Use On The Web - A How-To By J Hancock
Contrary to the beliefs of some, advertising for web and print are very different. Converting print ads for use on the web is very tricky. What has been very successful on paper may have no impact at all on the screen. When I am asked “How do I convert my print ads to web?” my answer is simple: don’t! Web and print are so vastly different that I believe you should never build your web pages based on a print ad.There are certain rules that web design must follow that simply don’t apply to p…

4. Choosing a Web Design Company for Your Business Website By James Anderson
Now there are many different criteria to consider when choosing a Web Design Company. One of which is, what kind of website is it you need?Depending on whether you want to sell products, just advertise a bricks and mortar business or something radically different, will govern the skill set required of your chosen Web Design Company.Most Web Design Companies will be able to design a simple site advertising a business but may not be very good at constructing sites that use an eCommerce Solution …