Friday, January 12, 2007



WHITESPACE


Whitespace - negative space is the portion of a page that have nothing in it. Whitespace is also the space between graphics, margins, gutters, space between columns, space between lines of type or figures and objects. Whitespace plays an important role in design, especially graphic design. It enables the balance between the negative part and the positive part (the none - white ) in a page. The use of negative spaces is the main factor to aesthetics composition.
Let's see these 3 images and decide which one is most attractive :



This image doesn't have whitespace. The image occupy all the page . There is not many negative space and also, the contrast in this image is not effective used. This image give me the traditional look in the past.


The second image, there are whitespace in the margin but the negative spce is not much.

The third image, there are many whitespace, the contrast in this image used effectively. This is the most attractive and creative one.

Maybe we don't know much about the effect of whitespace. In VietNam, I've seen too many kind of flyers that try to put lots of information into one small piece of paper. They do that to save the money but they don't know that when they do this, this kind of paper doesn't attract viewers. The font size is small and there has no whitespace. The paper turns into sth that look like a mess of information. Viewers cannot sort out the most important information that they try to present.

Let's have a look at these two kinds of text and see how :

This is image which has whitespace. We can easily see the text because there is strong contrast between the negativespace and positve space. This kind of design is simple but effective.

This one, there are lots of text and not much whitespace. Too much information is presented. We can't sort out which is the most important one. It is not effective.

Afterall, why is whitespace so important?

One of the reason is the text needs room to breath. When the text is so crowded and there is no whitespace, it also ive us feeling crowded and crampled and also tire our eyes.

One of the most important thing in design I think is that : We shouldn't try to put too many thing in our paper or design. Too much information is not equal to enough. The most effective way is that we have to try to find the most important quote or information or image to put in our page. Remember " Less is more" . This can be demonstrate cause you might easily find this kind of advertising in well - known magazines or newspapers like the Wall Street Journal or New York Times. You might find full page ads with almos nothing else except one quote. And yet, you might find it is impossible to skip that ads when you browser through the paper. That's the power of whitespace.

So, in design, especially graphic design, do think about white space and get used to it.

Reference:

http://www.sheriftariq.org/design/whitespace/

http://www.logoorange.com/white-space.php

Sunday, January 07, 2007

WEBDESIGN MISTAKES

There are some design mistakes that appear commonly and they also make people to complain. We must know these commonly mistakes in order not to do it again.
1. Legibility:
Bad fonts cause trouble. Small font sizes or low contrast between text and background make it hard to read.
Be careful when using text , color .

2. Non-Standard Links
The link are not obvious cause trouble when interactive.
We should use colored and underlined text to indicate text links. It will be better if we put small explanation below the link to clarify which page the link will lead to.

3. Flash
Using flash in webpage cause big trouble. Although someone might think that flash is useful, however, when put it in a website, it flickering which will make the viewer confused and annoyed.
Don't use flash in a website. Try to make the content much more interesting. Remember " Less is more".

4. Unsuitable content:
Content written for the Web is not suit, not use common language or the content is too long and boring.
Try to make content short, scannable, interesting. Use common language rather than made - up words.

5. Browser Incompatibility
Don't turn away customers just because they prefer a different platform.

You can find more webdesign mistakes by following this link http://www.useit.com/alertbox/designmistakes.html. The mistakes above are which I found most commonly.

Reference:
http://www.useit.com/alertbox/designmistakes.html

WEBPAGE DESIGN'S BASIC RULES
Before we go out of the box, break the rules to stand out from the rest, we need to manage the basic rules. Beside the Design Principles, there are some more specific rules applied for webpage design which I found useful:
+ Page layout:
- Do not put something into two much boxes in one page to attract viewers. Remember to do this in moderation because if you put too much boxes in one page, it will decrease the unity of a page and make the page disorder.
+ Colour :
- Use contrasting colors to increase the readability. When we use enough contrast between the text and background make it easy to read. It is better and in most use with light background color and dark text color.
- Use complementary colors to highlight the important part. But remember that do not use too much and not use it on the whole page because it havoc our eyes.
- Use color sparingly. For impact, designers choose to create their design on more than a single color. But color thrown around everywhere also loses its impact. For maximum impact, use color on headings, and the most important words in headings.
+ Repetition :
Generally, webblog all have the same page elements : a header graphic and text, a main column, and a sidebar. We have to arrange these elements in repetition in order to control hos the user's eyes is guided down the layout. We use repetition to put the information into groups, highlight the key words. Repetition increase the unity , cohesion of our page and also increase the readability.
+ Proximity:
Similar or related elements are grouped together to form a cohesive whole. Those that aren't related should be kept separate. This enables viewer to glance at the page and immediately know the relationship of page elements.
Reference:
http://www.thinkvitamin.com/features/design/how-crap-is-your-site-design
http://www.phuketsolution.com/web-design-article/basic-rules-on-page-layout-and-color.html

HOW GOOD IS GOOD
(part2)
I've found a website demonstrated that a good web design makes a great impact on the viewers. In this, they show us 3 different layouts of a website which have the same meaning. The first one is the original website, the second one is modified a little bit and the third one - they change nearly 50%. Let's have a look at these 3 layouts first and give your opinion which is better .


pic1
This is the original one

pic2

In this layouts, they change a little bit. Can you recognize the different? They increase the size of texts and leadings, highlight important words in order to increase the easiness when viewing it. These details strengthen the layouts.

pic3

In this layout, they also divide the information into 2 separate columns. They make this layout different from the regular layout.

Actually, when I first look at these 3 layouts, I like the third one most , and the second one.

I don't like the first one because the text size is quite small which make us hard to read. The information is not arrange effectively. It doesn't attract me much.

The second one, they fix the weak points in order to increase the effectiveness of the design.

The third one, I find that they divide the information into 2 columns. Although this layouts different from the regular layout, I find that this quite good.

However, the result is not like my opinion. Depend on their research on the impact of 3 different layouts, pic2, with the minor copy changes, resulted in a 15.57% increase in sales—that represents a big revenue jump for a site with high sales volumes.
pic3, in which we changed the regular, one-column format into a two-column format, resulted in 53.28% fewer sales.

What a surprise! Pic 3 appear to be the worst layout. That’s an astonishing reduction in sales and revenues, resulting from a design change that was intended to improve the performance of the page.

Here are what I've learn:

- Let's try different version when design something, find the weak points and try to improve them. And one important factor is that the latest one is not always the best one. May be the first version is the best of all.

- The result is not depend on us - designer.We don't know what is the best design until it is test. Our readers and viewers will show us which is the best design. Maybe the result is not like what we expect but the end result is that we will become much better web designers.

You can follow this link to read more :http://alistapart.com/articles/designcancripple

Reference:http://alistapart.com/articles/designcancripple