Уеб цветовете са цветовете, използвани при проектирането на уеб страници, както и начините за описание и изброяване на тези цветове.

Има няколко начина за избор на цветове за части от уеб страници. Цветовете могат да бъдат посочени като RGB триплет (набор от три числа) в шестнадесетичен формат (шестнадесетичен триплет). RGB триплетът може да съставлява 16 777 216 различни цвята. Много често срещани цветове могат да бъдат избрани и чрез общоприетите им имена на английски език. Често за създаване на стойности на цветовете се използва инструмент за цветове или друг графичен софтуер.

Първите версии на Mosaic и Netscape Navigator използваха имената на цветовете в X11 като основа за своите списъци с цветове. Това се дължи на факта, че и двата продукта стартираха като приложения на X Window System.

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



 

Формати за описание на уеб цветовете

Най-често използваните формати в уеба са:

  • Шестнадесетичен формат (hex) — записва се като #RRGGBB, където всяка от двойките RR, GG, BB е шестнадесетично число от 00 до FF (0–255 десетично). Пример: #FF0000 е чисто червено. Има и съкратен вариант #RGB, който се разширява до #RRGGBB (например #3A7#33AA77).
  • RGB / RGBA — функционален синтаксис в CSS: rgb(r, g, b) със стойности 0–255 или 0–100% и rgba(r, g, b, a) с прозрачност a от 0 до 1.
  • HSL / HSLA — цветово пространство по тон/наситеност/лекота: hsl(h, s%, l%) и hsla(..., a). Удобно за манипулация на нюансите и светлината.
  • Именувани цветове — стандартни имена като red, navy и др.; CSS дефинира набор от именувани цветове, исторически свързан с X11 и разширен в CSS.

Как работи RGB и защо 16 777 216 цвята?

RGB представлява смесица от три канала — червен, зелен и син. Всеки канал обикновено има 256 стойности (0–255). Броят на възможните комбинации е 256 × 256 × 256 = 16 777 216. Тези стойности могат да се записват както в десетичен вид (например rgb(255,0,0)), така и в шестнадесетичен (например #FF0000).

sRGB стандартът

sRGB е стандартно цветово пространство, дефинирано така че да отразява типичните характеристики на много потребителски монитори и условия на гледане. Ключови характеристики:

  • Праймери (хроматичности) на червено, зелено и синьо, зададени в CIE пространство (приблизителни xy: Red 0.64/0.33, Green 0.30/0.60, Blue 0.15/0.06).
  • Бяла точка D65 (приблизително 0.3127, 0.3290 в CIE xy).
  • Крива на трансфер (непряко gamma), близка до γ = 2.2, с линеен сегмент близо до нула.

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

История и именувани цветове

Както е споменато по-горе, ранните браузъри като Mosaic и Netscape Navigator използваха списъци с имена, базирани на X11. Днес CSS дефинира набор от стандартизирани именувани цветове (около 140), които са широко поддържани от съвременните браузъри.

Съществуваше и концепцията за "уеб безопастни цветове" (web-safe palette) от 216 цвята, предназначена за 8-битовите дисплеи, но тя е информативна повече от историческа — в момента повечето екрани поддържат 24-битови (или повече) цветове.

Практически съвети за дизайнери и разработчици

  • Използвайте sRGB като стандартно работно пространство за уеб дизайн, за да получите предвидима визия на различни устройства.
  • За прозрачност използвайте rgba() или съвременните шестнадесетични формати с алфа канал (#RRGGBBAA), като проверите съвместимостта с целевите браузъри.
  • Проверявайте контрастността между текст и фон спрямо изискванията за достъпност (WCAG) — за нормален текст се препоръчва съотношение поне 4.5:1, а за голям текст — поне 3:1.
  • Използвайте инструменти за подбор на цветове, симулация на далтонизъм и цветово управление в графичен софтуер, когато е необходимо високо ниво на точност (особено за уеб към печат).

Цветово управление в браузърите

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

В заключение: разбирайки формати като RGB и шестнадесетичния запис, както и принципите на sRGB, ще можете да избирате и прилагате уеб цветове последователно и предвидимо — както за екрана, така и при преходи към печат или други медии.