Prvek zasahuje mimo viditelnou plochu

Ve všech třech měřených šířkách se u interaktivních prvků (odkazy, tlačítka, pole, výběry) zjišťuje, jestli jejich pravý okraj nepřesahuje pravý okraj okna. Nález ale vznikne, až když platí všechno tohle najednou: stránka se na té šířce doopravdy vodorovně posouvá, prvek sahá za pravý okraj okna, a po ořezu nadřazenými prvky z něj tam zbude viditelná plocha. Text nálezu pak nese naměřená čísla včetně šířky dokumentu.

Liší se to od DSG-01 v tom, co se měří. DSG-01 hlásí, že dokument jako celek je širší než okno. DSG-06 hlásí konkrétní ovládací prvek, který na takové stránce leží zčásti mimo viditelnou plochu. DSG-06 proto bez DSG-01 nenastane: obě podmínky se od 20. 9. 2026 vyžadují společně.

Vědomá mezera, kterou je fér přiznat: stránka, která přetok utne (overflow-x: hidden na html/body) a posunout se nedá, je horší případ: prvek je nedosažitelný nadobro. DSG-06 ho ale nehlásí, protože jeho text mluví o vodorovném posunu, a ten tam žádný není. Takovou stránku hledejte přes DSG-01 a DSG-04.

Co kontrola nedělá: nesleduje přesah doleva ani dolů, nevidí prvky odkryté až po interakci a neposoudí, jestli je prvek schovaný záměrně (mimo obrazovku se běžně parkují prvky určené jen pro čtečky). Závažnost se zvedá na kritickou při širokém dopadu napříč viewporty; nález má anotovaný snímek.

Na viditelnost v odpovědích AI to vliv nemá. Zato má přímý dopad na to, jestli se návštěvník dostane k tomu, co na stránce potřebuje.

Rozlišení, které rozhoduje o závažnosti pro vás: je-li prvek mimo obrazovku a stránka se dá posunout do strany, je to nepohodlí, a přesně tenhle případ vám DSG-06 hlásí. Je-li přetok schovaný a posunout se nedá, je prvek nedosažitelný, a když je to tlačítko „Odeslat“ nebo „Do košíku“, není to designová vada, je to porucha funkce; ten případ ale nese DSG-01, ne tenhle nález.

Do 20. 9. 2026 nález mezi těmi dvěma případy nerozlišoval. Dnes hlásí jen ten první a druhý přiznaně vynechává. Report vám dá souřadnice a snímek; posoudit dopad musíte vy.

Kde bývá planý poplach: prvky záměrně odsunuté mimo obrazovku, typicky odkaz „Přeskočit na obsah“, který se objeví až po stisku tabulátoru. Ten tam být má a nález na něm ignorujte. Zavřená vysouvací nabídka (nulová šířka, oříznutý obsah) planý poplach už nedává: její položky sice podle souřadnic leží za okrajem okna, ale vidět z nich není nic a dosáhnout na ně jde otevřením nabídky. Na e-shopu postaveném na Shoptetu to do 20. 9. 2026 dělalo 240 nepravdivých výskytů v jednom auditu.

Příčina bývá jedna z těchto tří a najdete ji tím, že se podíváte na rodiče přesahujícího prvku, ne na prvek sám:

1. Pevná šířka v pixelech. width: 320px na prvku uvnitř kontejneru, který má na mobilu 358 px využitelných. Řešení: max-width: 100%.
2. Vodorovná řada, která se nezalomí. Tlačítka ve flex bez flex-wrap: wrap se namačkají a poslední vyjede ven.
3. Absolutně umístěný prvek se souřadnicí počítanou pro širokou obrazovku: rozbalovací nabídka, tooltip, plovoucí tlačítko.

/* Řada, která se umí zalomit */
.akce {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.akce > * {
  max-width: 100%;
}

U rozbalovacích nabídek a tooltipů, které vyjíždějí ven, je spolehlivější nechat pozici na prohlížeči než ji počítat; moderní CSS to umí ukotvit tak, aby se prvek sám překlopil dovnitř, když by přesáhl.

A ověření, které stojí za víc než jakýkoli nástroj: otevřete stránku na telefonu a zkuste projít celý úkol, kvůli kterému na web lidé chodí: vyplnit formulář, dokončit objednávku. Nedosažitelné tlačítko se najde samo.