Jak se starat o web

Motivace

Při přidávání nebo úpravách obsahu na webu je potřeba dodržovat několik věcí. Důvodem je správná struktura webu, která je důlěžitá pro:

• dobré SEO (co nejvyšší pozici ve vyhledávačích),
• přístupnost webu (lidé s různými hendikepy používají v různých situacích různé nástroje, aby byli schopni k infromacím na webu přistupnovat,
• rychlost webu (platí zejména v případě obrázků a dalších médií),
• design webu (obsah je naformátovaný tak, aby vypadal dobře za dodržení určitých pravidel).

Texty

Vkládání textů

Pokud vkládáte text do webu z jiné stránky nebo z programů v počítači (Word, Google documents a podobné), dejte si pozor, abyste s sebou nepřenesli i formátování textů. Původní formátování textu může rozbít vizuál zbytku stránky (obsahu dole, patičky a apod).

Ideální je text vložit do poznámkového bloku (nebo jiného editoru, který formátování odstraní) a teprve potom vložit text do webu a naformátovat.

Hierarchie nadpisů

Není třeba nad tím extra bádat, je to, jako byste psali např. nějakou bakalářskou práci.

• Stránka mí vždy jen jeden nadpis úrovně H1, který je zpravidla daný názvem stránky (pokud design webu neurčí jinak – to bych vám řekla).
  • V analogii k bakalářské práci by to byl název celé práce.
• Následují nadpisy úrovně h2, které tvoří strukturu stránky a dělí ji na menší části.
  • V analogii k bakalářské práci by to byly hlavní kapitoly celé práce.
• Za H2 následují H3, které jednotlivé H2 kapitoly dělí na menší celky.
  • V analogii k bakalářské práci by to byly podkapitoly hlavních kapitol celé práce.
• Následují ve stejné logice H4 a H5 (ty jsou ovšem potřeba málokdy), pokud chcete části H3, příp. H4) rozdělit dále na menší celky.

Nepoužívejte úrovně nadpisů k formátování textu! Účel dělení stránky na kapitoly je z důležitý z pohledu logické struktury dokumentu, nikoli vizuální.

K tomu slouží grafické styly, které vám ráda doupravím podle přání.

Příkladová struktura webu

Struktura webu pak může vypadat (struktura tohoto příspěvku):

Jak se starat o web [H1]
  - Motivace[H2]
  - Texty [H2]
     - Hiearchie nadpisů [H3]
        - Příkladová struktura webu [H4]
     - Strukturovaný text [H3]
  - Obrázky [H2]
     - Velikost obrázku [H3]
     - Jak vyplnit atributy u obrázků [H3]

Strukturovaný text

Strukturovaný text je skvělý z několika důvodů:

• návštěvníkům webu pomáhá najít rychle informace, které potřebují (a zjistit, zda je pro ně daná stránka vůbec relevantní),
• zrychluje čtení textu,
• zlepšuje porozumění textu,
• můžete lidem zvýraznit důležité sekce, které by jinak “zapadly”.

Příkladem je tento příspěvek. Namísto dlouhých odstavců používám nadpisy, výčty, kurzívu, tučné písmo, obrázky… a cokoli dalšího je vhodné, aby byla stránka strukturovaná. (Podržený text prosím nechte pro odkazy! Formátují se podtržené automaticky).

Prolinkování textů

Skvělé jsou interní i externí odkazy. Můžete tak propojit obsah článku s dalším obsahem, který je na vašem nebo jiném webu. A z hlediska SEO budete mít plusové body.

• interní – odkaz vede na jinou stránku na stejném webu (na stejné doméně/adrese).
• externí – odkaz vede na stránku mimo web (na jinou doménu/adresu).

Obrázky

Velikost obrázku

Velikost obrázku se odvíjí od místa, kam obrázek “přistane”. Jinou velikost mají náhledové obrázky příspěvků, jinou obrázky v galeriích, obráky na pozadí, ikony a další… Ideální velikosti jsou:

• obrázek přes celou šířku webu: 2500px
• obrázek do galerií (klasické, produkty…): 1500px
• obrázek přes cca polovinu šířky webu: 1000px
• obrázek na cca čtvrtinu šířky webu: 500px

Dávat na web obrázky větší než 2500px nemá žádnou výhodu a spíše mu uškodí. Zbytečně se zvětšuje celková velikost webu (a tím i jeho následná záloha), protože obrázek zůstane schovaný na serveru v originální velikosti, aby se z něj mohly vytvářet menší kopie (pro náhledy, atd).

Pokud si nejste jisti, jakou velikost zvolit, dejte mi prosím vědět.

Jak vyplnit atributy u obrázků

U každého obrázku ve WordPress se dá vyplnit několik atributů (vyplnit je třeba jen jeden):

• Alternativní text (Alternative Text): jediná věc, kterou je potřeba vyplnit, a to z několika důvodů:
  • SEO – popisky se mohou zobrazit v Google obrázcích a dalších místech,
  • přístupnost – uživatel, který nevidí, bude i tak vědět, co má na obrázku být,
  • chyba při načtení – pokud se obrázek nenačte, zobrazí se alternativní popisek jako náhrada.
• Název (Title): osobně nevyplňuji – zobrazí se při najetí na obrázek na webu jako nažloutlý čtvereček.
• Titulek (Caption): osobně nevyplňuji – někdy ho využívají pluginy pro galerie a podobné.
• Popis (Description): osobně nevyplňuji – někdy ho využívají pluginy pro galerie a podobné.

Videa

Ideální způsob je vložit video na web z externího zdroje, tj. nahrát ho např. na Youtube nebo Vimeo a odkaz vložit do webu (WordPress na to má užitečné moduly). Případně jako embedded video (iframe).

Pokud chcete opravdu video mít přímo na webu, pak se ujistěte, že má dostatečnou kompresi a jeho velikost je v řádech jednotek MB. Video delší než 1 minuta doporučuji dát do externího zdroje.

Aktualizace

Pokud řešíte aktualizace sami, postup doporučuji následující:

1. záloha webu (ujistěte se, že je v pořádku a kompletní)!
2. aktualizace pluginů (pokud je třeba)
   • u složitějších webů kontroluji stav webu po každém aktualizovaném pluginu (tj. udělám update jednoho z pluginů, zkontroluji web, udělám udpate dalšího),
   • neaktivní pluginy odstraňte (pokud nemáte zvláštní důvod je tam mít),
   • update pluginů začínám těmi, které závisí na jiných pluginech a na konci vezmu ty “hlavní”:
     • např: nejprve aktualizuji plugin na faktury a teprve potom woocommerce, nebo nejprve aktualizuji doplňky elementoru a teprve potom Elementor,
     • buildery a woo aktualizuji jako poslední,
3. aktualizace šablon (pokud je třeba),
   • neaktivní šablony odstraňte (pokud nemáte zvláštní důvod je tam mít),
4. aktualizace WordPress (pokud je třeba),
5. aktualizace PHP (pokud je třeba),
6. kontrola webu – vizuál, funkční formuláře, průchod obchodem, členské sekce, cokoli dalšího na webu je.

Pozn: Osobně nepouštím aktualizaci pluginu/šablony/WP, jehož nová verze končí na “.0” (např. 6.2.0) – je pravděpodobné, že brzy přijde nějaká malá oprava.