Home

Website Evaluations Evaluation Testimonies Website Redesign Web Design Portfolio 1 Web Design Portfolio 2 Web Design Portfolio 3 Experience, Testimonies Web Design Rates Web Design Quotes Christian Web Designer

Web Design Tips

Menu Samples HTML and CSS Tips Align Images with Text Form Buttons - No Space Add Borders to Boxes Red Hearts in CSS

SEO Scams

Internet Hosting Scams How To Move Off Free Host Web Page Hijackings How to Find 302 Hijacker Report 302 Redirects Stop Content Theft How to find Scraper Directory Link Submission Scams Domain Registration Scam Triangular Linking Schemes

SEO Tips

Search Engine Faq Submitting to Search Engines How to Find Backlinks Backlinks to Avoid How to find Web Designer Keyword Ranking Strategy Keyword Ranking Faq Directories that Pass PR Directories to Avoid HTML Validators Dynamic Vs Static Pages Technology Blockers

Graphics Tutorials

Fireworks Tutorials Straighten Photos Vertical Background Tutorial Drop Shadow Tutorial Animated Tutorial Photoshop Tutorials Embossed Images Textured Background Feathered Edges Tutorial Gradient Background Tutorial Textured Background Tutorial

Graphic Designs

Free Graphics Landscape Photos Winter Landscapes Image Manipulation Logos Designed Logos Designed 2 Animations Graphics Portfolio Mountain Panoramas Textures and Backgrounds Applet Displays Collages Web Safe Color Chart

Web Design Backgrounds and Textures How to Tips

The following backgrounds and textures were designed for use as backgrounds on web pages. The colors often found in textures in graphics programs can safely be ignored unless you really like the color provided as colors can be manipulated in a good graphics program. Choose the background tiles mainly for their texture.

How to make a Plain Color Background

In order to provide a plain color background you just need to put the code for the color in your body tag , table tag or wherever color can be specified, as shown below. Be sure and include the Pound sign (#) and quotes around the number. The hexadecimal color number for web safe colors can be found in the chart below.

Web Safe Hexadecimal Color Chart

The colors in the Web Safe Hexadecimal Color Chart should display correctly on all browsers. You can use colors that are not on this chart but then you may get a weird color on some browsers that don't support that color so just because it looks good on your computer doesn't mean it will everywhere else so best to stick to these web safe colors for background and font colors. Color Picker is a NEAT online tool that allows you to pick a background color from a web safe color chart, then choose text colors, link colors, compare them to a graphic, etc. and see them displayed online as they are chosen. Color Picker also provides the related code to put in your body tag. It also has a downloadable version to use offline

Use Contrasting Font and Text Colors

Please keep in mind that text colors on a light background will need to be very bold and in a dark color, or very light color if on a dark background (if you want a background in a plain color use the color chart above also). Also keep in mind those with color blindness, i.e., medium green on a medium red background may look all the same color to someone who is color blind.

Manipulating Background Textures

The first set of textures shown below are of waves. This texture, along with many others, can be changed into different colors. The texture samples below will give you an idea of what can be done with the images. You can see how the gray wave pattern looks as a background with text over it on Endtime Poetry.

How to apply a Background Image to your Web page

Put the following code for a background image in the body tag of your page:

background="Put_Name_Of_Image_Here.jpg"

Or put the following in your CSS file for a background image:

background-image:url(BackgroundImageNameGoesHere.gif);
background-repeat:repeat;

If you've done it correctly this one image will spread horizonally and vertically throughout your page. Click on the images below to see how each image looks on a full page.

Texture Samples

Blue Wave Texture

Blue Wave

Gray Wave

Purple Wave

Ice Crystal Background

This background was made by taking a picture of ice crystals on a window.

Ice Crystals

Ice Crystal light

Ice Crystal pale

Crystal Rock Texture

This image was made by scanning a crystal rock.

Crystal Rock

Crystal Rock Lite

Crystal Rock Pale

Red Brick Texture

Small Red Bricks

Small Gray Bricks

Small Creamy Bricks

Parchment Texture

Gray Parchment

Light Gray Parchment

Very Light Gray Parchment

Cream Parchment Texture

Tan Parchment

Cream Parchment

Light Cream Parchment

White Marble Texture

White Marble

White Marble Light

Very Light White Marble

Also see How to make a Speckled Texture with the Noise Feature in Photoshop

Using an image of a Horse for the Background

The example to the right is a faded picture of a horse designed to go under text. In Photoshop you go to Image/Adjust/Brightness Contrast and adjust the setting until it's light enough. The example shown here is a thumbnail of the original which was large enough so only one horse appeared on the page.

Using Initials for the Background

The example to the left is initials with the initials faded enough so they won't interfere with the text on the page.

Using a landscape scene for a Background

The example to the right is an image that covers the background of a small page and tiles to the right with text overlaying the image. The contents of the page can't be any longer than the image and the text needs to be placed where the darkest parts of image won't distort the text. The image needs to be able to tile to the right but not downwards. A landscape scene with lots of sky will usually work for this.

Also see several tutorials on designing different
backgrounds on the Background Tutorials page

If you would like a custom designed texture or one of the above textures in another color or a custom designed background tile please contact the webmaster for rates.

Other texture and background sites

John C. Fish's Backgrounds and Textures

Desktop Publishing

Infinite Fish

The images, photos, animations, logos, etc., i.e., all grapics designed by Lori Eldridge utilized on this site, are under the exclusive ownership of Lori's Web Design. You can purchase ONE TIME RIGHTS to use them one time only on your web site or other medium. Please contact the webmaster for more information.