| First, a caution: don't overload your website with | | | | as you don't overdo them or create a page that |
| flashing images, loads of different fonts (or font sizes | | | | takes forever to load. |
| or font colors) and text swooping in from all sides. | | | | 3. Background Images - with a little imagination you |
| Keep your web site design simple, and never lose | | | | can frame your page with images. All you have to do |
| sight of what you want your visitors to do when | | | | is add columns or rows or a combination of the two |
| they arrive. | | | | to your main table and fill them with appropriate |
| With that said, images can quickly spruce up an | | | | background images. For example, if your web site is |
| unappealing website. This is true even if you do | | | | about organic gardening, you might add a left-hand |
| nothing more than add an image to your header and | | | | column and a bottom row to your table. In the |
| one to footer, and another to break up the | | | | bottom row, you can use a bean plant as the |
| monotony of your text. But the proper use of | | | | background image, having it begin to grow vertically |
| graphics can add even more appeal to your pages. | | | | at the left corner, where the left-hand column's |
| Here are some quick web page design ideas focusing | | | | background image is a continuation of the plant |
| on graphics: | | | | growing up the side of the web page. |
| 1. Swap Images - when your cursor passes over one | | | | 4. White Space - often referred to as negative |
| web object, such as a button, it triggers the | | | | space, is simply the open space between the graphic |
| swapping of another graphic. For example, if I pass | | | | elements and text elements on your website. This |
| my cursor over a button that says Spain, when the | | | | includes the space between words and paragraphs, |
| current graphic is Canada, then a Spain graphic would | | | | around images, etc. The reason it's important to |
| replace the Canada graphic as long as my cursor | | | | mention here is simple: white space not only gives |
| remains over the Spain button. This is done using a | | | | your web pages a cleaner look, it makes the |
| simple JavaScript, and can be quite powerful when | | | | experience of reading the content much easier on |
| used properly. | | | | the eyes. Don't overlook this important element of |
| 2. Rollovers - are just another form of a swap image. | | | | web page design. |
| In this case, a primary image changes to a secondary | | | | There's no question we'd all like to have a great |
| image when the cursor passes over the image link. | | | | looking website, and hopefully these web page design |
| Generally, when the cursor moves off the image, it | | | | ideas have been helpful. However, the most |
| reverts back to the primary image. Using our | | | | important thing to remember with good web site |
| previous example, if your cursor passes over a blue | | | | design is this: less is better. Don't overdo your |
| Spain image button, it changes to a red button with a | | | | graphics. Add them to your website layout as |
| different Spain image. Again, this is accomplished with | | | | complementary elements, not as attention grabbers. |
| a simple JavaScript. Rollovers add a nice touch as long | | | | A little restraint goes a long way. |