CSS SEO Search Engine Optimization (optimalizace pro vyhledávače)

Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Mgr. Marek Čechák. Financováno z ESF a státního rozpočtu ČR.

Název školy

Střední škola hotelová Zlín, s.r.o.

Číslo projektu

CZ.1.07/1.5.00/34.0833

Autor

Mgr. Marek Čechák

Název šablony

III/2 – Inovace a zkvalitnění výuky prostřednictvím ICT

Název DUMu

VY_32_INOVACE_19 – SEO

Stupeň a typ vzdělávání

Střední odborná škola

Vzdělávací oblast

Informační a komunikační technologie

Vzdělávací obor

Práce s počítačem

Tematický okruh

Tvorba www

Druh učebního materiálu

Prezentace

Cílová skupina

Žák SŠ

Anotace

Výukový materiál je obsahově zaměřený na vysvětlení principu optimalizace webových stránek pro internetové vyhledávače.

Vybavení, pomůcky

PC

Klíčová slova

Informatika, SEO, optimalizace, vyhledávače

Datum ověření

Základní otázky 1. Co je to SEO? • Optimalizace kódu webových stránek pro internetové vyhledávače. 2. Co je to vyhledávač? • Vyhledávač má za úkol najít, na základě zadaných klíčových slov, co nejrelevantnější odkazy na internetu. • Nejoblíbenější vyhledávače v česku jsou Seznam a Google. 3. Proč optimalizovat? • Cílem optimalizace je posunout webové stránky ve výsledcích vyhledávání co nejvýše, a tím dosáhnout vyšší návštěvnosti.

Jak fungují vyhledávače? • Katalogy: • O zařazení do katalogu je potřeba se většinou postarat. • Základní zápis do katalogu je většinou zdarma. • První se nabízejí placené odkazy. • Bývají rozděleny dle oblastí. • Fulltextové vyhledávání: • Prohledávání celého obsahu webových stránek. • Vyhledávač si vyhledává sám. • Výsledky zobrazuje dle svého hodnocení kvality.

Hodnocení stránek • Se systémem hodnocení stránek pomocí nějakého

algoritmu přišel první Google. • Výsledkem hodnocení je číslo, které určuje, jak dobře si stránka na dané škále stojí. http://pagerank.jklir.net/ranky/

• Google – PageRank

• Seznam – S-rank

Jak vytvářet nový web? 1. Provést analýzu úspěšných stránek s podobným 2. 3. 4. 5.

6. 7.

obsahem. Pronajmout vhodnou doménu. Navrhovat strukturu s ohledem na SEO. Dbát na validitu kódu. Zajistit registraci do katalogů. Vybudovat zpětné odkazy. Monitoring webu, aktualizace a případné úpravy.

Na co si dát pozor? • Nepřirozené získávání zpětných odkazů • Nakupování velkého množství zpětných odkazů najednou. • Duplikovaný obsah • Obsah vytvořený automatickými systémy. • Tapetování stránky klíčovými slovy • Lépe hodnocený je přirozený obsah. • Maskování obsahu • Jiný obsah pro návštěvníky a pro vyhledávače, například pomocí skriptu. • Skrytý text • Skrytí textu pomocí CSS. Tlačítka ano, ale větší množství textu ne. • Duplicitní stránky (stejný obsah na více adresách)

Ověření validity kódu • K ověření validity kódu, tedy jeho správnosti vzhledem k

uvedené verzi DTD, slouží validátor. 2 1

3

Oddělení obsahu od formy 1

Oddělené CSS a HTML v jednom souboru. Vhodné pro cvičení a ladění.

CSS 2 (X)HTML

CSS v externím souboru. Profi varianta.

(X)HTML

CSS

Sémantická správnost • Obsah uzavírat do správných značek • Nadpis • Odstavec • Seznam apod. • Špatně: • Správně:

Nadpis stránky

Titulek stránky • Titulek stránky je zobrazován ve vyhledávačích jako

hlavní část výsledků vyhledávání. • Pravidla: • Musí korespondovat s obsahem stránky. • Mělo by se v něm vyskytnout nějaké klíčové slovo. • Měl by obsahovat název firmy a předmět podnikání. • Na každé stránce jiný titulek, pokud to konstrukce stránek umožňuje. • Optimální délka 50 – 70 znaků.

Meta informace • Pomocí značky <meta> je možné do stránky vložit

popisné informace: 1. Klíčová slova <meta name="keywords" content="slovo1, slovo2, slovní spojení ..." />

2. Stručný popis obsahu stránky <meta name="description" content="Zde je potřeba vložit stručný popis ..." /> Obsah uvedený v atributu content bude uveden ve výsledcích vyhledávání pod titulkem stránky. Text by měl být stručný a měl by obsahovat klíčová slova.

Nadpisy • Základná stavební kameny webové stránky. • Říkají nám, kde se nacházíme a jaký je obsah stránky. • Vyhledávače jim přisuzují větší váhu. • Na stránce by měl být pouze jeden nadpis H1.

Odkazy • V navigaci: • Navigace kopíruje strukturu webu. • Uvádějí se jako seznamy a poté se upravují pomocí css do výsledné podoby. • V názvech odkazů je dobré uvádět klíčová slova. • V textu: • Text odkazu slouží k informaci, kam se návštěvník dostane. • Špatně: Pro více informací klikněte zde. • Špatně: Pod tímto odkazem Vám poskytneme více informací o … • Dobře: Výsledky soutěže Entrův pohár.

Obrázky • Velmi důležité je uvádět alternativní text.

• Proč: • Roboti prohledávají pouze textové informace. • Alternativní text se zobrazuje tam, kde máme v prohlížeči potlačené zobrazování obrázků. • Volíme správné názvy obrázků: • Špatně: img000456.jpg • Správně: chorvatsko-01.jpg

Zpětné odkazy • Jsou to odkazy na jiných stránkách, které odkazují na náš

web. • PageRank se potom počítá podle toho, kolik a jak důležitých stránek na nás odkazuje. • Část své hodnoty stránka odkazem propůjčuje další stránce, na kterou odkazuje. Čím více odkazů na stránce, tím méně každé další stránce předá. • TÍM, ŽE STRÁNKA OBSAHUJE ODKAZY, O SVŮJ

PAGERANK NEPŘICHÁZÍ.

Použité zdroje • DOMES, Martin. SEO: jednoduše. Vyd. 1. Brno:

Computer Press, 2011, 141 s. Naučte se za víkend (Computer Press). ISBN 978-80-251-3456-6. • Kliparty Microsoft Office