Laying Layout Foundations

Makes no difference whether you're a pedant or you prefer a chaotic setting, your eyes still function in a certain way and you process visual information in a certain way which you have in common with most of the world. The eye likes a certain amount of order. Once you structure a page you can add as much noise and color as you want. The stronger your foundation or in this case, your page structure, the more you can add and play around with it without ruining the effect.

 

Contrary to what you'd expect a symmetrical division isn't the best kind. Most pages are divided into one third vs. two thirds. Web design inherited this asymmetrical division from the classical age. Take a look at David's famous neoclassical painting. If you were to take a ruler and draw a line across the canvas marking the distinct divisions you'd end up with a straight horizontal line marking the floor line in the painting, dividing the page into one third and two thirds above. Also, notice the arcs dividing the page into three distinct areas, and each third consists of a different element in the story of the Oath of Horatii.

 

 

Browse through many different websites. You'll notice that even the smallest line marking a differentiation between one area and another is meaningful. It gives the design a shape and helps the eye focus. Leading us to the second point.

 

Control your viewer's eyes and lead them to focus on a specific point. There are many different ways to achieve this effect and this is also part of the art of design. Notice how in Delacroix's painting 'Liberty Leading the People', your eyes automatically fell on liberty's raised arm, holding the flag. This is not because of any lack of other points of interest but because of a combination of coloring (the light background), movement and location on the page. Choose an area on your web page that will send off your prime message. It’s the design of the rest of the page that will make this area more noticeable and potent, either by being smaller, darker or less colorful. 

 

Liberty Leading the People - Delacroix (1830)
 

One of the easiest ways to create dominance in one part of the page is to use a larger font. This is an accepted and acknowledged format – called a title. The impact is created in relation to the size of the other fonts, so if you want to create a real differentiation and have your title stand out, make sure the rest of your fonts aren't competing. Most of the free Flash templates already implement this simple principle.

 

Have you ever landed on a web page you simply couldn't understand? Everything was all over the place, lots of colors, different styles mixed together with pictures and fonts. Eventually your eyes just tire and you give up.

 

Creating a unified web design, or rather a web design that has some form of unity is important no matter which type of website you're creating. Unity and consistency is achieved by choosing a specific color scheme and sticking to a specific design style and layout. The extent to which you stick to these rules of thumb depends on the type of website you are building. For example, if you're building business website for an accounting firm you may want to confine yourself to 2-3 colors max in your color scheme, whereas an artist's website or a personal website would probably do well with more color and a looser design. Even so, there should be some sort of connection between one page and another.

 

Where you put your navigation is actually one of the more important decisions you will be making regarding the design your free Flash templates. In the west, where most people read from left to right, the menu is most commonly situated on the left hand side of the page. This is because research shows that in most cases people's eyes will first fall on the top left hand corner of any page. This is why most website's are designed so that the navigation is either at the top of the page or on the left hand side. Whether you choose to swim with or against the stream is your choice, but keep this rule of thumb in mind. If you decide to create an alternative design, make sure your menu is still noticeable and that each link on your page is clear. A faulty navigation will take your website down faster than you can say "I love Flash!"

 

My Personal Animated Site
 

Make your website a visual experience. This is one of the greatest advantages of using Flash for your website and of using free Flash templates in particular to overcome the hurdle of the initial design process. Take a look at the Flashy example below; the 'Personal Animated Site' takes full advantage of the great programming code used to create it to make something fun, unique and colorful. Of course, this may not be appropriate for every type of website, but keep in mind the options and the advantage of creating something that will catch the eye.

Also, if you have lots of texts divide them into sections and categories, separate them with pictures and make sure that they are not overwhelming. Don't forget that a picture is worth a thousand words.

Good Luck!