Bloky grafů: Přístupné grafy s poctivými osami

Blok grafu je ohraničené zobrazení dat, které kombinuje graf s jeho závěrem, názvem, popisky, zdrojem, obdobím a přístupnou datovou alternativou. Použijte jej, když tvar dat odpovídá na otázku rychleji než řada přesných hodnot.

Proč na tomto elementu záleží

Grafy využívají vizuální rozpoznávání vzorců. Čtenář dokáže detekovat nárůst, mezeru, shluk nebo změnu sklonu dříve, než by stejné hodnoty porovnával buňku po buňce. To pomáhá, když je vzorec — nikoli přesné vyhledávání — tím podstatným. Je to však také nebezpečné: oříznuté osy, nestejné intervaly nebo plošné efekty mohou způsobit, že malý rozdíl vypadá rozhodující. Graf si zaslouží své místo pouze tehdy, když snižuje úsilí, aniž by měnil důkazy.

Psychologie čtenáře činí písemný závěr nezbytným. Lidé si mohou zapamatovat směr nebo relativní velikost snadněji než poznámku pod čarou. Uveďte ohraničený závěr v textu, včetně populace a období, pokud je to potřeba. Nikdy netvrdte kauzalitu z korelace ani obecný trend z vybraného intervalu.

Strojová extrahovatelnost vyžaduje názvy řad, popisky, hodnoty, jednotky, zdroj, období a závěr jako text. Prohledávač nebo AI odpověďový engine nemusí interpretovat SVG cestu, canvas, screenshot, hover stav nebo barevnou legendu. Blok proto páruje vizuál s uspořádanými daty pro asistenční technologie, indexaci, ověření a opětovné použití.

Mají přednost pravidla pro psaní elementů : vyberte tento element, protože účelem pasáže je odhalit kvantitativní vzorec, nikoli proto, že by graf stránku zdobil. Pokud je úkolem přesné vyhledání nebo porovnání položka po položce, použijte tabulku, i když je software pro tvorbu grafů k dispozici.

Kdy jej použít

Použijte graf, když čtenář potřebuje vidět jeden ze čtyř tvarů: změnu v uspořádané posloupnosti, rozdíly napříč zvládnutelnou sadou kategorií, rozdělení pozorování nebo vztah mezi dvěma kvantitativními proměnnými. Spojnicový graf může odhalit směr v čase; sloupcový graf může seřadit kategorie; histogram může odhalit rozdělení; a bodový graf může odhalit asociaci a odlehlé hodnoty. Datová sada musí být dostatečně úplná, konzistentně měřená a relevantní k tvrzení.

Jednoduchý test odděluje graf od tabulky: pokud si čtenář má nejprve všimnout vzorce, zvolte graf; pokud má najít přesnou hodnotu, zvolte tabulku. Pokud záleží na obojím, zahrňte do bloku grafu kompaktní tabulku, aby se tyto dva výstupy nemohly rozcházet.

Mezi časté chyby patří:

• Dvě hodnoty: napište větu nebo malé srovnání. Dva sloupce jen zřídka odhalí vzorec přímočařeji.
• Dlouhý seznam kategorií: použijte seskupenou tabulku. Třicet sloupců vytváří problémy s popisky a mobilním rozložením.
• Několik hlavních metrik: použijte pás statistik, pokud jsou čísla nezávislé zajímavosti spíše než jedna řada.
• Proces nebo chronologie: použijte časovou osu, když značky nekódují množství.
• Kauzální tvrzení z asociace: bodový graf může ukázat, že se dvě proměnné pohybují společně; nemůže prokázat, že jedna způsobila druhou.
• Dekorativní „datový příběh": pokud odstraněním grafu neztratíme žádný závěr, odstraňte jej.
• Srovnání s dlouhými kvalitativními kritérii: použijte srovnávací tabulku , protože kategorie jako zásady podpory nebo implementační vhodnost nelze poctivě zakódovat jako délku sloupce.

Kam jej umístit

Umístěte graf za odstavec, který představuje otázku, populaci, měřítko a období. Uveďte závěr přímo před nebo za něj, poté vysvětlete důsledky a omezení. Ve výzkumu patří každý graf vedle svého zjištění. V případové studii stanovte výchozí stav a intervenci před ukázáním změny.

Udržujte název, vizuál, legendu, závěr, datovou alternativu, zdroj a poznámky v jedné hranici obrázku. Poznámky pod čarou mohou následovat za obrázkem, ale reklama, registrační formulář nebo nesouvisející obrázek jej nesmí přerušovat. Zdroj by měl být viditelný bez otevírání datové alternativy.

Neumísťujte jej vedle stejně výrazného grafu, samostatné tabulky nebo pásu statistik, které opakují jeho data, cenové tabulky, karuselu nebo výrazné výzvy k akci. Tyto kombinace si konkurují nebo vytvářejí více zdrojů pravdy. Oddělte datová zobrazení vysvětlením.

Anatomie

Označený screenshot musí identifikovat tyto oblasti:

1. Závěr: jedna věta uvádějící vzorec bez obrázku.
2. Název obrázku: neutrální popis měřítka, populace a období.
3. Graf: oblast, kde pozice, délka nebo směr kódují hodnoty.
4. Osy a stupnice: viditelné popisky, jednotky, dílky, intervaly a základní linie.
5. Popisky řad: přímé popisky tam, kde je to možné; jinak legenda, která není pouze barevná.
6. Poznámka: volitelná poznámka vázaná k datovému bodu, nikoli náhrada metodologie.
7. Datová alternativa: tabulka nebo uspořádaný text obsahující vykreslené hodnoty.
8. Popisek a zdroj: rozsah, původ, vykazované období a případná poznámka k výpočtu.

Příklady designu

Každá varianta používá dvojrozměrné značky, viditelné jednotky, závěr, zdrojová data a přístupnou alternativu. Neexistuje žádná 3D, piktogramová, měřicí ani dvouosá varianta, protože dekorace a konkurující si stupnice narušují srovnání.

Spojnicový graf: použijte pro hodnoty měřené v konzistentních uspořádaných intervalech, obvykle čas. Chybějící pozorování se musí objevit jako mezery, nikoli jako vymyšlená spojení. Více než čtyři řady obvykle vyžaduje rozdělení grafu nebo volbu tabulky.

Sloupcový graf: použijte pro srovnání nebo řazení napříč diskrétními kategoriemi. Začněte kvantitativní osu nulou, protože délka sloupce reprezentuje velikost. Preferujte vodorovné sloupce, když jsou popisky dlouhé, a seřaďte podle hodnoty, pokud přirozené pořadí nenese význam.

Bodový graf: použijte pro vztah mezi dvěma kvantitativními proměnnými. Zobrazte jednotlivá pozorování, pojmenujte obě měřítka, zveřejněte jakoukoli proloženou trendovou linii, vyhněte se kauzálním formulacím, pokud to výzkumný design nepodporuje.

Skládaný sloupcový graf: použijte, když záleží jak na celku, tak na složení napříč malým počtem skupin. Udržujte stabilní pořadí segmentů a omezte skládání na čtyři kategorie. Pokud čtenáři potřebují hlavně porovnávat jednotlivé složky, použijte místo toho seskupené sloupce nebo malé násobky.

Parametry

„Zdroj" níže znamená autorské umístění, ze kterého renderer získává pole, nikoli poskytovatel důkazů citovaný grafem.

show-data=false je povoleno pouze tehdy, když je ekvivalentní datová tabulka nebo úplná textová alternativa hodnota po hodnotě již programově přiřazena k obrázku. Nikdy to není povolení k publikování pouze vizuálního grafu.

Syntaxe a příklady kódu

Všechny tři zápisy zachovávají stejný název, závěr, datovou sadu, stupnici, zdroj, období a alternativní text. Obrázky jsou ilustrativní.

Přenosná direktiva Markdown

:::chart-block{type=bar y-label="Requests" y-min=0 source="Illustrative editorial dataset" period="2026 Q1–Q4" alt="Requests decrease in every quarter, from 120 in Q1 to 72 in Q4."}
## Illustrative support requests by quarter

Takeaway: Requests decline each quarter, from 120 in Q1 to 72 in Q4.

| Quarter | Requests |
|---|---:|
| Q1 | 120 |
| Q2 | 108 |
| Q3 | 84 |
| Q4 | 72 |
:::

První nadhead se mapuje na title; závěr a kanonická datová tabulka se mapují na pole v těle.

Hugo shortcode

Hugo adaptér používá pojmenované parametry a odvozuje vizuál a tabulku z jedné datové sady v těle. Tento zápis specifikuje zamýšlené mapování.

{{< chart-block type="bar" yLabel="Requests" yMin="0" source="Illustrative editorial dataset" period="2026 Q1–Q4" alt="Requests decrease in every quarter, from 120 in Q1 to 72 in Q4." >}}
## Illustrative support requests by quarter

Takeaway: Requests decline each quarter, from 120 in Q1 to 72 in Q4.

| Quarter | Requests |
|---|---:|
| Q1 | 120 |
| Q2 | 108 |
| Q3 | 84 |
| Q4 | 72 |
{{< /chart-block >}}

WordPress blok

<!-- wp:amicited/chart-block {"type":"bar","title":"Illustrative support requests by quarter","yLabel":"Requests","yMin":0,"source":"Illustrative editorial dataset","period":"2026 Q1–Q4","alt":"Requests decrease in every quarter, from 120 in Q1 to 72 in Q4.","takeaway":"Requests decline each quarter, from 120 in Q1 to 72 in Q4."} -->
<table><thead><tr><th>Quarter</th><th>Requests</th></tr></thead><tbody><tr><th>Q1</th><td>120</td></tr><tr><th>Q2</th><td>108</td></tr><tr><th>Q3</th><td>84</td></tr><tr><th>Q4</th><td>72</td></tr></tbody></table>
<!-- /wp:amicited/chart-block -->

Blok může vykreslovat SVG nebo canvas, ale uložený a serverově vykreslený výstup musí zachovat závěr a tabulku. JavaScript může rozšiřovat interakci, nikdy nesmí poskytovat jediné popisky nebo hodnoty.

Příklady

Dobře: vizuál a slova vyprávějí stejný ohraničený příběh

Závěr: V ilustrativní datové sadě klesá medián doby vyřízení z 18 hodin v lednu na 12 hodin v dubnu; graf neprokazuje proč.

Spojnicový graf používá pravidelné měsíční intervaly a popsanou osu „Hours" od 10 do 20. Tato zveřejněná nenulová stupnice je vhodná, protože pozice, nikoli délka sloupce, kóduje hodnoty. Tabulka zpřístupňuje každý bod a text nepřisuzuje pokles intervenci.

Špatně: graf vytváří falešnou naléhavost

Sloupcový graf s názvem „Doba vyřízení se po spuštění propadá" zobrazuje stejné hodnoty 18, 17, 14 a 12 hodin na ose, která začíná na 11,5. Sloupce se zdánlivě smrsknou téměř na nic. Leden je označen „před", duben „po", meziměsíční hodnoty jsou skryty za hoverem a není zobrazeno ani datum intervence, ani zdroj. Červeno-zelená barva poskytuje jediný významový výkon.

Toto selhává, protože sloupce vyžadují nulovou základní linii, název tvrdí kauzalitu a selektivní popisky brání ověření. Hodnoty pouze při hoveru vylučují kontexty klávesnice, dotyku, extrakce a asistenčních technologií. Opravte to nulovou základní linií nebo jasně škálovaným spojnicovým grafem, každým pozorováním, zdrojem, obdobím, datovou tabulkou a nekauzálním závěrem.

Značkování Schema a přístupnost

Schema.org nemá obecný typ Chart nebo Graph. Graf zůstává důkazem v rámci entity na úrovni stránky, jako je Article, Report nebo Dataset. Výzkum může popisovat reálnou stahovatelnou datovou sadu s vlastnostmi jako časové pokrytí, proměnné, tvůrce a distribuce. Nikdy nevytvářejte dataset, hodnocení, trend nebo vlastnost výsledku jen proto, že graf existuje.

Přístupnost vyžaduje víc než alt text. Opatřete obrázek názvem a popiskem a SVG přístupným jménem a popisem. Canvas potřebuje ekvivalentní DOM reprezentaci. Poskytněte vykreslené hodnoty v tabulce se skutečnými záhlavími a udržujte závěr mimo grafiku, aby přežil tisk, extrakci a selhání obrázku.

Nepoužívejte barvu jako jediný identifikátor řady; přidejte přímé popisky, vzory čar, tvary bodů nebo text. Tooltipy musí být dosažitelné klávesnicí, odstranitelné a doplňkové. Při 200% zoomu a úzkých šířkách přetékání nebo posouvání popsané oblasti grafu, aniž by vznikalo posouvání na úrovni stránky.

Respektujte preference omezeného pohybu a vyhněte se animovanému kreslení nebo automatickým přechodům. Pokud filtry mění data, oznamte stav a zobrazte aktivní filtry v textu. Statický graf není cílem klávesnice, pokud nemá skutečné ovládací prvky.

Pravidla pro psaní

Tato pravidla udržují vizuální autoritu grafu úměrnou jeho důkazům:

• Napište jeden závěr o 15–35 slovech. Uveďte směr nebo vztah, relevantní koncové body, populaci a období, pokud zabraňují nejednoznačnosti.
• Používejte 2–20 bodů na řadu a ne více než čtyři řady. Rozdělte hustší práci do malých násobků, tabulky nebo stahovatelné datové sady.
• Udržujte názvy na 5–16 slovech a popisky na 1–6 slovech. Názvy popisují; závěry uzavírají.
• Používejte stejnou jednotku a definici měření v celé řadě. Pokud se metoda změní, přerušte linii a vysvětlete nespojitost.
• Začněte kvantitativní osy sloupcových a skládaných sloupcových grafů nulou. Stupnice spojnicového nebo bodového grafu může být užší pouze tehdy, když jsou hranice a jednotky zůstávají viditelné a volba nezveličuje šum.
• Používejte stejné vizuální rozestupy pro stejné číselné nebo časové intervaly. Neumísťujte únor a prosinec, jako by byly sousední měsíce, když mezilehlá období chybí.
• Zobrazte chybějící hodnoty jako chybějící. Nikdy je nepřevádějte na nulu, nepřipojujte přes ně mlčky ani neinterpolujte bez uvedené metody.
• Označte projekce, odhady, modelované hodnoty a sezónně očištěné hodnoty přímo. Nestylyzujte je jako pozorovaná data.
• Vyhněte se dvěma osám, 3D efektům, perspektivě, obrázkovému plošnému škálování, přerušeným osám, duhovým paletám a vyhlazeným křivkám, které implikují neměřené hodnoty.
• Uveďte zdroj, období pokrytí, vzorek nebo kohortu, pokud je relevantní, a jakoukoli transformaci, jako je indexace, normalizace nebo klouzavý průměr.
• Nikdy neumísťujte výzvu k akci, svědectví, propagační odznak, nepodložené kauzální tvrzení nebo zásadní upozornění pouze dovnitř obrázku.
• Odvoďte graf a jeho tabulku z jedné kanonické datové sady. Pokud se hodnoty změní, aktualizujte jednou a regenerujte oba výstupy.

Podrobná metodologie a citace mohou pokračovat v nedalekém bloku zdrojů , ale graf stále potřebuje vlastní viditelný zdroj a období.

Typy příspěvků, které jej používají

Pole postTypes v front matter definuje schválené vztahy níže. Zařazení povoluje graf, když existuje skutečný kvantitativní vzorec; nevyžaduje, aby autoři vyráběli graf pro každou stránku.

Kontrolní seznam QA

• Hlavním úkolem čtenáře je vidět vzorec; samotné přesné vyhledávání by lépe obsloužila tabulka.
• Závěr je celá věta v HTML textu, souhlasí s vykreslenými daty a zůstává v mezích důkazů.
• Název pojmenovává měřítko, populaci a období potřebné k pochopení obrázku.
• Typ grafu odpovídá analytickému úkolu: posloupnost, srovnání kategorií, rozdělení nebo vztah.
• Základní linie sloupců začínají nulou; každá další stupnice je viditelná, odůvodněná a neklamavá.
• Intervaly, jednotky, jmenovatele, výpočty a chybějící hodnoty jsou reprezentovány poctivě.
• Řady jsou přímo popsané nebo rozlišitelné nejen barvou.
• Každá zásadní hodnota je dostupná bez hoveru, JavaScriptu, animace nebo interpretace obrázku.
• Datová tabulka nebo úplná textová alternativa používá skutečná záhlaví a přesně odpovídá vizuálu.
• Zdroj, období pokrytí, kohorta nebo vzorek a transformace jsou viditelné vedle grafu.
• Graf a přístupná alternativa pocházejí z jedné kanonické datové sady.
• Blok není umístěn vedle duplicitního zobrazení dat, konverzního modulu nebo konkurujícího výrazného vizuálu.
• Graf funguje s klávesnicovým vstupem, nastavením vysokého kontrastu, 200% zoomem, úzkými obrazovkami a omezeným pohybem.
• Nezůstal žádný 3D efekt, dvě osy, přerušená osa, obrázkové škálování, nepodložené kauzální tvrzení nebo dekorativní řada.
• Jakákoli strukturovaná data na úrovni stránky jsou způsobilá a konzistentní s viditelnými důkazy.
• Vybraný typ příspěvku zahrnuje blok grafu ve své obsahové smlouvě.

FAQ

Kdy mám použít graf místo tabulky?

Použijte graf, když je prvním úkolem vidět trend, rozdělení, pořadí nebo vztah. Použijte tabulku, když čtenáři potřebují přesné vyhledávání napříč mnoha poli. Když záleží na obou úkolech, udržujte kompaktní tabulku uvnitř bloku grafu jako jeho přístupnou datovou alternativu.

Musí sloupcový graf začínat nulou?

Ano. Délka sloupce reprezentuje velikost od základní linie, takže oříznutí této základní linie mění zdánlivý poměr. Spojnicový graf může používat nenulovou stupnici, když jsou viditelný rozsah a jednotky explicitní a užší pohled je analyticky nezbytný.

Stačí alt text k zajištění přístupnosti grafu?

Obvykle ne. Alt text by měl identifikovat zobrazení a shrnout jeho hlavní vzorec. Vícehodnotový graf také potřebuje poblíž umístěnou datovou tabulku nebo ekvivalentní text obsahující popisky, hodnoty, jednotky, zdroj a období.

Může závěr grafu být uveden pouze v názvu grafu?

Ne. Název identifikuje, co obrázek ukazuje; závěr uvádí, čeho by si měl čtenář všimnout. Udržujte závěr jako celou větu mimo grafiku, aby zůstal dostupný, když obrázek není vnímán nebo extrahován.

Vytváří blok grafu značkování Schema.org?

Ne. Použijte platné značkování na úrovni stránky, jako je Article, Report nebo Dataset, pouze když stránka samostatně kvalifikuje. Graf nevytváří nové oprávnění pro schema ani neospravedlňuje strukturovaná tvrzení, která chybí ve viditelných důkazech.