Odstavcové styly

Již jsme si vysvětlili, že základním nástrojem pro ovládání vzhledu a strukturování dokumentu je stylování. Jeho základem jsou odstavcové styly, o kterých si nyní povíme víc, a také si ukážeme nejčastější chyby, kterých se autoři dopouštějí.

Nadpisy

Titulek nad tímto sloupcem („Odstavcové styly") je nadpis nejvyšší úrovně (h1). Říká čtenáři jaké je základní téma stránky. Bez něj může být čtenář zmatený, nebo rychleji příjde na to, že stránka žádné téma nemá. Na každé stránce by měl být jediný nadpis h1. Více nadpisů h1 považují některé hledačky za hloupý SEO trik a snižují jim rating. Nejčastěji bude h1 vévodit pravému sloupci (dvousloupcový design s širokým pravým sloupcem), nebo střednímu sloupci (třísloupcový design se širokým středním sloupcem). Pro použití v úzkých bočních sloupcích není příliš vhodný.

Nadpis „Nadpisy" nad předchozím odstavcem je nadpisem druhé úrovně (h2). Vidíme že je menší než h1, může se na stránce vyskytovat vícekrát a je nadpisu h1 v hierarchii stránky podřízen. Podobně můžeme vytvářet další podřízené nadpisy:

Toto je nadpis h3

... a toto nadpis h4

Pomocí nadpisů dělíme (strukturujeme) text tak, abychom čtenáři usnadnili orientaci (jak obsahovou, tak vizuální). To v praxi obvykle znamená, že vždy po několika textových odstavcích vložíme mezititulek, kterým čtenáři vysvětlíme (vnutíme) co si má o následujícím textu myslet.

Odstavec

Toto je základní odstavec (p, paragraph). Staří sazeči mu říkali „chlebový", nese totiž podstatu obsahu, vše ostatní je jen onou „třešničkou". V CKEditoru Liferay je označován jako „normální" (Normal).  V základním stylu je nastaven jako zarovnaný na obou stranách (justify) s malou mezerou za odstavcem. Aplikujeme-li jej v úzkém sloupci, může být oboustrané zarovnání  příčinou rozpadu textu (vzniknou velké mezislovní mezery). Potom použijeme zarovnání vlevo (tlačítko v horní nástrojové liště).

Do celkového stylování ostavců bychom neměli zasahovat. Zato v odstavci (p) můžeme některá slova zdůraznit. Nejpříjemnějším zdůrazněním je kurzíva (italic), skoro nemění ductus (hustotu, tmavost) písma, a proto jen málo narušuje hladké plynutí sazby. Mnohem brutálnější je zvýraznění tučným písmem (bold). Můžeme také zdůrazňovat tučnou kurzívou. Někdy potřebujeme ukázat něco nevhodného, nebo naznačit provedenou změnu či opravu. K tomu poslouží přeškrtnutý text.

Editory obvykle také nabízejí podtržení textu. To může být použitelné ve velmi specifických případech (matematika), ale rozhodně se nehodí pro zdůrazňování textu (snižuje čitelnost a na webu je podtržení určeno k vyznačení odkazů). Nevhodné je také SÁZET VELKÉ ČÁSTI TEXTU JEN VELKÝMI PÍSMENY. Mnohem vhodnější jsou kapitálky (viz nadpisy h1 až h3), které se lépe čtou, zachovávají rozdíl mezi velkými a malými písmeny a jsou typograficky vhodnější. Naprostým zločinem je zdůrazňovat D Ů L E Ž I T Ý  Č I  Ú Ú Ž A S N Ý  T E X T prokládáním znaků mezerami uvnitř slova. Takový text je velmi špatně čitelný a editor jej považuje za skupinu jednoznakových slov. Protože se řádek může přelomit na kterékoliv mezeře, tak snadno dosáhneme mnoha nechtěných efektů... 

Češtinářka nám kdysi tvrdila, že odstavce mají rozdělovat text na jednotlivé myšlenky tak, aby usnadnily čtení a pochopení obsahu. V praxi se však často myšlenky v textu špatně hledají, proto omezujeme odstavce na délku 4 až 10 řádků. Šetříme tak i city čtenáře, který se delšího souvislého bloku textu bojí a špatně se v něm orientuje.

Seznamy

Šikovným prvkem pro strukturování textu jsou seznamy (výčty, odrážky). Nám mohou zjednodušit práci a čtenáčům zpřehlednit text. Jsou buď uspořádané (ol, ordered list), nebo neuspořádané (ul, unordered list).

  1. Toto je příklad uspořádaného seznamu
    1. Položky jsou označeny čísly či písmeny
    2. Konktétní způsob číslování (arabská čísla, římská čísla, malá či velká písmena) lze nastavit pomocí CSS stylu (z CKeditoru Liferay je toto nastavení nedostupné)
    3. Také lze určit, zda má být číslování vysunuto z bloku textu, nebo uvnitř tohoto bloku. To lze nastavit pomocí CSS stylu (z CKeditoru Liferay je toto nastavení nedostupné)
      1. Seznamy můžeme strukturovat do více úrovní (jako tento blok)
        1. ... a ještě hlouběji
          1. a dál
            1. a dál
  2. Uspořádané styly používáme tam, kde má číslování skutečně smysl (například se na jednotlivá čísla chceme odvolávat v dalším textu). Ve čtivém textu psaném v novinářském duchu (a takových by na webu měla být vždy většina) nemá ol co dělat.
  • Toto je příklad neuspořádaného seznamu
  • Položky jsou uvedeny „bullety"
  • Bulety lze měnit stylováním (černý kroužek, čtvereček...)
  • Zajímavé může být definování obrázku místo std. bulletu
    • Podobně jako u číslovaného seznamu můžeme zasouvat či vysouvat bullet z bloku a strukturovat do více úrovní
  • Je vhodný i pro články psané lehkým perem dobrého novináře