Titulok a meta popis

Modul 3: Technický základ stránky · Čas čítania: 11 minút

Cieľ lekcie: Po tejto lekcii dokážete pre každú stránku napísať dobrý titulok a meta popis, vysvetliť, čo s nimi robí Google a prečo ich niekedy nahradí, a skontrolovať, či sú na vašich vlastných stránkach v poriadku.

Kľúčové pojmy: <title>, odkaz s titulkom (title link), meta popis (<meta name="description">), úryvok (snippet), prepísanie zo strany Google, skrátenie podľa šírky obrazovky, orientačné pravidlo pre dĺžku, jedinečné titulky, názov značky, hromadenie kľúčových slov, nosnippet

Dva riadky v hlavičke vašej stránky

Každá stránka webu začína časťou, ktorú návštevník nevidí: <head>. Sú v nej dva riadky, ktoré sú pre vyhľadávače mimoriadne dôležité:

<head>
  <title>Bruidsboeketten op maat in Amersfoort | Bloemenatelier Lotte</title>
  <meta name="description" content="Een bruidsboeket dat bij jullie dag past. Kom langs voor een gratis kennismaking in ons atelier in Amersfoort, of bekijk eerst onze voorbeelden.">
</head>

Titulok (element <title>) uvidíte na karte prehliadača, v záložkách a najmä vo výsledkoch vyhľadávania. Modrý klikateľný riadok vo výsledku vyhľadávania Google nazýva odkaz s titulkom (title link). Meta popis je krátke zhrnutie stránky. Google ho niekedy použije pre kúsok textu pod odkazom s titulkom: úryvok (po anglicky snippet).

Spolu do veľkej miery rozhodujú o tom, či niekto klikne na váš výsledok, alebo na výsledok niekoho iného. Preto je to jedna z mála vecí vo viditeľnosti, pri ktorej za štvrť hodiny naozaj niečo zmeníte.

Čo robí Google s vaším titulkom

Google to sám formuluje takto: zabezpečte, aby každá stránka mala titulok v elemente <title>, a urobte ho výstižným a stručným. Neurčité titulky ako "Home" alebo "Vitajte" nikomu nič nepovedia.

Google váš <title> väčšinou použije, ale nie vždy. Odkaz s titulkom môže Google vytvoriť aj z iných zdrojov: z najväčšieho nadpisu na stránke (často <h1>), z og:title pre sociálne siete, z výrazného textu na stránke, z textu odkazov, ktoré na stránku smerujú, a z názvu v štruktúrovaných údajoch typu WebSite. Deje sa to najmä v týchto situáciách, ktoré uvádza sám Google:

Ak Google váš titulok prepíše, nie je to trest. Je to znak, že váš titulok stránku neopisuje dostatočne dobre. Ak titulok vylepšíte, Google ho po ďalšej návšteve crawlera často opäť prevezme.

Aký dlhý môže byť titulok?

Tu sa mnohé rady na internete mýlia. Google doslova uvádza, že pre dĺžku <title> neexistuje žiadny limit. Odkaz s titulkom sa však vo výsledkoch vyhľadávania skracuje, aby sa zmestil na obrazovku. Deje sa to podľa šírky obrazovky (v pixeloch), nie po pevnom počte znakov: titulok s mnohými širokými písmenami (m, w) sa skráti skôr ako titulok s úzkymi (i, l).

Preto tento kurz pracuje s orientačným pravidlom, nie s pravidlom od Google: držte titulok približne medzi 15 a 65 znakmi. Kratší býva často príliš neurčitý, pri dlhšom hrozí, že najdôležitejšia časť zmizne. Preto dajte dopredu to, čím stránka je, a názov vašej firmy na koniec.

Ako napísať dobrý titulok

Zo zásad Google a z praxe:

1. Povedzte, o čom stránka je. "Bruidsboeketten op maat in Amersfoort" (svadobné kytice na mieru v Amersfoorte) je lepšie ako "Diensten" (služby).
2. Každá stránka vlastný titulok. Dve stránky s rovnakým titulkom sa vo výsledkoch vyhľadávania nedajú od seba odlíšiť.
3. Názov značky krátko, na začiatku alebo na konci, oddelený znakom ako |, : alebo -. Google odporúča nepripájať ku každému titulku dlhý slogan.
4. Žiadne hromadenie kľúčových slov. "Bloemen Amersfoort, bloemist Amersfoort, boeket Amersfoort goedkoop" nepomáha. Google výslovne uvádza opakovanie kľúčových slov ako niečo, čo pôsobí spamovo; je to dokonca v zásadách proti spamu (lekcia 8.2).
5. Udržiavajte ho aktuálny. Letopočet v titulku znamená, že ho musíte každý rok aktualizovať.

Častá chyba pri nástrojoch na tvorbu webov: domovská stránka sa volá len názvom firmy. "Bloemenatelier Lotte" hovorí, kto ste, ale nie čo robíte ani kde. "Bloemenatelier Lotte | Bloemist in Amersfoort" funguje lepšie pre niekoho, kto vás ešte nepozná.

Meta popis

Meta popis sa nachádza v elemente <meta>:

<meta name="description" content="...">

Google uvádza: úryvok pochádza najmä zo samotného obsahu stránky. Meta popis sa použije, ak stránku vystihuje lepšie ako časť textu zo stránky. Navyše sa úryvok môže líšiť podľa vyhľadávacieho dopytu: Google zobrazí časť, ktorá k dopytu najlepšie sedí. Dobrý meta popis teda nie je zárukou, že sa zobrazí, ale zvyšuje šancu, že pod vaším titulkom bude niečo rozumné.

Aj tu platí: Google nepozná žiadnu maximálnu dĺžku, ale úryvok sa skracuje, aby sa zmestil na obrazovku. Orientačné pravidlo v tomto kurze: 70 až 160 znakov. Dosť dlhý na to, aby niečo povedal, a dosť krátky na to, aby zostal zobrazený celý.

Takto ho napíšete:

• Zhrňte, čo človek na stránke nájde, bežnými vetami.
• Uveďte konkrétne údaje, ktoré pomáhajú pri výbere: miesto, čo ponúkate, pre koho.
• Každá stránka vlastný popis. Ak máte málo času, začnite domovskou stránkou a najnavštevovanejšími stránkami; to odporúča aj sám Google.
• Žiadny zoznam kľúčových slov. Google píše, že takéto popisy sa ako úryvok používajú menej často.

Čo meta popis nerobí: nie je to faktor hodnotenia, s ktorým by ste pomocou kľúčových slov získali vyššiu pozíciu. Slúži na to, aby presvedčil hľadajúceho kliknúť.

Sami rozhodnite, čo sa zobrazí

Chcete, aby Google nezobrazoval žiadny úryvok, alebo len jeho časť? Dá sa to pomocou meta pravidla robots: <meta name="robots" content="nosnippet"> (žiadny úryvok) alebo max-snippet:50 (najviac 50 znakov). Časť textu môžete vylúčiť atribútom data-nosnippet. Pre väčšinu malých webov to nie je potrebné.

Kde to uvidíte a skontrolujete

• V zdrojovom kóde: otvorte svoju stránku, kliknite pravým tlačidlom a zvoľte "Zobraziť zdroj stránky" (alebo Ctrl+U). Pomocou Ctrl+F vyhľadajte <title a description.
• Vo výsledkoch vyhľadávania: vyhľadajte site:example.com a uvidíte, ako Google vaše stránky zobrazuje. Ak sa odkaz s titulkom líši od vášho <title>, pozrite sa, ktorá situácia z tabuľky vyššie sedí.
• V Search Console: prehľad Performance (lekcia 2.3) ukazuje, ktoré stránky majú veľa zobrazení, ale málo kliknutí. Tam sa lepší titulok a popis oplatia najviac.

V praxi: nastavenie titulku a popisu

• V AI Builder od WebOké zadáte pre každú stránku vlastný titulok a popis. Ak titulok necháte prázdny, bežná stránka dostane titulok "Názov stránky | Názov webu" a domovská stránka sa bude volať len ako váš web. Preto domovskej stránke dajte vlastný titulok, ktorý povie aj to, čo robíte. Kontrola SEO v AI Builder upozorní na titulok dlhší ako 65 znakov a popis dlhší ako 160 znakov: rovnaké orientačné pravidlá ako v tomto kurze.
• Vo WordPress vytvára WordPress titulok sám z názvu stránky a názvu webu. Meta popis WordPress sám nevytvorí; na to použijete SEO plugin alebo tému, ktorá to ponúka. Táto téma sa preberá aj v kurze WordPress, lekcia 9.2.

V iných nástrojoch na tvorbu webov to funguje podobne: hľadajte nastavenia ako "SEO", "Vyhľadávače" alebo "Nastavenia stránky".

Zhrnutie

• Titulok je klikateľný riadok vo výsledkoch vyhľadávania; meta popis zhŕňa stránku a niekedy sa zobrazí ako úryvok.
• Google môže váš titulok nahradiť, ak je poloprázdny, zastaraný, nesprávny alebo všade rovnaký, alebo ak chýba jasný hlavný nadpis.
• Google nepozná maximálnu dĺžku, ale skracuje podľa šírky obrazovky. Orientačné pravidlá v tomto kurze: titulok 15 až 65 znakov, popis 70 až 160 znakov.
• Každá stránka vlastný, výstižný titulok a popis; žiadne hromadenie kľúčových slov; názov značky krátko na konci.
• Meta popis pomáha ľuďom vybrať si, nie vašej pozícii v rebríčku.

Kvíz

Úloha

Úloha A3.1: Titulok a meta popis vašej stránky. Zadajte adresu stránky z vášho vlastného webu (domovskú stránku alebo dôležitú stránku). Program stránku načíta tak, ako to robí vyhľadávač, prečíta <title> a meta popis a spočíta znaky. Uvidíte, či existujú, či spĺňajú orientačné pravidlá a či titulok hovorí viac než len názov vašej firmy. Nemáte vlastný web? Použite www.rijksoverheid.nl.

Čítajte ďalej

Kroky v týchto článkoch platia pre panely WebOké; u iných poskytovateľov to funguje podobne.

• Prihlásenie vašej webovej stránky do vyhľadávačov (Google a Bing)
• Sitebuilder a AI Builder: ktorý si vyberiete a ako ho otvoríte?
• Google Search Central, Správa odkazov s titulkom vo výsledkoch vyhľadávania: https://developers.google.com/search/docs/appearance/title-link
• Google Search Central, Úryvky a meta popis: https://developers.google.com/search/docs/appearance/snippet