Práce s texty pro web, tabulkami a obrázky (nadpis první úrovně H1)

Každá stránka musí obsahovat právě jeden nadpis první úrovně (označovaný Hlavička 1 nebo H1). Protože často nebudou návštěvníci webu číst celý text, shrňte vše nejdůležitější, o čem stránka pojednává, v tzv. PEREXU (úvodní odstavec). Ten je výraznější než klasický odstavcový text a měl by následovat ihned pod nadpisem první úrovně (H1). Doporučená délka perexu je cca 300 znaků včetně mezer.

Texty na webu  (nadpis druhé úrovně H2)

Za nadpisem druhé úrovně by měl následovat PEREX 2, který je méně výrazný oproti perexu 1., přesto výraznější než klasický text.

Uživatelé na webu nečtou, ale prohlíží. Z tohoto důvodu je zbytečné vytvářet na webu dlouhé texty. Pokud je však již máte, rozdělte je do jednotlivých obsahových bloků,

které budou logicky uspořádané, jasné a opatřené nadpisem (H2, H3, atd. v

logickém pořadí).

Nezapomeňte využívat odstavců, pokud je text delší. Zvyšuje se tím jeho přehlednost. Důležité informace umístěte do prvních dvou odstavců.

Je totiž velice pravděpodobné, že to, co je umístěno níže na stránce, si

uživatelé nikdy nepřečtou.

Odrážky (nadpis třetí úrovně H3)

Máte-li na stránce několik odstavců za sebou, vytvořte k druhému nebo třetímu odstavci nadpis třetí úrovně (H3). Nadpis by měl obsahovat klíčová slova, která vystihují podstatu obsahu, který následuje.

• Výčet důležitých informací stránky napište v odrážkách.
• Uživatelé nečtou dlouhé texty, lépe si zapamatují krátké a výstižné věty.
• Odrážky zpřehledňují obsah stránky.

Tabulky (nadpis H2)

Postup vytvoření tabulky (H3)

1. Vyberete si místo, kde se bude tabulka zobrazovat, a zde klikněte levým tlačítkem myši.
2. V horní nabídce klikněte na ikonu Vložit tabulku (druhá ikona zleva ve spodním řádku)
3. Po otevření kontextové nabídky v záložce Obecné:
   • Nastavte v položce Velikost a Záhlaví počet řádků a sloupců, které bude tabulka mít. Kdykoliv je možné řádky i sloupce doplnit nebo odstranit.
   • Zvolte záhlaví, pokud jej má tabulka mít.
   • Nastavte vzhled samotné tabulky v položce Styl, kde máte předdefinovány třídy tabulky, které můžete zvolit. Nejčastěji bývá využívána třída označená tabulka_obecna_zarovnani_na_levo(pravo)
   • Změny uložte pomocí tlačítka OK, které současně zavře dialogové okno.

4. Orámování tabulky si můžete zapnout kliknutím na ikonu v horní nabídce Přepnout okraje.

Postup nastavení velikosti tabulky (H3)

Tabulka se bude po zveřejnění zobrazovat přes celou šířku stránky, což

může být někdy, např. z důvodů nižšího počtu sloupců, nežádoucí. Upravit šířku tabulky můžete následovně:

1. Klikněte na tabulku pravým tlačítkem myši a z kontextové nabídky vyberte políčko Vlastnosti tabulky.
2. Po otevření dialogového okna v záložce Vzhled:
   • Do pole Šířka vepište procentuální šířku tabulky (100 = zobrazení tabulky přes celou šířku stránky, 50 = zobrazení tabulky do poloviny stránky).
   • V položce Jednotky šířky nastavte procenta. Pro zachování správného zobrazení tabulky na webu používejte jako jednotky šířky pouze procenta.
   • Změny uložte pomocí tlačítka OK, které současně zavře dialogové okno.

3. Při tomto nastavení se bude šířka sloupců přizpůsobovat obsahu v nich, což může být někdy opět nežádoucí. Nastavení pevné šířky sloupců můžete provést následovně:
   
   • Klikněte do první buňky prvního sloupce pravým tlačítkem myši a z kontextové nabídky vyberte Vlastnosti buňky.
   • V otevřeném dialogovém okně v záložce Vzhled vepište do položky Šířka procentuální šířku buňky*, čímž nastavíte šířku prvního sloupce.
   • Změny uložte pomocí tlačítka OK, které současně zavře dialogové okno.
   • Stejným způsobem postupujte i pro ostatní sloupce tabulky.

* Jak správně určit šířku závisí na tom, kolik je v tabulce sloupců. Pokud máte tabulku o 4 sloupcích, z nichž 1. s 4. a 2. s 3. sloupcem mají být stejně široké, nastavíte procentuální šířku 1. a 4. sloupce např. na 15 % a dvou prostředních sloupců potom na 35 % (15+35+35+15=100 %). Součet musí být vždy 100.

Pozn.:Velikost samotné tabulky nemá na určování šířek sloupců vliv. Tzn., že i když tabulce nastavíte 50% šířku (zobrazuje se pouze do poloviny stránky), tak při zadávání šířek sloupcům počítáte se 100 %.

Dodatečné úpravy tabulky (H3)

Pokud budete chtít přidat/odebrat v tabulce řádky/sloupce, klikněte dovnitř tabulky pravým tlačítkem myši a z kontextové nabídky vyberte požadovanou funkci. Daná funkce se vždy vztahuje k buňce, do které si kliknete. Pokud tedy budete chtít přidat další řádek tabulky úplně dolů, kliknete si do libovolné buňky posledního řádku a vyberete Vložit řádek po.

Další

nastavení tabulky z důvodu zachování správného vzhledu stránek

NEDOPORUČUJEME. Pokud budete chtít tabulky s jiným pozadím, okraji,

barvou textů atd., neváhejte nás kontaktovat. Rádi vám je nastylujeme.

Zarovnání textů v tabulce (H3)

Styl tabulky, který jste si nastavili, zaručuje, že obsah v buňce bude zarovnaný k jedné straně. Pokud byste chtěli některý text zarovnat na opačnou stranu, klikněte do buňky a v horní nabídce Použít styl na obsahující prvek vyberte styl vlevo/vpravo.

Styl zarovnání v tabulce se odvíjí od typu obsahu, který představuje příslušný sloupec.

Zarovnání obsahu tabulky vlevo (H4)

Pokud se v tabulce nachází pouze text, použijte zarovnání vlevo. Záhlaví se volí nahoře případně vlevo. Text záhlaví může být vždy zarovnaný vlevo.

Popis pod tabulkou

Zarovnání obsahu tabulky vpravo (H4)

Pokud se v tabulce nachází i číslice, jednotky, značky, aj., použijte pro sloupce, které obsahují tento typ obsahu zarovnání vpravo. Záhlaví se volí nahoře případně vlevo. Text záhlaví může být vždy zarovnaný vlevo.

Obrázky v textu

Obrázek s obtékajícím textem

V následujícím textu je popsán postup pro vložení obrázku do obsahu stránky. Kliknutím myši nastavte kurzor tam, kde chcete mít obrázek umístěn. Klikněte v horní nabídce na ikonu Vložit/upravit obrázek a v nově otevřeném okně vyberte z horní nabídky záložku magický obrázek*, nebo prostý obrázek**. Následně si vyberte ze seznamu souborů obrázek, který chcete vložit. Veškeré obrázky, které vkládáte na web, je třeba prve nahrát do Seznamu souborů.

Pokud na vložený obrázek kliknete levým tlačítkem myši, tak se kolem obrázku zobrazí orámování s vyznačenými body (čtverečky), pomocí kterých je možné ručně tažením myši upravit velikost obrázku.

Zarovnání obrázku můžete změnit pomocí nabídky Použít styl na obsahující prvek (viz Zarovnání textu v tabulkách). Zde můžete vybrat styl obrazek_vlevo/obrazek_vpravo. 

Pokud chcete vytvořit detailní náhled obrázku, tak na obrázek klikněte pravým tlačítkem myši a v kontextové nabídce zvolte Upravit obrázek případně Vlastnosti obrázku. Po otevření dialogového okna zatrhněte políčko Kliknutím zvětšit. Tlačítkem Aktualizovat okno zavřete. Tato funkce má smysl u magických obrázků.

*Magický obrázek
Možnost vložení obrázku jako magický využijte tehdy, pokud nemáte možnost si obrázek před nahráním do Seznamu souborů upravit (velikost, retuš,...), např. v programu Adobe Photoshop, nebo budete chtít vytvořit pro obrázek detailní náhled.

**Prostý obrázek
Možnost vložení obrázku jako prostý využijte tehdy, pokud máte možnost si obrázek předem upravit (velikost, retuš,...) např. v programu Adobe Photoshop, nebo nebudete chtít vytvořit pro obrázek detailní náhled. Výhoda oproti magickému spočívá v tom, že do Seznamu souborů si již nahráváte obrázky v té velikosti, v jaké je poté budete používat na webu. Pokud si obrázek i vyretušujete, tak dosáhnete oproti obrázku magickému lepší kvality. Rozdíl v kvalitě je zřejmý zejména na fotografiích, na které jsou osoby (viz ukázky).

I přesto, že magický obrázek nebude mít takovou kvalitu jako prostý, doporučujeme tuto variantu.