1. Фона на сайта - трикове за по-добър уеб сайт.

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

Фона на сайта (Background)

Първото правило за цвета, който ще служи за фон на вашата страница, е той да не е ярък, за да не уморява окото. Типичен пример за ярки и ужасни фонови цветове са #FF0000, #00FF00, #FFFF00 и т.н. Може би ще се запитате кой нормален човек би ги ползвал, но за моя изненада това са доста сайтове!

Преди изборът ни на цветове беше ограничен, защото повечето видеокарти и монитори не поддържаха повече от 256 цвята. Сега обаче тези карти са рядкост. Затова препоръчвам по-често да се обръщаме към цветовите миксери на програмите за дизайн (Dreamweaver, Photoshop и др.), за да извлечем максимално добър цвят. Цветовите миксери ви предлагат свободно и същевременно много точно да изберете цвят. Точно тези миксери имат едно малко прозорче, където са вижда миксираният цвят. Той може да ви се стори много добър, но на голяма площ цветът може да е ужасно уморителен. Затова трябва да се правят експерименти до постигане на най-добрия ефект.

Най-общо има два типа цветове - тъмни и светли. Ето един тъмен цвят #435C7F и един светъл #D6E0ED. И двата не уморяват окото.

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

Старайте се да използвате по-бледи цветове, но не трябва те да се като "изпрани".

Друг много често използван отскоро ефект за фона е градиентът (преливката). Това е малко по-рискован, но и много ефектен вариант, ако се направи както трябва. Правилата в цвета при градиент за фон са същите като тези за едноцветен фон, но разликата тук е, че има и втори цвят. Внимавайте с градиента поради 2 основни причини.

1. Трябва и двата цвята в градиента да си подхождат. Тоест, ако градиента е син трябва да има светло-синьо, което да прелива в по-тъмно. В никакъв случай не трябва да се смесват два коренно различни цвята. Например синьо и жълто.
2. Да се зададе no-repeat за фона, за да не започне да се повтаря градиентът отново при по-дълги страници.

Ето малко примери за добре направени градиенти за фон:
http://ntv.bg
http://www.macromedia.com/

Аз мисля, че тази мода беше започната от Macromedia и техния сайт.

И най-важното правило при ползване на градиенти за фон е:
Трябва да има максимум два близки цвята и никога трети!Смесването на два различни цвята прави трети в средата, където се засрещат цветовете. Например синьо и жълто прави зеленикаво в средата.

Последният вид фон, за които се сещам е графичният.
Имам предвид gif-че, което се повтаря многократно и се слага за фон на сайта. Правилата за това да не е натрапчив и да не уморява окото отново важат и тук.

Добре е, да не кажа и задължително, картинката, която трябва да е за фон, да е малка и да се повтаря многократно, без да личи къде се съединяват картинките.

Много популярни са щрихованите фонове. Като този например: http://www.jerryavenaim.com/ Получава се много добър ефект, но са станали малко досадни.

Когато се слагат диагонални линни като щрих, е добре да са възможно най-бледи. А при хоризонтални линии за фон е задължително да са много бледи, защото погледът се премрежва много лошо, ако са ярки. Не ви съветвам да ползвате вертикални линни за фон. И без това един сайт е предназначен да се превърта надолу и едни вертикални линии ще изглеждат ужасно.

Може да ползвате за фон каквото искате. Но снимките, които не могат да се съединят и да създадат ефект за нещо цялостно, не са добра идея за фон на сайт.

Ивайло Георгиев (iDesign-er)

добра статия да ви кажа най-добрият миксер за цветове е ColorImpact 2 ...

Това е от преди маса време, но върши работа и като миксер (първо "link both") - http://606u.dir.bg/xgui/

Хубава статия
ясно ми е използването на фоновете, но не ми е qсно как се прави фон с gradient . Всмисъл , не разбирам как точно се прилага, мисля си можеби трqбва да направя накакво огромно изображени на photoshop, да му сложа градиент и да го направя фон , но ако сайтът е прекалено дълъг и съм задал no-repeat няма ли да остане бяло поле надолу ?
Можеш ли да ми обясниш точно как се прави gradient на сайт ?

има лесен начин с филтри, но май работи само при IE

Това би трябвало да работи навсякъде.

Така преливката ще се повтаря настрани, но не и надолу.

П.С. Радвам се, че има интерес към статията. Дано имам време да напиша и по други теми нещо.

Малко пояснение за кода. Например преливката започва с бял цвят и завършва с черен. Селектираш си ивица от преливката с width=1 и height= на колкото си искаш например 600 и тази ивица си я запазваш като background.jpg . Клед това за фон на страницата (bgcolor="") си слагаш черен цвят.

А какво точно трябва да представлява картинката ( background="images/background.jpg" ) ?

Това е само пример.

Нека не разводняваме повече темата, защото основно е статията и може да има малко пояснения, но да не става чат, защото никой няма да иска да чете тема от 3 страници.

В случая със сайта на Нова ТВ направена е преливката , изрязан е gif по вертикална линия, за да се повтори на ширина (настрани), кръстил е тая картинка някак си и я е повторил - за предпочитане чрез CSS .
Аз лично бих сложил тая дължина на gif-a в <div></div>
самия bground (основния) ще го дам с цвета на най-долния цвят от преливката.
За целта ползвам ColorMasterPicker - препоръчвам Ви я , спестява време и нерви и не е нужно да зазубряте някви кодове за цветове . И Voila ! Ето го приятния Bground на Нова ТВ!