Monday, August 30, 2010

The Importance of contrast in web design.

Contrast is an important element in a design. It helps create a visual hierarchy, establishes a separation in between figure and ground, creates depth and many other things. In web design contrast is an important thing to think about, if nothing more than for readability purposes. For example This Site uses gray on white text that is a lot harder to read than This Site that uses black on white text.
Therefore, if for no other reason than the readability of the text, make sure that there is a consideration of the color contrast between the text and the background.
NOTE: color contrast is not the only contrast consideration that must be made, there are many other types of contrast that must be considered. For example think of the contrast between the size of the headlines on a page and the body of the text.

Keep Web Designs Simple

Often when developing a design for a web page, people without graphic design experience (and some with) tend to put to much content into a page. This makes the design hard to navigate visually and literally. To many pictures, flash animations, videos and to much text makes for a confusing design. For example Evans Politics has to many visual elements. It is confusing and overwhelming to the eyes. Every design should offer some visual relief to avoid overwhelming the viewer with content. Another example of this can be found at This site. My previous post stressed the need to use whitespace in your web designs. Negative space can be used in a web design to offer the viewer a "Visual Rest" and will help to make a web design less confusing. For Example, well to tell you the truth after searching for several different key phrases including, "design" and "less is more", all I found were web pages that had every div filled with something. Please let me know if you find a good example of a web design that does not overwhelm the eyes and doesn't take forever to load. Some examples such as This page are simple and easy on the eyes but they take to long to load.
Therefore, try not to overload your web designs with content not only because it can overwhelm your viewers eyes but also because it can be hard to establish a visual hierarchy with such a design.

Sunday, August 29, 2010

Whitespace in Web Design

Often a web designer will know to use whitespace in their design as a design element rather than filling the entire space with content such as pictures or text. What must be remembered is that whitespace is content.
Everything that an audience is viewing is content that they will respond to. In other words a blank page is something that we see just as much as a page filled with other visual elements. Whitespace can be used by designer to create asymmetrical balance, lead the viewers eyes through a design, create contrast and many other things that can help a design look professional.
On This site the whitespace and the shape of it is used to create not only a dynamism but also to create asymmetrical balance. On the other hand if the whitespace is ignored then it can cause a site to look amateur. For example in my opinion on Dogs.net the space between the header and the body of its text looks so bad it seems like a mistake.
Remember that white is just the default value of a web page and of most paper but that does not mean it is not a value. In RGB (Red, Green, Blue) which is the color gambit of computer monitors the value is expressed as #FFFFFF. So it should be treated as a value.
Therefore, make sure that when you create a design remember that your audience is seeing the negative space as well as the other content that you are uploading.

Symmetry VS. asymmetry in web design

Symmetry is generally discouraged by visual design professionals because it can makes a design static. Lacking visual dynamism is generally not the best way to hold a viewers interest.
But how do we handle this if the audience is an active participant in what they are looking?
Symmetrical designs of web pages are not always the worst. Sometimes the less than professional look of a design is the visual message that needs to be sent. For example craigslist , the audience being people who are usually not design professionals, who want to find the products and services of other people who are probably not design professionals. It is an important in the design process to consider the audience and there expectations. At other times the audience expects a design that looks professional because a professional looking design will increase the viewers trust in the company's professionalism. There are many scams on the internet so usually it is a good idea to have a web site that does not look homemade. If a viewer goes to a page like This and sees its they may have questions about supplying such a company with their credit card information.
A professional looking design has many elements that make it look professional. One of those elements is the more dynamic look of an asymmetrical design. For example Audi has a site that uses the whitespace in there image to create asymmetrical balance which makes for a more professional looking design. Even if this site was not the home page of a company that many people already know, the look of it would create trust in in the company.