Using seamless background tiles on web pages

Return to Citrus Moon

Return to tile-a-day

Return to Tips

email citrus moon

Our first tip is really a collection of different ideas about how you can use background tiles on your web pages, plus one major rule. To get the rule out of the way first, look here to see why using type over backgrounds is usually a bad idea, and when you use my tiles, which are very strong, is almost always a bad idea! Like any rule, this one can be broken, especially if you want to create a special effect like I did below, but for good, readable text one should be extremely careful with text colors, background images, and background colors. (The text below is a sort of visual joke, because "wallflowers" are supposed to just sort of fade into the background...)

For these examples, I've used the "Wallflower" tiles from January 30. Here is one idea for an opening page design, and here is another. I also kind of like this layout that I didn't have time to make into a page.

For inner, text-bearing pages, I have this possibility for a page with a sidebar menu, this example of a page that contains a rather short text (an introduction, a daily journal entry, or perhaps a photo slide show), and this idea for a page that will contain a lot of text and/or images while still carrying some element of the site design. These are just a few thoughts, and I will be adding more tips for using background tiles on your web pages in the future, as well as (if I can find the time!) something about using tiles to decorate text, so be sure to check back every now and then!