Barvy webu - Web colors

Barvy webu jsou barvy použito v zobrazování webových stránek na Celosvětová Síť a metody pro popis a specifikaci těchto barev. Barvy mohou být specifikovány jako RGB triplet nebo v hexadecimální formát (a hex triplet) nebo v některých případech podle jejich běžných anglických jmen. A barevný nástroj nebo jiný grafický software se často používá ke generování barevných hodnot. V některých použitích jsou hexadecimální barevné kódy specifikovány notací pomocí úvodní znak čísla (#).^[1][2] Barva je specifikována podle intenzity její červené, zelené a modré složky, z nichž každá představuje osm bity. Existuje tedy 24 bitů použitých k určení barvy webu v rámci sRGB gamut a 16 777 216 barev, které mohou být takto specifikovány.

Barvy mimo gamut sRGB lze specifikovat v Kaskádové styly vytvořením jedné nebo více červených, zelených a modrých složek negativních nebo větších než 100%, takže barevný prostor je teoreticky neomezená extrapolace sRGB podobná scRGB.^[3] Určení jiné barvy než sRGB tímto způsobem vyžaduje volání funkce RGB (); s hexadecimální syntaxí je to nemožné (a tedy nemožné ve starší verzi) HTML dokumenty, které nepoužívají CSS).

První verze Mozaika a Netscape Navigator použil Názvy barev X11 jako základ pro jejich seznamy barev, protože oba začaly jako Systém X Window aplikace. Barvy webu mají jednoznačnou kolorimetrickou definici, sRGB, který se týká chromatičnosti konkrétního fosfor set, daná přenosová křivka, adaptivní bílý bod a podmínky sledování.^[4] Byly vybrány tak, aby byly podobné mnoha reálným světům monitory a podmínky prohlížení, aby bylo možné vykreslení poměrně blízko zadaným hodnotám i bez něj správa barev. Uživatelští agenti se liší ve věrnosti, s jakou představují určené barvy. Pokročilejší agenti uživatelů používají správu barev k zajištění lepší věrnosti barev; to je zvláště důležité pro Web-to-print aplikace.

Hex triplet

A hex triplet je šestimístný, třímístnýbyte hexadecimální číslo použité v HTML, CSS, SVG a další počítačové aplikace reprezentující barvy. Bajty představují červenou, zelenou a modrou složku barvy. Jeden bajt představuje číslo v rozsahu 00 až FF (v hexadecimálním zápisu) nebo 0 až 255 v desítkovém zápisu. To představuje nejmenší (0) až nejvyšší (255) intenzitu každé z barevných složek. Barvy webu tedy určují barvy v 24bitové barevné schéma RGB. Trojice hex je tvořena zřetězením tří bytů v hexadecimálním zápisu v následujícím pořadí:

• Bajt 1: červená hodnota (typ barvy červená)
• Bajt 2: zelená hodnota (typ barvy zelená)
• Bajt 3: modrá hodnota (typ barvy modrá)

Zvažte například barvu, kde červené / zelené / modré hodnoty jsou desetinná čísla: červená = 36, zelená = 104, modrá = 160 (šedavě modrá barva). Desetinná čísla 36, ​​104 a 160 jsou ekvivalentní hexadecimálním číslům 24, 68 a A0. Šestiúhelníkový triplet se získá zřetězením šesti hexadecimálních číslic dohromady, v tomto příkladu 2468A0.

Pokud je některá ze tří barevných hodnot menší než 10 hexadecimálních hodnot (16 desetinných míst), musí být reprezentována počáteční nulou, aby měl triplet vždy přesně šest číslic. Například desítková trojice 4, 8, 16 by byla reprezentována hexadecimálními číslicemi 04, 08, 10, čímž by vznikla hexadecimální trojice 040810.

Počet barev, které může tento systém reprezentovat, je 16⁶ nebo 256³ nebo 2²⁴ = 16,777,216.

Zkratka hexadecimální forma

Používá se zkrácená forma se třemi (hexadecimálními) číslicemi.^[5] Rozšíření tohoto formuláře na šestimístný formulář je stejně jednoduché jako zdvojnásobení každé číslice: 09C se stane 0099CC, jak je uvedeno na následujícím CSS příklad:

.tři číslice { barva: # 09C;    }.šestimístný   { barva: # 0099CC; } / * stejná barva jako výše * /

Tato zkratková forma redukuje paletu na 4 096 barev, což odpovídá 12bitové barvě na rozdíl od 24bitové barvy pomocí celého šestimístného formuláře (16 777 216 barev). Toto omezení je dostatečné pro mnoho textových dokumentů.

Převod RGB na hexadecimální

Hodnoty RGB jsou obvykle uvedeny v rozsahu 0–255; pokud jsou v rozsahu 0–1, hodnoty se před převodem vynásobí 255. Toto číslo dělené šestnáctkou (celočíselné dělení; ignorování zbytku) dává první šestnáctkovou číslici (mezi 0 a F, kde písmena A až F představují čísla 10 až 15. Viz. hexadecimální Více podrobností). Zbytek dává druhou šestnáctkovou číslici. Například hodnota RGB 201 se dělí na 12 skupin po 16, takže první číslice je C. Zbytek devíti udává hexadecimální číslo C9. Tento proces se opakuje pro každou ze tří barevných hodnot.

Převod mezi číselnými základnami je běžným rysem kalkulaček, včetně ručních modelů a softwarových kalkulaček dodávaných s nejmodernějšími operační systémy. K dispozici jsou také webové nástroje speciálně pro převod barevných hodnot.

Názvy barev HTML

Nedávno W3C specifikace barevných jmen rozlišuje mezi základní a prodloužena barvy.^[6]

Základní barvy

Základní barvy jsou 16 barev definovaných v HTML Specifikace 4.01, ratifikována v roce 1999,^[7] následovně (jména jsou v tomto kontextu definována jako malá a velká písmena):

Těchto 16 bylo označeno jako sRGB a zahrnuto ve specifikaci HTML 3.0, která uvádí, že se jedná o „standardní 16 barev podporovaných systémem Windows VGA paleta."^[8]

Rozšířené barvy

SVG Verze názvů barev X11

Rozšířené barvy jsou výsledkem sloučení specifikací z HTML 4.01, CSS 2.0, SVG 1.0 a CSS3 User Interfaces (CSS3 UI).^[6]

Řada barev je definována pomocí internetové prohlížeče. Konkrétní prohlížeč nemusí rozpoznat všechny tyto barvy, ale od roku 2005 podporují všechny moderní, obecně používané grafické prohlížeče úplný seznam barev. Mnoho z těchto barev je ze seznamu Názvy barev X11 distribuováno s Systém X Window. Tyto barvy byly standardizovány SVG 1.0, a jsou přijímány SVG plné uživatelské agenty. Nejsou součástí SVG Tiny.

Seznam barev dodávaných s produktem X11 se liší mezi implementacemi a střetává se s určitými názvy HTML, například zelenou. Barvy X11 jsou definovány jako jednoduché RGB (tedy žádný konkrétní barevný prostor), spíše než sRGB. To znamená, že seznam barev nalezených v X11 (např. V /usr/lib/X11/rgb.txt) by neměl být přímo použit k výběru barev pro web.^[9]

Seznam webových „barev X11“ ze specifikace CSS3, spolu s jejich šestnáctkovými a desetinnými ekvivalenty, je uveden níže. Porovnejte abecední seznamy ve standardech W3C. To zahrnuje běžná synonyma: aqua (standardní název HTML4 / CSS 1.0) a azurová (běžný název sRGB), purpurová (běžný název sRGB) a fuchsia (standardní název HTML4 / CSS 1.0), šedá (standardní název HTML4 / CSS 1.0) a Šedá.^[10][11]

Barvy bezpečné pro web

V polovině 90. let dokázalo mnoho displejů zobrazit pouze 256 barev.^[12] Ty mohou být diktovány hardwarem nebo měněny pomocí „tabulky barev“. Pokud je nalezena barva (např. Na obrázku), která není k dispozici, musela být použita jiná. To lze provést buď pomocí nejbližší barvy, nebo pomocí dithering.

Existovaly různé pokusy o vytvoření „standardní“ palety barev. Byla zapotřebí sada barev, která by mohla být zobrazena bez rozkladu na 256barevných displejích; číslo 216 bylo vybráno částečně proto, že počítačové operační systémy obvykle vyhradily šestnáct až dvacet barev pro vlastní potřebu; byl také vybrán, protože umožňuje přesně šest stejně rozmístěných odstínů červené, zelené a modré (6 × 6 × 6 = 216), každý od 00 do FF (včetně obou limitů).

Seznam barev je uveden, jako by měl speciální vlastnosti, díky nimž jsou imunní vůči rozkladu, ale na 256barevných displejích mohou aplikace ve skutečnosti nastavit paletu libovolného výběru barev, které si vyberou, zbytek se rozpadne. Tyto barvy byly vybrány konkrétně, protože odpovídaly paletám vybraným různými aplikacemi prohlížeče. V různých prohlížečích nebyly používány příliš odlišné palety.^{[Citace je zapotřebí ]}

Barvy „bezpečné pro web“ v tom měly chybu, a to v systémech jako X11 tam, kde je paleta sdílena mezi aplikacemi, byly prohlížečům přiděleny menší barevné kostky (5 × 5 × 5 nebo 4 × 4 × 4) - barvy „bezpečné pro web“ by na takových systémech chřadly. Různé výsledky byly získány poskytnutím obrázku s větší škálou barev a umožněním prohlížeče kvantovat v případě potřeby barevný prostor, místo aby utrpěl ztrátu kvality zdvojnásobením kvantizace.

Přes 2000s, použití 256 barevných displejů v osobních počítačích prudce pokleslo ve prospěch 24-bit (Pravdivá barva ) displeje,^[13] a používání barev „bezpečných pro web“ se prakticky nepoužívá.

Barvy „bezpečné pro web“ nemají všechny standardní názvy, ale každá z nich může být specifikována znakem RGB triplet: každá složka (červená, zelená a modrá) přebírá jednu ze šesti hodnot z následující tabulky (z 256 možných hodnot dostupných pro každou složku v plné 24bitové barvě).

V následující tabulce jsou uvedeny všechny barvy „bezpečné pro web“. Jedním z nedostatků bezpečné webové palety je její malá škála světlých barev pro pozadí webových stránek, zatímco intenzity na spodním konci rozsahu, jako jsou dvě nejtmavší, jsou si navzájem podobné, takže je obtížné je rozlišit. Hodnoty ohraničené znakem „*“ (hvězdička) jsou součástí „skutečně bezpečné palety;“ vidět Nejbezpečnější barvy webu níže.

Tabulka barev

každý uvedený barevný kód je zkratkou pro hodnotu RGB; například kód 609 je ekvivalentní RGB kódu 102-0-153 nebo HEX kódu # 660099

Nejbezpečnější barvy webu

Návrháři byli vyzváni, aby se na svých webových stránkách drželi těchto 216 „bezpečných pro web“ barev, protože při vývoji palety 216 barev bylo mnoho 8bitových barevných displejů. David Lehn a Hadley Stern zjistili, že pouze 22 z 216 barev v paletě bezpečné pro web je spolehlivě zobrazeno bez nekonzistentního přemapování 16bitové počítačové displeje. Těchto 22 barev nazvali „opravdu bezpečná paleta“; skládá se převážně z odstínů zelené, žluté a modré, jak je vidět v následující tabulce.^[14]

Barvy CSS

The Kaskádové styly Specifikace definuje stejný počet pojmenovaných barev jako specifikace HTML 4, konkrétně 16 html barvy a 124 barev z Netscape Barva X11 seznam celkem 140 jmen rozpoznaných aplikacemi Internet Explorer (IE) 3.0 a Netscape Navigator 3.0.^[16] Blooberry.com konstatuje, že Opera 2.1 a Safari 1 také zahrnovaly rozšířený seznam 140 barevných názvů Netscape, ale později objevily 14 jmen, která nejsou součástí Opera 3.5 v systému Windows 98.^[17]

V CSS 2.1 byla do sekce přidána barva „oranžová“ (jedna ze 140) s 16 barvami HTML4 jako 17. barvou.^[18] Specifikace CSS3.0 neobsahovala oranžový v části „Barevná klíčová slova HTML4“, ​​která byla přejmenována na „Základní barevná klíčová slova“.^[19] Ve stejné referenci byla sekce „SVG barevná klíčová slova“ přejmenována na „Rozšířená barevná klíčová slova“ poté, co byla v dřívějším pracovním konceptu spuštěna jako „Barevná klíčová slova X11“.^[20] Pracovní koncept barevného modulu CSS4 kombinuje základní a rozšířenou část v jednoduché části „Pojmenované barvy“.^[21]

CSS 2, SVG a CSS 2.1 umožňují webovým autorům používat systémové barvy, což jsou názvy barev, jejichž hodnoty jsou převzaty z operační systém, výběrem zvýrazněné barvy textu operačního systému nebo barvy pozadí pro ovládací prvky popisu. To umožňuje autorům webu upravovat jejich obsah v souladu s operačním systémem agenta uživatele.^[22] The CSS3 barevný modul má zastaralé použití systémových barev ve prospěch vlastnosti Vzhled systému UI CSS3,^[23][24] který sám byl následně vyřazen z CSS3.^[25]

Představuje také vyvíjející se specifikace CSS3 HSL barevný prostor hodnoty do stylů:^[26]

 / * RGB model * / p { barva: # F00 } / * #rgb * / p { barva: # FF0000 } / * #rrggbb * / p { barva: rgb(255, 0, 0) } / * celočíselný rozsah 0 - 255 * / p { barva: rgb(100%, 0%, 0%) } / * float range 0,0% - 100,0% * / / * RGB s alfa kanálem, přidáno do CSS3 * / p { barva: rgba(255, 0, 0, 0.5) } / * 0,5 krytí, polotransparentní * / / * HSL model, přidáno do CSS3 * / p { barva: hsl(0, 100%, 50%) } /* Červené */ p { barva: hsl(120, 100%, 50%) } /* zelená */ p { barva: hsl(120, 100%, 25%) } /* tmavozelený */ p { barva: hsl(120, 100%, 75%) } /* světle zelená */ p { barva: hsl(120, 50%, 50%) } / * pastelově zelená * / / * HSL model s alfa kanálem * / p { barva: hsla(120, 100%, 50%, 1) } /* zelená */ p { barva: hsla(120, 100%, 50%, 0.5) } / * poloprůhledná zelená * / p { barva: hsla(120, 100%, 50%, 0.1) } / * velmi průhledná zelená * /

Dne 21. Června 2014 CSS WG přidal barvu RebeccaPurple do redakčního konceptu CSS4 Modul barev, na památku Erica Meyera dcera Rebecca, která zemřela 7. června 2014, k jejím šestým narozeninám.^[27]

CSS také podporuje speciální barvu průhledný, což představuje nulovou hodnotu alfa; ve výchozím stavu, průhledný je vykreslen jako neviditelná nominální černá: rgba (0, 0, 0, 0).^[21]

Přístupnost

Výběr barev

Nějaký prohlížeče a zařízení nepodporují barvy. Pro tyto displeje nebo pro nevidomé a slepé uživatele může být webový obsah v závislosti na barvách nepoužitelný nebo obtížně použitelný.

Neměly by být zadány žádné barvy (k vyvolání výchozích barev prohlížeče), nebo by měly být specifikovány jak barvy pozadí, tak všechny barvy popředí (jako jsou barvy prostého textu, nenavštívené odkazy, odkazy vznášející se na obrázku, aktivní odkazy a navštívené odkazy) černá na černé nebo bílá na bílé účinky.^[28]

Barevný kontrast

The Pokyny pro usnadnění webového obsahu doporučte kontrastní poměr nejméně 4,5: 1 mezi relativní jas textu a jeho barvy pozadí^[29] nebo alespoň 3: 1 pro velký text. Vylepšená přístupnost vyžaduje kontrastní poměry větší než 7: 1.

Řešení problémů s přístupností však není jen otázkou zvýšení kontrastního poměru. Jako zpráva pro Iniciativa za usnadnění přístupu na web označuje,^[30] dyslektickým čtenářům lépe vyhovují kontrastní poměry pod maximem. Doporučení, na která odkazují, jsou špinavě černá (0x0A0A0A) na bělavou (0xFFFFE5) a černá (0x000000) na krém (0xFAFAC8) s kontrastními poměry 11,7: 1, respektive 20,3: 1. Mezi jejich dalšími barevnými páry má hnědá (0x282800) na tmavě zelené (0xA0A000) kontrastní poměr 3,24: 1, což je méně než WCAG doporučení, tmavě hnědá (0x1E1E00) na světle zelené (0xB9B900) má kontrastní poměr 4,54: 1 a modrá (0x00007D) na žluté (0xFFFF00) má kontrastní poměr 11,4: 1. Všimněte si, že barvy pojmenované v sestavě používají jiné hodnoty barev než barvy webu se stejným názvem.

Viz také

Reference

externí odkazy

• CSS2.1 Color Specification
• Seznam bezpečných barev na webu
• Barvy webu na Curlie