g
Printer Friendly Version

editor  
BellaOnline's Web Design Editor
 

Effective Use of Graphics

When choosing graphics, there are many important things to keep in mind. Graphics can enhance a website when used properly, but when they overpower a website or drag down the load time for the user, graphics-heavy websites may drive potential customers away.

These days, slow loading graphics are less of a problem than they were in days past when many people still had dial-up. Today, most people have a fast connection, but that doesn't mean that load times shouldn't still be considered. Graphics that are still loading after the content has loaded are very distracting and tend to annoy visitors because it gives the illusion of a slow loading website.

People who are surfing for information are notoriously impatient. They want to find what they are looking for quickly and without distraction. Heavy use of graphics, animation, or other overpowering visuals are a turnoff and will result in visitors getting frustrated and quickly clicking away from your website.

Small, clear images that highlight your content can go a long way in helping people find the information they are looking for. A website with a nice layout and relevant graphics that help the eye flow in the direction of the primary content are a plus for web-design. Graphics should not just be pretty, but functional as well. Anyone can slap a pretty picture on a page, but not everyone knows how to get that pretty picture to work for them.

Your graphics choices, from backgrounds, to placement, to images used within the content, should enhance the structure of your website and not overwhelm it. Not every element on your page will require visual representation, so choose only the most important subjects to highlight visually to avoid page clutter. Less is truly more with graphics in web-design.

Background Graphics

Background graphics should never be excessively bright or busy. Graphics directly behind text should be used very sparingly, if at all, because different browsers and devices will display that content differently. What looks clear and easy to read on your computer screen may be impossible to decipher on your visitors phone or device. Content backgrounds and text should always contrast for improved readability.

Bold Graphics

A punch of bright, vivid color or an amazing graphic that catches the eye can be very useful so long as they are not overdone. Some of the best web designs have amazing use of graphics that work as a frame without going into the main content. Complementary colors are then used to tie it all together. One, or maybe two, beautiful eye-catching graphics are plenty. Overdoing it loses the desired effect and can distract from your customers true reason for visiting your website. Use a great graphic and use it well, but keep the primary focus on the message of the website.

Other Considerations

Don't become too dependent on graphics for conveying information. Always have good copy to go with images for those who may not be able to view images.

Simple images like textures and seamless tiles are fast loading and can give a little something to the background of a content area without overwhelming it. Consider using subtle textures and tiles to help punch up a design without getting too “busy”.

Watch for pixelation and other forms of distortion. It looks sloppy and unprofessional. Graphics should be crisp and clear.

Be sure your text and other colors in your layout match or complement the graphics on your page. This ties the whole design together as a cohesive unit. I usually take color samples of my graphics in Photoshop with the eyedropper tool and use the hex-code to plug into the CSS of my design.

This site needs an editor - click to learn more!

Web Design Site @ BellaOnline
View This Article in Regular Layout

Content copyright © 2013 by Christin Sander. All rights reserved.
This content was written by Christin Sander. If you wish to use this content in any manner, you need written permission. Contact Editor Wanted for details.



| About BellaOnline | Privacy Policy | Advertising | Become an Editor |
Website copyright © 2013 Minerva WebWorks LLC. All rights reserved.


BellaOnline Editor