正确使用“留白”属性(留白,留白属性,网页留白,white space,web设)W3POP.COM

正确使用“留白”属性

作者:depthskins 翻译/整理:w3pop.com 发布:2007-04-28 浏览:4384 ::

What is White Space?
什么是留白？

White space is always an active element in any good design; it’s also referred to negative space. White space is always occurring in a design from the moment you open up a blank document, the design has begun with white space. There are two types of white space, the undefined white space, which is what you get when you open a new document, and active white space, which occurs when an object is place in undefined white space.

“留白”通常是优秀网站设计中的一个活跃元素。它同时还涉及到“负空间”。“留白”通常出现于空白文档中，最初的设计总是以“留白”开始。“留白”有两种类型，即：未定义“留白”，出现于新打开的文档中；活动“留白”，它发生于当一个对象被放置在未定义“留白”内时。

Just to clarify a misconception, white space doesn't mean it has to be white because it can be any color whether it is black, brown or white. It’s also up to the designer to make it an important element of design because if not used properly it can be misunderstood for wasted space. It’s really up to a designer to place type and shapes that would create interesting backgrounds as it would foreground.

澄清一个误解，“留白”并不意味着它一定要是白色。“留白”可以是任何一种颜色，如：黑色、棕色或白色。对设计师来说，这是一个非常重要的元素。因为如果使用不当，便会造成误解，以至于浪费必要的页面空间。设计师应该将“留白”的类型和位置进行反复思量，以选择合适的背景色，是指与前景色相容得体。

What is the purpose of white space?
使用“留白”的目的

White space allows:
“留白”的功能：

1. Rhythm
使版面押韵
2. Unity
使内容统一
3. Legibility
增强内容的可辨人性
4. Readability
增强内容的可读性
5. Balance
保持各元素之间的相对平衡

Rhythm: This refers to the flow of elements in a design, whether it is type or shapes. White space allows the reader to easily engage the design without being confronted with too many graphics or type. It allows the reader to no be over powered by the design because there’s enough balance between foreground and background. As human beings, we need space, it’s our nature and this is why we apply this understanding of the human nature in design because first and foremost, you want readers to be comfortable with the design unless its sole purpose is otherwise.

使版面押韵：这与页面中的元素浮动相关，不论该元素的类型和形状是什么。“留白”可以使阅读者更容易理解设计的风格，并避免遇到过多的图形或样式问题。因为“留白”使前景元素和背景元素保持了一种相对的平衡，因此，它可以更有效的帮助阅读者阅读。作为人类来说，我们需要空间，因为它是我们的本质，这就是我们为什么要在设计中加入对人类本质的理解，因为我们的最初愿望就是要设计出能够让人们感到舒适的方案。

Unity: This principle of design is like the director behind the camera. He who directs and makes sure everything flows smoothly. Just like that UNITY is that principle that subtly steers the design, that is, if the designer is paying attention. Unity is responsible for all the elements in design being holistic and in agreement with each other. Even if the idea is to communicate contrast, unity is they’re making the design work because all the elements work well with each other. If type is in contrast with each other, shapes, colors, and balance are all playing their roles to bring about unity in the design.

使内容统一：这个设计原则就如同幕后导演，他在幕后操作，使得整个过程平滑过渡。如果设计师稍微对该原则加以留心，那么他就可以非常轻松地驾驭整个设计过程。“统一”原则使得页面中的所有元素和谐统一，彼此相容。即使这个观点会导致交互上的冲突，它也应该运用于设计工作中，因为这样可以使得所有的元素彼此和谐搭配。如果样式之间彼此冲突，那么形状、颜色和元素之间的平衡将会各自担当自己的角色，并保证设计中的和谐统一。

Legibility/Readability: This refers to how easily shapes of letters can be distinguished usually refers to larger sizes while readability refers to how easily type can be read.

可辨认性 / 可读性：这涉及到该采取怎样的字母类型和字体大小以保证整个文本内容便于阅读。

Balance: Balance refers to the weight of a design based on the objects or elements of the design. By weight I simply mean the amount of elements in the design. Balance can either be symmetrical or asymmetrical. Symmetrical designs are those designs that once divided in half will have the same weight on both sides. Make no mistake that there’s need for the each sides to have the same elements or objects, just as long the weight is even it’s symmetrical and it most cases, it’s identical on each sides. Asymmetrical is obviously the opposite of symmetrical whereby when divided it’s not balanced on each sides.

各元素之间的相对平衡性：平衡性涉及到基于对象或设计元素的权重平衡问题。关于权重问题，我可以简单地指出一些设计中出现的元素的案例。平衡可以是对称的，也可以是非对称的。对称平衡意味着将二者元素的权重比例平分，保证两边各包含绝对相同的元素和对象，彼此之间可以辨认；那么，很明显，非对称平衡与对称平衡刚好相反，它意味着各元素之间的权重比例是不一样的。

White space help creates either type of balance and make them work in an effective manner.

“留白”的合理运用可以保证整个页面布局的合理性，并且使其创建出行之有效的风格。

How is White Space Used?
“留白”的使用方式

Well for starters it can be used in every media of design whether it be web/graphic design, illustrations, abstract artwork or photography, it can be used anywhere.

对于初学者来说，“留白”可以用于设计各式各样的多媒体，不论它是网页/图形设计，或是图像、抽象艺术或照片。“留白”可以用于任何地方。

In web design white space is crucial for legibility/readability. Some designers go overboard and think design is about adding but in fact, it’s about taking away but adding just enough. Some of the cleanest corporate sites have very limited content on the main page and content driven website make sure to place space between texts.

在网页设计中，“留白”对页面的可辨性/可读性至关重要。一些设计师过分喜欢将琳琅满目的元素放置于页面上，并错误的认为页面上的元素越多越好，其实这是不正确的。我们应该保留有用的元素，将没用的元素丢之脑后。那些最整洁干净的公司站点在主页上只放置有限的内容，并保证不同的文本之间留有空白，这可以使阅读更有效。

White space is used the same way in print layouts like magazine spreads the same way it’s used on web. In fact, great web design borrows the entire concept of web space from the printed medium.

就如同杂志的内容布局那样，“留白”在网页的输出布局中也被广泛使用。事实上，好的网页设计借用了印刷品刊物页面空间布局方式的整个概念。

In illustrations and abstract artwork it’s entirely up to the artist. I don’t believe there’s any rule that should be followed in the use of white space. I can’t say someone uses it here or there because they use it where it’s creative.

在插图和抽象艺术品中，“留白”也会被艺术家们运用的淋漓尽致。我认为，“留白”的使用不存在任何规则。因此，我不会迫使某个人一定要在这里或是那里使用“留白”，他们应该把“留白”属性运用于有创造性的地方。

避免使用JavaScript动态导航条的7大理由商务图形设计

正确使用“留白”属性

评论 (0) All