Google musi zrozumieć stronę
Google musi zrozumieć co znajduje się na twojej stronie! – o czym piszesz!
Każda książka ma
- tytuł,
- nagłówki
- tekst.
Słowo w nagłówku jest ważniejsze niż słowo w tekście (sugeruje nam czego możemy się spodziewać).
Każda książka zachowuje pewną strukturę.
Na okładce zawsze znajduje się tytuł książki i autor.
Na początku znajduje się spis treści.
Książka jest podzielona na rozdziały, można wyróżnić nagłówki i paragrafy.
Zdjęcia często są podpisane.
Struktura strony WWW
Dla lepszego zrozumienia pozycjonowania warto zrozumieć czym jest HTML.
Strony internetowe również powinny zawierać pewną strukturę.
Dlatego zadbaj o odpowiednia strukturę
Tytuł strony
W HTML, wpisz tag ’title’.
Słowa kluczowe
W HTML, wpisz tag 'keywoards’.
Nagłówki
Używaj nagłówków H1, H2, H3,..
H1 – najważniejszy nagłówek
H2 – podnagłówek H1
H3 – podnagłówek H2
itd
Jeśli nie podoba ci się wielość np. H1, zamiast używać, H2, H3 – zmień styl!
To znaczy zmieniając styl możesz zmienić wielkość wszystkich elementów oznaczonych jako H1.
W praktyce nie edytujesz HTML ręcznie.
Ważne jest by w edytorze wybierać odpowiednie nagłówki.
Opcja wyboru nagłówka H1, H2, H3,.. w edytorze popularnym CKeditor (używanym w wielu platformach).
Podpisuj obrazki (nie obowiązkowe, ale ..)
W jezyku html użyj atrybutu ’alt’ pozwala określić alternatywną wartość tekstową, gdy obrazek nie zostanie wczytany.
Jest to również wskazówka dla google – co znajduje się na zdjęciu.
<img src=”…”, alt=”opis zdjęcia” />
Możliwość wpisania atrybuty ALT – tekstu w edytorze CKEditor.
Dodatkowa zaleta, większe prawdopodobieństwo, że zdjęcie znajdzie się w Google images (dodatkowe źródło ruchu).
Na marginesie dodam, że w świecie IT, coraz lepiej sprawdza się automatyczne wykrywanie obiektów na zdjęciach 🙂
Metadane
Dodaj metadane opisujące twoją stronę
Różne serwisy mogą wymagać różnych danych.
W sekcji head można dodać np.
<!– dla Facebook’a –>
<meta property=”og:title” content=”[ TITLE ]” />
<meta property=”og:type” content=”article” />
<meta property=”og:description” content=”[ ARTICLE DESCRIPTION ]” />
<meta property=”og:image” content=”[ LISTING IMAGE ]” />
<meta property=”og:url” content=”[ CANONICAL URL OF ITEM ]” />
<meta property=”og:site_name” content=”[ WEBSITE NAME ]” />
<!– dla Google’a –>
<meta itemprop=”name” content=”[ TITLE ]” />
<meta itemprop=”image” content=”[ LISTING IMAGE ]” />
<meta itemprop=”description” content=”[ ARTICLE DESCRIPTION ]” />
<meta name=”description” content=”[ ARTICLE DESCRIPTION ]” />
<meta name=”author” content=”[ AUTHOR FULL NAME ]” />
<meta property=”article:author” content=”[ GOOGLE+ AUTHOR URL ]” />
<meta property=”article:published_time” content=”[ PUBLISHED TIMESTAMP ]” />
<meta property=”article:section” content=”[ CATEGORY ]” />
<!– dla Twitter’a –>
<meta name=”twitter:card” content=”summary”>
<meta name=”twitter:title” content=”[ TITLE ]”>
<meta name=”twitter:description” content=”[ ARTICLE DESCRIPTION ]”>
<meta name=”twitter:image” content=”[ LISTING IMAGE ]”>
<meta name=”twitter:url” content=”[ CANONICAL URL OF ITEM ]”>
Dla przykładu gdy dodasz tag:
<meta property=”og:image” content=”[ LISTING IMAGE ]” />
To gdy artykuł z twojej strony zostanie udostępniony na FB.
To facebook pokaż przy nim obrazek podany w tym tagu.
Przy umieszczaniu linków na FB, pojawia się obrazek/tekst/.. – możesz zdecydować jaki.
Tagów Facebooka szukaj pod terminen: Open Graph.
Przydatna może być strona facebooka umożliwiająca diagnozę (np. czy tagi zostały prawidłowo dodane).
Przetestuj: https://developers.facebook.com/tools/debug/og/object/