Pattern as a page background


  1. Create a subtle pattern from Illustrator.
  2. Fill entire "pattern-bg.html" page with the pattern image.
    (may apply the pattern image for the body background image)
  3. Use HTML and CSS to control the background, and repeat the value.

Attention:

  1. Page Size : In the "background.html" page, set up a behavior of open browser window to open a new window with 750 X 550
  2. Contrast : Choose a subtle pattern for a background image
  3. Text Color : Choose a right text color and make sure a legible content above the background.
  4. Text Content : Copy/paste the content on this page or paste your own content.
  5. Image Format: Vector based element (save for web: gif)
  6. Site Root : Put the "texture-bg.gif" file into the image folder,
    then edit your site.

Using subtle and soft textures to create clean web designs with an impressive visual impact. The right image with a good use of typography can generate a simple and unique web layout.

A pattern must go with the overall style of the website, or it could be rather distractvie and annoying.