Web Idea Center
Search    

What's New | IT Help Center | UD Home | Comment  
Home How to Images and Templates Read More Get Help

paper Images & Templates
    IMAGE & LOGO LIBRARY > UD DO-IT-YOURSELF GRAPHICS > BACKGROUND PATTERN

BACKGROUND PATTERN

You can use a background pattern or image to customize your page, but be aware of legibility issues. Your text may be very difficult to read on top of a pattern that is too busy or brightly colored. The use of background patterns may also increase the loading time for your page.

You can create your own pattern in an image-editing or paint program. There are also backgrounds available on the web for downloading, though many of them are too busy or bright to be of much use.
Some guidelines for choosing background patterns:
  • Use low-contrast color combinations.
  • Use a small image size for your pattern tile (100x100 pixels).
  • Soft, muted textures work better than hard-edged geometrics or photographic images.

To define a background pattern in HTML, use the "background" attribute with the body tag. For example,

<body background="background.gif">
Example

Legible background pattern choice:

backgroundbackgroundbackgroundbackgroundbackground

Text is easy to read against this muted, pastel background pattern. This is the HTML tag used to define this particular background pattern:

<body background="images/legbk.gif">

Illegible background pattern choice:

backgroundbackgroundbackgroundbackgroundbackground

Text is very difficult to see against this dark, busy pattern. This is the HTML tag used to define this particular background pattern:

<body background="images/illbk.gif">

University of Delaware