Web Design: Appropriate Use of Images on Web Pages

Perhaps one in all the largest mistakes web page designers make is to misuse or overuse graphic images on web content. Designers become so hooked in to victimisation new technology that they have a tendency to concentrate on "look what we are able to make you" instead of a web page's practicality.

Use of Images on Web Pages
image source

Web page graphics should serve a perform. If a graphic image's solely function is "to look cool," you're unnecessarily increasing the transfer time of your web content. "Looking cool" will ultimately value you extra money and cause you to lose potential customers.

The following list may be a outline of the kinds of graphic pictures that are acceptable on an online page:

Navigation buttons

Used to facilitate guests navigate your site. If designed well, these buttons are often abundant easier to browse and notice than text links.

Image maps

Additionally used to facilitate guests navigate your site. If designed well, image maps greatly raise the visual attractiveness of a web page however will significantly increase the page's download time.


Used for your company or business identity. Logos increase brand recognition and add visual attractiveness to any document or website.

Bullet points

Used to draw your visitors' eyes to the most points of your document. additionally accustomed split a web page jam-packed with paragraphs.


Conjointly referred to as a title graphic. Main perform is to let your guests recognize which website they're on. Adding computer graphics or an illustration to a masthead adds additional visual attractiveness.

Divider lines or horizontal rules

Ordinarily wont to separate footers, classes inside one online page, and list queries and answers.

Background pictures

Used to enhance the visual attractiveness so it would be easier to navigate. one in all the foremost common background pictures may be a sidebar that sometimes contains the links to the opposite pages in your website.

Headings (text graphic)

Ordinarily used to preserve a font that a lot of folks don't have on their computers.


Ordinarily used to build your web content appear additional personal and additional invitatory. Visitors' eyes are naturally drawn to photos of individuals. an absolute necessity to showcase merchandise on products e-commerce sites.

Web Designing Tips

All graphic pictures on your website ought to match in color, typeface, and lighting tricks. as an example, the text all told of your navigation buttons ought to use a similar font and have a similar special effects on them; such as a hover effect. Your navigation buttons, divider lines, bullet points and mastheads look best if they're designed using one amongst the colors in your emblem.

For a very professional-looking web site, the minimum set of graphics on web content ought to be a group of direction graphics, a logo, bullet points, and set of mastheads. If this set of graphics doesn't considerably increase a page's transfer time, then you'll be able to add different graphic pictures to boost your website. the overall rule is to keep web content size between 40-60K. If you're a graphic designer, artist, architect, or computer user, a 75K online page can still provides a comparatively quick transfer time on a twenty eight.8 Kbps modem.

Any additional graphic pictures on your web content ought to serve a perform that's directly associated with your business. as an example, on a website, you'll be able to have illustrations serve multiple functions:

  • If a design firm has skilled illustrators in its workers, they ought to showcase this talent in some kind throughout the net website.
  • Illustrations may serve a direction perform. In some websites, you'll be able to tell that section of a website you're in supported the illustration shown.
  • A talented net graphic designer will design graphic pictures that download quickly and look smart. Graphic pictures ought to be sized down while not losing the integrity of the graphic image.

Remember, graphic images are primarily accustomed enhance an online pages perform. If graphic pictures significantly increase your net pages' transfer time, you'll got to either size down the graphic pictures, replace them with smaller pictures, or replace them with the hypertext markup language horizontal rules, default bullets, or colored heading text.

About the Author /


  1. Blogs that have quality information like this are as precious as gold. You have given me much to think about in this blog. Thank you.
    Web design Birmingham

  2. Great Post! Images Speaks better than words specially if your website is selling products you have only got 8 seconds to sell it. Images always speak louder than words, gives and easily and direct message about whether a product or service.Create small images in size in order to avoid slow website loading as you mentioned before. Use adobe Photoshop to minimize the size of your images. Always remember that speed matters as a key factor from an SEO point of view which cannot be neglected.

    Ann Daniel



Follow by Email


A blog for graphic design inspiration, resources for graphic designers, and provides beginner's guide to graphic design. learn more..