Infobox: 3 sloupce — Formát, pravidla a příklady

Třísloupcový infobox prezentuje přesně tři paralelní body pod jednou společnou myšlenkou. Je užitečný, když čtenář potřebuje vidět skutečný třídílný model najednou: tři odpovědnosti, tři kritéria, tři výsledky nebo tři koordinované pracovní proudy. Sloupce slibují rovný redakční status, takže každý bod musí dělat stejný druh práce ve srovnatelné hloubce.

Tento vykreslený prvek má jeden společný titulek a přesně tři položky. Všechny tři titulky jsou jmenné fráze, všechna tři těla popisují druh jistoty a ikony dodávají rytmus, aniž by nesly význam. Odstraňte ikony a model zůstává nezměněn.

Proč na tomto prvku záleží

Čtenáři neprožívají hustý odstavec jako model jen proto, že obsahuje tři věty. Musí si první větu zapamatovat, zachytit přechod k druhé a rozhodnout, zda je třetí rovnocenná, podřazená nebo jen doplňková. Třísloupcový infobox vztah zviditelní. Společný titulek pojmenovává, co zůstává konstantní; tři ohraničené položky ukazují úplné rozdělení; vyvážená vizuální váha říká čtenářům, aby prozkoumali každou položku, než model považují za pochopený.

To pomáhá díky chunkování, seskupování souvisejících informací do zvládnutelných celků. Tři je dost na odhalení systému, aniž by vznikl katalog. Čtenář může proskenovat tři titulky, vstoupit přes bod, který je pro něj nejrelevantnější, a pak porovnat úroveň podrobností. Prvek je obzvláště účinný, když by próza jinak třikrát opakovala stejný předmět nebo skryla rozdíl uvnitř dlouhé věty.

Strojová extrahovatelnost je schopnost softwaru izolovat obsahovou jednotku bez ztráty jejího předmětu nebo vztahů. Typovaný třísloupcový infobox odhaluje jedno nadřazené téma a tři seřazené podřízené prvky. Vyhledávací systémy, obsahová API a nástroje pro AI retrieval dokáží zachovat společný titulek, titulek každé položky, každé tělo a pořadí zdroje, místo aby hádaly, zda odstavec obsahuje seznam. Explicitní nadpisy také poskytují každé položce užitečný štítek pro vyhledávání.

Extrakce funguje jen tehdy, když jsou slova soběstačná. „Technická jistota znamená, že se stránka vykresluje a odkazy fungují" může přežít mimo rozvržení. „Třetí část se o to stará" nemůže. Struktura také nedokáže vyrobit třetí myšlenku. Postupujte podle pravidel psaní prvků : nejprve stanovte obsahový model, pak zvolte renderovací nástroj. Požadavek specifický pro prvek na přesně tři položky má přednost před jakýmkoli obecným povolením opakovatelných položek.

Kdy jej použít

Použijte třísloupcový infobox pouze tehdy, když projde všech pět testů:

1. Jeden společný titulek může přesně řídit celý prvek.
2. Téma se přirozeně dělí na přesně tři body.
3. Všechny tři body odpovídají na stejnou implicitní otázku.
4. Každý bod si zaslouží podobnou hloubku, důkazy a vizuální váhu.
5. Každý bod lze vysvětlit v jednom nebo dvou krátkých odstavcích bez vnořené struktury.

Mezi silná použití patří tři složky rámce, tři odpovědnosti vlastníka, tři dimenze kvality, tři výsledky jedné schopnosti nebo tři kontroly prováděné ve stejné fázi. Vztah může být doplňkový, sekvenční nebo kategoriální, ale musí být uveden. Pokud autor nedokáže dokončit větu „Tyto tři patří k sobě, protože…“, je seskupení pravděpodobně vizuální výplň.

Nejčastější chybou je skutečná dvojice plus slabá třetí položka. „Lidé, proces a další" se nestane třídílným modelem jen proto, že rozvržení má tři sloty. Ani „Rychlost, přesnost a hodnota", když článek definuje pouze rychlost a přesnost a hodnotu považuje za jejich výsledek. Ponechte dvojici, vysvětlete výsledek v próze nebo zvolte jiný prvek.

Nepoužívejte tento infobox pro tři sekvenční instrukce. Sloupce oslabují posloupnost, zvláště když se při úzkých šířkách skládají pod sebe; použijte seznam kroků, když záleží na pořadí dokončení. Nepoužívejte jej pro tři produkty hodnocené podle několika kritérií; použijte srovnávací tabulku. Nepoužívejte jej pro seznam, který dnes náhodou obsahuje tři fakta, ale při příští aktualizaci může získat čtvrtý. Pevná třísloupcová smlouva je vhodná pouze tehdy, když je trojice vlastní dané myšlence.

Mezi další chyby patří nadpis plus dvě skutečné položky, jedna položka obsahující všechny výhrady, tři propagační tvrzení bez mechanismu nebo důkazů a jeden segment publika rozdělený do tří libovolných demografických skupin. V každém případě rozvržení nadhodnocuje vztah, který obsah nezasloužil.

Kam jej umístit

Umístěte infobox bezprostředně za odstavec, který představuje nadřazenou myšlenku. Tento odstavec by měl vysvětlit, proč třípohledový náhled pomáhá; společný titulek pak pojmenuje model a položky definují jeho části. Následujte prvek interpretací, důkazy nebo přechodem, který se vztahuje na skupinu jako celek.

Může se objevit přímo pod H2, když tento nadpis poskytuje společný titulek a nezasahuje mezi ně žádný odstavec nebo komponenta. Může také následovat po definici, když tři položky rozbalí dimenze pojmu. Nesmí přerušit tvrzení a jeho citaci, varování a podmínku, která ho spouští, krok a jeho očekávaný výsledek nebo větu, která uvádí běžný seznam. Tyto vztahy musí zůstat pohromadě.

Neumísťujte jej bezprostředně vedle jiné třísloupcové mřížky, cenové tabulky, ovládacího prvku záložek, karet nebo třímožné výzvy k akci. Opakovaná geometrie způsobuje, že redakční vysvětlení vypadá interaktivně nebo komerčně, a nutí čtenáře odhadovat, které seskupení je důležité. Vložte vysvětlující prózu nebo zvolte jednu strukturu, která nese celý vztah. Vyhněte se umístění druhého infoboxu ve stejné krátké sekci; opakování mění záměrný model v dekorativní nábytek.

Na dlouhé stránce je více třísloupcových infoboxů přijatelných pouze pod různými nadpisy a pro skutečně odlišné modely. Neměly by být používány jako výchozí zacházení pro každé trio v textu.

Anatomie

Anatomie obsahuje jednu nadřazenou oblast a tři opakované oblasti položek. Označený snímek obrazovky by měl identifikovat sémantické části, nikoli barvy, poloměr nebo rozestupy, aby specifikace přežila redesign.

1. Vnější ohraničení: Seskupuje titulek a všechny tři položky jako jednu redakční jednotku.
2. Společný titulek: Pojmenovává myšlenku rozdělenou třemi položkami. Není to čtvrtá položka.
3. Volitelný slot pro ikonu: Obsahuje jednu schválenou dekorativní ikonu na položku; všechny tři sloty se používají společně nebo se vynechávají společně.
4. Titulek položky: Pojmenovává jednoho člena sady jazykem paralelním k ostatním dvěma titulkům.
5. Tělo položky: Vysvětluje tohoto člena ve srovnatelné hloubce a zůstává smysluplné při extrakci.
6. Vztah rozvržení: Používá tři stejné sloupce tam, kde to prostor dovolí, a na úzkých obrazovkách skládá položku jedna, pak dva, pak tři pod sebe.

Autoři řídí titulky, těla, tokeny ikon a pořadí zdroje. Renderovací nástroj řídí šířku sloupců, mezery, zlomové body, okraje, pozadí a typografii.

Příklady provedení

Existuje jeden sémantický prvek se čtyřmi podporovanými variantami a jedním responzivním stavem. Žádný nemění přesný třípoložkový závazek.

Výchozí varianta s titulky: Preferovaná pro vysvětlující obsah. Společný titulek a tři titulky položek činí hierarchii explicitní; žádné ikony nejsou přítomny.

Varianta s ikonami: Přidá jednu dekorativní ikonu ke každé položce. Ikony musí sdílet rodinu, velikost a vizuální váhu. Kombinace ikony, fotografie a prázdného slotu není podporována.

Varianta s kontextovým titulkem: Bezprostředně předcházející H2 poskytuje společný titulek. To je povoleno pouze tehdy, když kontejner může programově odkazovat na tento viditelný nadpis a nic neodděluje nadpis od prvku.

Kompaktní varianta: Vhodná pro tři krátké definice nebo kontroly. Každé tělo je stále celá věta, nikoli slogan nebo fragment štítku.

Stav pro úzké zobrazení: Položky se skládají vertikálně v autorském pořadí. Žádné znění nesmí záviset na levé, střední nebo pravé pozici.

Parametry

Smlouva odděluje autorský význam od prezentace. Responzivní sloupce a stylování ikon patří renderovacímu nástroji; obsahová pole a sémantické pořadí patří zdroji.

Titulek je povinný, pokud bezprostředně předcházející nadpis neposkytuje stejné nadřazené téma a neoznačuje kontejner. Obsah položky může obsahovat zvýraznění, inline kód a jeden relevantní textový odkaz. Nesmí obsahovat vnořené nadpisy, tabulky, seznamy delší než tři krátké odrážky, média, formuláře, výzvy k akci nebo jinou komponentu.

Syntaxe a příklady kódu

Všechny tři zápisy zachovávají stejný titulek, tři seřazené položky, volitelné tokeny ikon a těla. Přenosná Markdown direktiva je kanonický zdroj. Hugo a WordPress jsou adaptérové smlouvy a musí odmítnout jakýkoli jiný počet položek než tři.

Přenosná Markdown direktiva

:::infobox-3-columns
## A publishable page needs three kinds of confidence

::item{icon="reader"}
### Reader confidence

The answer is clear, complete, and specific enough to guide a decision or action.
::

::item{icon="editorial"}
### Editorial confidence

Claims are supported, terminology is consistent, and every required qualification remains attached.
::

::item{icon="technical"}
### Technical confidence

The page renders, links resolve, metadata maps correctly, and machines can recover its structure.
::
:::

První nadřazený nadpis se mapuje na title. Každý ::item mapuje svůj první nadpis na item.title, zbývající tělo na item.content a volitelný atribut icon na schválený token ikony. Jsou vyžadovány tři vnořené položky, i když se rozvržení skládá.

Mapování zkratek Hugo

{{< infobox-3-columns title="A publishable page needs three kinds of confidence" variant="icons" >}}
  {{< infobox-item title="Reader confidence" icon="reader" >}}
  The answer is clear, complete, and specific enough to guide a decision or action.
  {{< /infobox-item >}}
  {{< infobox-item title="Editorial confidence" icon="editorial" >}}
  Claims are supported, terminology is consistent, and every required qualification remains attached.
  {{< /infobox-item >}}
  {{< infobox-item title="Technical confidence" icon="technical" >}}
  The page renders, links resolve, metadata maps correctly, and machines can recover its structure.
  {{< /infobox-item >}}
{{< /infobox-3-columns >}}

Toto je specifikace přenosného adaptéru, nikoli příslib, že aktuální web tyto zkratky registruje. Používá pouze pojmenované parametry, zachovává pořadí zdroje, validuje tokeny ikon a při autorské validaci selže, místo aby tiše zahodil nebo zabalil položku navíc.

WordPress blok

<!-- wp:amicited/infobox-3-columns {"title":"A publishable page needs three kinds of confidence","variant":"icons"} -->
  <!-- wp:amicited/infobox-item {"title":"Reader confidence","icon":"reader"} -->
  <p>The answer is clear, complete, and specific enough to guide a decision or action.</p>
  <!-- /wp:amicited/infobox-item -->
  <!-- wp:amicited/infobox-item {"title":"Editorial confidence","icon":"editorial"} -->
  <p>Claims are supported, terminology is consistent, and every required qualification remains attached.</p>
  <!-- /wp:amicited/infobox-item -->
  <!-- wp:amicited/infobox-item {"title":"Technical confidence","icon":"technical"} -->
  <p>The page renders, links resolve, metadata maps correctly, and machines can recover its structure.</p>
  <!-- /wp:amicited/infobox-item -->
<!-- /wp:amicited/infobox-3-columns -->

Editor by měl zobrazit tři pevné sloty pro položky. Může autorovi umožnit změnit pořadí položek, ale nesmí nabízet neomezený vkladač, který by povolil čtvrté dítě nebo nesouvisející blok.

Příklady

Dobrý příklad: skutečný třícestný provozní model

Toto funguje, protože společný titulek definuje jeden model odpovědnosti, tři role jsou odlišné a každé tělo odpovídá na stejnou otázku: co musí tento vlastník ověřit? Položky používají paralelní názvy podstatných jmen a srovnatelnou hloubku. Žádná neexistuje jen proto, aby zaplnila řádek.

Špatný příklad: dvojice doplněná na tři

Tři způsoby, jak vylepšit vstupní stránku

Vyjasněte nabídku: Pojmenujte publikum, problém, mechanismus a očekávaný výsledek jazykem, který čtenář může ověřit.

Dokažte tvrzení: Přidejte relevantní důkazy, vysvětlete jejich omezení a udržujte citace připojené k tvrzením, která podporují.

Udělejte to atraktivní: Přidejte pěkné barvy a cokoli dalšího, co působí poutavě.

První dvě položky jsou redakční požadavky s měřitelnými výstupy. Třetí je vágní vizuální rada, nemá odpovídající standard důkazů a dělá jinou práci. Byla přidána, protože design požadoval tři sloupce, nikoli proto, že model má tři části. Odstraňte třetí položku a použijte dvoudílnou strukturu, nebo definujte skutečný třetí požadavek, například snížení interakčního tření, a podpořte jej ve stejné hloubce.

Schema markup a přístupnost

Třísloupcový infobox nemá žádný vyhrazený typ Schema.org a nevytváří žádná samostatná strukturovaná data. Jeho text zůstává součástí okolního prvku Article, TechArticle nebo WebPage, pokud daná stránka splňuje podmínky. Neoznačujte podřízené prvky jako ItemList jen proto, že jsou tři, a neodvozujte HowTo ze sekvenčně znějících popisků. Napájejte schema na úrovni stránky pouze tehdy, když základní obsah nezávisle splňuje požadavky daného schematu.

Použijte jeden označený sémantický kontejner se třemi podřízenými sekcemi. Použijte <section>, když je model součástí hlavního argumentu, a <aside>, když je doplňkový. Propojte viditelný společný titulek pomocí aria-labelledby a každému dítěti dejte skutečný nadpis na správné úrovni dokumentu. Tučný text není náhradou za nadpis.

Pořadí zdroje je pořadím čtení. Čtečky obrazovky, klávesová navigace, zkopírovaný text a mobilní rozvržení musí narazit na položku jedna, pak dva, pak tři. CSS může vytvářet sloupce, ale nesmí používat pravidla pro změnu pořadí k jejich přeskupení. Nikdy nepoužívejte výrazy „vlevo", „uprostřed" nebo „vpravo"; tyto pozice zmizí, když se položky skládají pod sebe.

Ikony jsou dekorativní, pokud nesdělují informace, které nejsou v titulku. Dekorativní ikony používají v HTML aria-hidden="true" nebo prázdný alternativní text, když jsou vykresleny jako obrázky. Pokud je ikona informativní, musí se její význam objevit také ve viditelném textu; přístupný název skrytý před zraky nepomáhá čtenářům, kteří stránku vidí, ale nedokáží symbol interpretovat. Barva a tvar ikony nesmí být nikdy jediným rozlišením mezi položkami.

Při úzkých šířkách skládejte položky dříve, než se text stane stísněným. Podporujte zoomování textu bez ořezávání, překrývání nebo horizontálního posouvání na úrovni stránky. Snímek obrazovky se třemi sloupci není náhradou za responzivní sémantický obsah.

Pravidla psaní

Začněte větou: „Tato myšlenka má tři části: X, Y a Z." Tato věta musí zůstat přesná po definování každé části. Pokud je jedna část výsledkem ostatních dvou, širokým shrnutím nebo menším příkladem, model není skutečně paralelní.

Použijte přesně tři položky. Udržujte každý titulek na 2–7 slovech a používejte stejný gramatický vzor: tři jmenné fráze, tři otázky nebo tři časové štítky. Udržujte každé tělo pokud možno na 25–80 slovech a nikdy nepřekračujte 110 slov. Rozdíl jedné věty je přijatelný. 25slovná položka vedle dvou 100slovných položek vyžaduje úpravu nebo jinou strukturu.

Srovnatelná hloubka znamená srovnatelnou vysvětlovací práci, nikoli výplň. Každé tělo by mělo odpovídat na stejnou implicitní otázku, obsahovat podobnou úroveň konkrétnosti a uvádět důsledky na podobné úrovni. Pokud jedna položka skutečně potřebuje více vysvětlení, přesuňte model do běžných sekcí, kde se délka může poctivě lišit.

Používejte přímý, neutrální jazyk. Titulky by měly identifikovat význam, nikoli pozici: „Objevování / Produkce / Revize" je silnější než „První / Druhý / Třetí." Sekvenční popisky jsou přijatelné pouze tehdy, když každá položka shrnuje fázi spíše než instruuje čtenáře prostřednictvím kroků. Vyhněte se superlativům, nepodloženým tvrzením o přínosech a třem sloganům maskovaným jako vysvětlení.

Ikony jsou volitelné. Použijte všechny tři nebo žádnou, vyberte je z jedné schválené rodiny a udržujte je vizuálně konzistentní. Nevybírejte ikony před titulky, nepoužívejte emodži jako produkční tokeny ikon a nenechte ikonu nahradit smysluplný nadpis položky.

Nikdy nedávejte dovnitř prvku:

• Dvě nebo čtyři položky, prázdnou položku nebo „různý" třetí slot.
• Podrobný postup, srovnávací matici, cenový plán, formulář, kolotoč recenzí nebo propagační banner.
• Vnořené sekce H2, další infobox, záložky, accordion panely, video nebo galerii obrázků.
• Dlouhé seznamy odrážek, seznamy zdrojů, právní prohlášení, bezpečnostní varování nebo kvalifikace oddělené od tvrzení, která řídí.
• Tři nesouvisející odkazy stylizované tak, aby připomínaly rovnocenné výzvy k akci.

Když obsah tyto limity překročí, povýšte tři položky na běžné sekce stránky. Pevné rozvržení by se nikdy nemělo stát důvodem ke komprimaci zásadních nuancí nebo skrytí kvalifikace.

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

Pole postTypes v front matter je registrovaná sada použití. Identifikuje formáty, které často obsahují smysluplný třídílný model; nevyžaduje infobox, když zdroj nemá skutečné trio.

Kontrolní seznam QA

• Jedna nadřazená myšlenka: Přesný společný titulek vysvětluje, proč všechny tři položky patří k sobě.
• Přesně tři položky: Zdroj a vykreslený výstup obsahují tři kompletní děti — nikdy dvě, čtyři nebo prázdné místo.
• Skutečné třícestné dělení: Odstranění libovolné položky činí model neúplným; žádná není výplň, výsledek nebo různá kategorie.
• Paralelní titulky: Všechny titulky položek používají stejný gramatický tvar a identifikují význam, nikoli pozici na obrazovce.
• Srovnatelná hloubka: Každé tělo odpovídá na stejnou implicitní otázku se srovnatelnými podrobnostmi a důkazy.
• Užitečné umístění: Prvek následuje svůj uvádějící kontext a neodděluje tvrzení, varování, krok nebo citaci od jejich závislého obsahu.
• Bezpeční sousedé: Není sousedem jiné třísloupcové mřížky, cenového bloku, ovládacího prvku záložek nebo třímožné CTA.
• Extrahovatelné znění: Společné a individuální titulky pojmenovávají své předměty; těla se nespoléhají na blízká zájmena nebo vizuální pozici.
• Konzistence ikon: Všechny tři položky používají schválené ikony z jedné rodiny, nebo žádná položka ikonu nepoužívá; význam zůstává v textu.
• Responzivní pořadí: Mobil skládá položku jedna, pak dva, pak tři bez ořezávání, horizontálního posouvání nebo přeskupování pomocí CSS.
• Přístupná sémantika: Kontejner má viditelný programový štítek, titulky položek jsou nadpisy a dekorativní ikony jsou skryty před asistenčními technologiemi.
• Obsahové limity: Těla zůstávají do dvou krátkých odstavců a neobsahují žádnou vnořenou komplexní komponentu, postup nebo propagační ovládací prvek.
• Parita zápisu: Přenosný Markdown, Hugo a WordPress zachovávají stejný titulek, tři položky, tokeny ikon, těla a pořadí.
• Zdrženlivost schema: Renderovací nástroj neodvozuje seznam, srovnání nebo návod markup z třísloupcové prezentace.

Recenzent by měl prvek odmítnout, když selže počet položek, skutečná třícestná logika nebo srovnatelná hloubka. To jsou vady obsahového modelu; vizuální vyleštění je nemůže opravit.

FAQ

Položky FAQ v front matter pokrývají pevný počet položek, srovnatelnou hloubku, volitelné ikony, mobilní pořadí a zdrženlivost schema. Akademická šablona může tyto schválené odpovědi vykreslit bez duplikace v těle.