Vysoký počet odlišných odstínů na stránce

Z barev, které se na stránce skutečně vyskytují, se sestaví paleta; velmi podobné odstíny se přitom slučují do jednoho, aby se nepočítaly odstíny vzniklé vyhlazováním písma. Nález vznikne, když je různých barev víc než 12 (config/colors.json#colorCount.too_many_threshold).

Slučování používá vzdálenost barev v percepčním prostoru s prahem, který je schválně benevolentnější než hranice rozlišitelnosti pro netrénované oko: dvě barvy musí být znatelně jiné, aby se počítaly zvlášť.

Co kontrola nedělá: neposuzuje, jestli ta paleta dává smysl (12 barev z jedné navržené škály je lepší než 8 nahodilých), nepočítá barvy v obrázcích jako součást palety, a nerozlišuje barvy obsahu od barev rozhraní. Nález je na úrovni stránky a je informativní: skóre nesnižuje ani o bod.

Na viditelnost v odpovědích AI to vliv nemá žádný a na pozici ve vyhledávání také ne. A tentokrát to nemá oporu ani v normě: žádný standard neříká, kolik barev je na stránce správně.

Je to tedy z kódů placených modulů nález s nejslabší oporou vůbec a je fér to říct rovnou: číslo 12 je naše konvence z praxe, nic víc. Je označené jako návrh k revizi a existuje proto, že vysoký počet odstínů bývá příznakem, ne vadou.

Čeho je to příznak: web, na kterém se vrstvily styly z různých dob, od různých lidí nebo z různých komponent třetích stran. Každá vrstva si přinesla svou modrou. Výsledek nikoho nezraní, jen se hůř udržuje a působí méně celistvě.

Kdy to ignorovat bez výčitek: má-li váš web navrženou paletu a ta má patnáct odstínů, je to v pořádku. Má-li stránka hodně barevné obsahové prvky (grafy, fotogalerie, štítky kategorií), je vysoké číslo očekávatelné.

Kdy se podívat blíž: když vás to číslo překvapí. To obvykle znamená, že na stránce jsou barvy, o kterých nevíte, a ty se často vážou k něčemu, co už na webu nemá být.

Je to úklid, ne oprava, a vyplatí se jen tehdy, když se do stylů stejně chystáte sáhnout. Report vám paletu vypíše, takže první krok je podívat se, co v ní je.

1. Roztřiďte barvy podle role, ne podle odstínu: text, pozadí, ohraničení, akcent, stavy. Většina webů vystačí se dvěma až třemi odstíny na roli.
2. Najděte skoro stejné dvojice. Dvě šedé lišící se o pár procent jsou skoro vždycky omyl, ne záměr; sjednoťte je.
3. Pojmenujte výslednou paletu proměnnými v CSS a nové barvy berte jen z ní.
4. Podívejte se, co zbylo. Barva, kterou po roztřídění neumíte zařadit, obvykle patří komponentě, která na stránce už nemá co dělat.

:root {
  --ink: #1a1d21;
  --ink-soft: #5b6470;
  --ground: #ffffff;
  --surface: #f5f7f9;
  --line: #dfe4ea;
  --accent: #225473;
  --ok: #1f7a4d;
  --warn: #a66300;
  --crit: #b3261e;
}

A věc, kterou při tom stojí za to udělat zároveň, protože má na rozdíl od počtu barev tvrdou oporu: u každé dvojice text–pozadí ověřte kontrast (COLOR-01). Sjednocování palety je nejlevnější okamžik, kdy se to dá napravit najednou.