Сайт за Уеб и БГ бизнес

Ефективно използване на “бялото пространство ” в уеб дизайна част втора

0

3. Минимализмът не е равен на бяло пространство

Един от проблемите в съвременния уеб дизайн е, че много уеб дизайнери приравняват бяло пространство с минимализмът. Това е просто грешно. Бялото пространство и съдържанието могат да се използват умно за да предадат изчистен и професионален облик на вашият сайт.

Обърнете внимание на Smashing списание например. Този уебсайт е буквално препълнен със съдържание, но все пак те са успели да направят своя сайт лесен за четене и същевременно стилен като дизайн. Постигнали са това чрез внимателен подбор на цветове, текст, размери, както и използването на бяло пространство.

Нека погледнем отблизо:

Забележете визуалното разделение между текст и изображения, между навигационни елементи, както и между съдържанието и страничната лента. Това е най-ефективното използване на бяло пространство.

4.Заглавия или H тагове

Заглавия са чудесен начин да разделите съдържание отделни части. Докато четете тази статия,ще видите два начина на тяхната употреба: H1, H3. Те се използват да се подчертаят определени части от съдържанието разделяйки чрез бели пространства.

Това, което трябва да погледнете е бяло пространство над и под тези заглавия, и как те влияят върху четимоста на текста, върху елементите на които се акцентира. За пример, моят H3 таг има 20 пиксела разстояние от горе и 20 пиксела от долу, така се разделя от текста и H1 тага.По този начин създадени белите пространства спомагат, читателите по-лесно да прочетат текста и да определят, коя част от него искат да научат и запомнят.

Ако проявявате интерес към CSS ето кода който съм използвал за създаване на моя H3 маркер, трябва само да копирате и поставите този код във вашата style.css файла:
H3 {
color:#0C1C2F;
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:18px;
font-weight:bold;
margin: 20px 0 20px 0;
}

5. Изображения

Разстоянието между изображения и текст е задължителен в уеб дизайна. Ако текста е прекалено близко до изображението, то той става трудно четим.А ако е прекалено голямо разстоянието се гуми взаимната свързаност и посланието което носят.
Ето и един пример: използвате следния код за изображение:



За стила на това изображение се ползва клас в CSS :

.imagelist {
border: 5px solid #cacaca;
margin-top: 15px;
margin-bottom: 15px;
}


Белите разстояния в съвременния уеб дизайн

Вие вече трябва да сте наясно защо бяло пространство е необходимо и важно в дизайна на уеб сайтовете.Ето няколко примера от сайтове, които ефективно използват бялото пространство, за да предадат техните послания към своите посетители.

Полезни линкове:

A List Apart: Articles: Whitespace
White Space and Simplicity | Smashing Magazine
web2.0 design style and principles


No related posts.

Related posts brought to you by Yet Another Related Posts Plugin.

Ако тази публикация ви е харесала, моля дайте вашия коментар или се абонирайте за актуални новини и публикации от blogiada.net.