If you have a website, it needs to grab attention. You have to catch a visitor's interest and make him or her want to delve into your site. Otherwise, the site won't do you much good, no matter how much traffic you're getting.
If visitors land on a page that is visually uninteresting, you will fail to capture their attention. If everything on your pages receives the same amount of visual importance, visitors are likely to be bored and unfocused.
So how do you make your site stand out visually? Employ the principle of contrast. The principle goes like this:
如何设计视觉效果突出的网站呢?可以运用对比原理,具体运用方法如下:
To create strong visual impact in your pages, make some things stand out. Big time.
创建具有视觉冲击力的网页,突出某项内容,这是最好的方法。
Add variation by visually emphasizing differences between items. If two elements don't look the same, make them look really different. If something is important, give it extra visual weight.
Contrast works by creating sharp distinction between two items. The end result is to emphasize one item over the other, which makes that item stand out. This adds interest to your pages. It also helps organize and prioritize elements, and it focuses visitors in the specific direction you want them to go.
When you use the principle in your website, visitors are immediately drawn to the item that has the most contrast from everything else. By using contrast, you can keep your visitors from getting distracted and wandering all over the page. You'll be able to keep them tuned to the most important things.
If your pages don't use strong contrasts, they will appear dull and uninteresting. A page that doesn't have distinctions between elements lacks focus, because there is no clear place for the eye to stop. It's much harder for visitors to get excited about a page that looks boring than a page where certain elements leap out and capture interest.
How can you use contrasts? Here are a few ways: 如何产生对比效果呢?下面介绍几种方法:
1. Color 1. 颜色
Color is a powerful way to establish the importance of one element over another. If you need something on a page to stand out, infuse it with some vibrant color. Usually, you should make it a brighter or stronger color than everything around it. You can do this by changing the color of the text, by placing a colored background behind the element you want to emphasize, or using a brightly-colored image or button.
Using contrasts in color doesn't always mean you need to use bright or "loud" colors. If the rest of your page uses subdued colors, even a gentle color contrast may be sufficient.
If you're going to make a contrast in size, make a serious contrast. Most people do not make size differences significant enough. Failure to make a strong distinction results in a page that looks cluttered and messy.
The most common place to use size contrasts is in text. For example, when you make a heading bigger than your body copy, you've used a size contrast. However, you can also contrast size with other items. If you have a variety of pictures on a page, you can make one significantly bigger.
You can create contrast by varying the direction (horizontally and vertically) of elements in a page. This contrast is more subtle and not quite as common as color and size.
你可以通过改变方向产生对比效果(横向、纵向都可以),这种对比更微妙,不同于一般的颜色与尺寸对比。
Contrasting direction doesn't necessarily mean to turn a word on its side so it is pointing upward. You could do that, but there are other ways that don't impede readability. You can contrast a long horizontal header that spans the page with two tall, narrower columns of pictures or copy underneath it. You can contrast a thin vertical column of text with horizontal rules (dividing lines) to separate different parts.
For example, take a look at Emoryadventist.org. Notice that the header at the top is wide and the four columns of text are narrow and are divided by vertical lines. The page would be much less interesting if everything on the page had a horizontal direction.
Finally, two important reminders on using contrast:
最后,运用对比时,记住以下两点:
First, if you emphasize everything, nothing stands out. Be careful not to use so much contrast that your page is overpowering or cluttered. Contrast has to be used wisely in order to be effective.