Přidat kritéria a packy kontrol
Každý krok má svá kritéria: co musí obrazovka splňovat. Kaloko zná tři druhy a dobrý scénář použije ten nejjednodušší, který na otázku odpoví.
Dá se spočítat: deterministická kontrola
Co se dá spočítat nebo přečíst ze stránky, se ověří přímo ve stránce a k výsledku se přiloží důkaz:
criteria:
- id: AC1
text: Košík ukazuje dvě položky.
check: { type: deterministic, assert: count, selector: ".cart-item", min: 2, max: 2 }
- id: AC2
text: Po zaplacení se zobrazí poděkování.
check: { type: deterministic, assert: url_matches, pattern: "/thanks$" }
- id: AC3
text: Tlačítko Zaplatit má barvu značky.
check: { type: deterministic, assert: style_equals, selector: "button.pay", property: background-color, token: color.brand.primary }Další kontroly čtou text, atributy, HTTP status, přetečení na telefonu nebo hodnotu, kterou stránka vystavuje (js_equals). Celý seznam je v referenci kontroly a packy. Skript kroku nikdy nemusí nechávat značku, kterou by kritérium hledalo.
Otázka: sémantická kontrola
Co chce úsudek, dostane evaluátor jako otázku ke stránce:
- id: AC4
text: Hlavní výzva k akci je zřejmá.
check: { type: semantic, question: Ukazuje stránka jednu zřetelnou hlavní výzvu k akci?, scope: main }Evaluátor si přečte zredukovanou osnovu stránky a odpoví skóre. Jasné ano projde, jasné ne neprojde a všechno mezi tím rozhodne člověk. Když jde o vzhled (rozložení, obrázky, „vypadá to jako naše značka“), přidejte ke kontrole vision: true: na screenshot se pak podívá ještě model, který vidí obrázky. Používejte to jen u kroků, kde je to potřeba.
Rozhodne člověk: ruční kontrola
- id: AC5
text: Právníci schválili znění souhlasu.
check: { type: manual }Ruční kritérium zůstane „nehodnoceno“, dokud o něm kontrolující nerozhodne na plachtě.
Packy kontrol
Pack přidá ke kroku hotovou sadu kritérií, takže běžné kontroly nepíšete ručně:
nodes:
- id: home
packs: [seo, a11y, perf, console]| Pack | Co kontroluje |
|---|---|
seo | jeden H1, titulek a popis, canonical, hreflang, Open Graph, indexaci, html lang |
usability | účel, jednu hlavní akci, texty odkazů, pole bez popisku |
a11y | alternativní texty, názvy, popisky, nadpisy, kontrast, landmarky, průchod tabulátorem a viditelný focus |
perf | LCP, CLS, TTFB a váhu stránky naměřené při průchodu |
console | jestli chyby v konzoli souvisejí s tím, k čemu krok slouží |
errors | chybové stránky: skutečný status 4xx nebo 5xx, cestu zpět, žádný výpis zásobníku |
app | obrazovky aplikací: popisky ovládacích prvků, velikost dotykových ploch, useknutý text, pády |
design | implementaci proti přijatému návrhu: pixely, strukturu, tokeny, kontrast |
Limit změníte vlastním kritériem se stejným id, jaké má pack (třeba AC401 pro LCP); vaše kritérium má přednost. Jak se z výsledků skládá verdikt, vysvětluje stránka jak vzniká verdikt.
Kaloko · latest · 2026-10-06