Kontynuujemy serię tekstów poświęconych optymalizacji pod kątem wyszukiwarek internetowych - SEO. We wcześniejszych częściach cyklu wytłumaczyliśmy, na czym polega specyfika marketingu w wyszukiwarkach internetowych, w jaki sposób działają algorytmy odpowiedzialne za tworzenie porządku w wynikach wyszukiwania oraz jakie są fazy działań optymalizacyjnych SEO.

W3C, CSS - standardy tworzenia kodu, strony przyjazne dla urządzeń mobilnych

W tworzeniu stron internetowych, jak niemal w każdej dziedzinie, istnieją pewne określone zasady. Warto je znać, jeśli chcesz, aby twoja praca była w pełni efektywna i przynosiła wymierne korzyści. W przypadku tworzenia witryn internetowych standardy ustala W3C, czyli World Wide Web Consortium. Jest to konsorcjum, które założył w 1994 r. Tim Berners Lee, twórca przeglądarek WWW. W jego skład wchodzi obecnie ponad 400 organizacji działających w branży IT, w tym tacy potentaci jak Microsoft, Google, Adobe, Hewlett-Packard czy IBM. W3C opracowuje standardy dotyczące tworzenia stron, dbając tym samym o właściwy i prawidłowy rozwój sieci internetowej. Wciąż można jednak spotkać twórców stron, szczególnie tych działających z doskoku, którzy są na bakier ze znajomością standardów W3C.

Dlaczego warto je znać? Przede wszystkim dlatego, że strony tworzone zgodnie z wytycznymi przedstawionymi przez konsorcjum bez problemu otwierać będą się we wszystkich dostępnych przeglądarkach, a także na różnych rodzajach mediów - m.in. urządzeniach mobilnych. Poza tworzeniem standardów pisania stron W3C opracowało także standardy dotyczące m.in. grafik zamieszczanych w sieci, materiałów wideo oraz audio czy dostosowywania stron internetowych do innych niż komputery urządzeń. Przyjrzyjmy się jednak w szczególności wytycznym odnoszącym się do budowania stron internetowych. Do tego celu W3C zaleca wykorzystywanie dwóch najważniejszych technologii - HTML oraz CSS.

HTML

HTML to język, który odpowiada za tworzenie struktury strony internetowej i on także musi być przyjazny pod kątem SEO. Jest on oparty na znacznikach i pozwala na publikowanie w sieci dokumentów z nagłówkami, tekstem, tabelami, listami, zdjęciami, dodawanie do nich hiperłączy, arkuszy kalkulacyjnych, plików audio oraz wideo, tworzenie form pozwalających na wykonanie akcji, np. wyszukiwania informacji, zamawiania produktów itp. Istnieje również język XHTML, który wykorzystuje składnię XML. Jest to coraz częściej polecany wariant, z uwagi na większą funkcjonalność w porównaniu z tradycyjnym HTML.

CSS

CSS jest językiem, który odpowiada za prezentację strony internetowej w przeglądarce - czyli jej layout, użyte fonty, kolory itp. Dzięki CSS konkretna strona może adaptować się do różnych urządzeń, na których będzie przeglądana - niezależnie, czy będą to komputery, tablety czy smartfony. CSS jest niezależny od HTML i może współdziałać z innymi językami wykorzystującymi składnię XML. CSS dzięki arkuszom stylów pozwala w łatwiejszy sposób ustalać wygląd strony i rozmieszczenia na niej konkretnych elementów. Wykorzystując CSS, możesz zmienić wygląd stron, nie ingerując w ich strukturę wyrażoną przez HTML.

Strony przyjazne dla urządzeń mobilnych mają wpływ na SEO

W 2015 r. Google potwierdziło, że dostosowanie strony internetowej do urządzeń mobilnych będzie miało wpływ na SEO, a co za tym idzie pozycjonowanie w wyszukiwaniach mobilnych. Dlatego warto, aby twoja strona była responsywna. Co to oznacza? To, żeby dostosowywała się do różnego rodzaju urządzeń, na których będzie wyświetlana. Jest to rozwiązanie lepsze od dedykowanej witryny mobilnej, posiadającej osobny adres URL dla urządzeń mobilnych i osobny dla komputerów. W przypadku strony repsonsywnej adres jest jeden. Fakt, że twoja witryna dostosowana jest do przeglądania na urządzeniach mobilnych, należy oznaczyć w meta tagu viewport. W kodzie swojej strony trzeba wówczas umieścić następujący wiersz:

Tag “width=device-width, initial-scale=1” wskazuje, że strona dopasuje się do szerokości urządzenia. Taki efekt możesz osiągnąć dzięki Media Queries działającemu w CSS. Ustalasz typy urządzeń, a także minimalne lub maksymalne rozmiary ekranów, przy których będzie można oglądać twoją stronę (przy których wczyta się określony kod CSS).

Dostosowanie strony do standardów W3C można sprawdzić dzięki walidatorowi. Pozwoli to wychwycić ewentualne błędy w strukturze portalu. Przyjazność strony dla urządzeń mobilnych można zweryfikować przede wszystkim za pomocą narzędzia Google dla webmasterów. Wystarczy jedynie umieścić tam adres swojej strony i nacisnąć przycisk Analizuj.

Marketing treści a SEO

Marketing treści to wszystkie działania marketingowe, które opierają się na dostarczeniu określonej grupie docelowej interesujących treści i nawiązaniu długotrwałej relacji z nim. W przeciwieństwie do klasycznych działań marketingowych marketing treści nie szuka klientów, ale pozwala im się znaleźć. W jaki sposób? Mówiąc najogólniej - dostarczając odpowiedzi na nurtujące ich kwestie. W wyszukiwarkę użytkownicy sieci często wpisują pytania, zaś twoim zadaniem jest stworzyć najlepszą, najpełniejszą odpowiedź - oczywiście, pod warunkiem, że pytanie dotyczy twojej branży.

Content marketing to przede wszystkim dystrybuowanie wartościowych treści. Co należy rozumieć przez wartościowe treści? Wszelkiego rodzaju eksperckie wpisy, porady, recenzje - forma może być dowolna - wartościowy będzie nie tylko tekst, ale również infografiki, materiały wideo itp. Wiele firm, mając w założeniach intensyfikację działań content marketingowych, zakłada tematyczne blogi eksperckie, wortale, organizuje webinaria, udostępnia interesujące i wspomniane już infografiki, e-booki czy nagrania wideo na swoich stronach w mediach społecznościowych.

Marketing treści stawia przede wszystkim na zdobycie zainteresowania internauty i nawiązanie z nim dialogu. Wysoka jakość treści i jej użyteczność pozwala na budowanie zaufania do twojej firmy i pozytywnie wpływa na jej odbiór jako eksperta w swojej branży. Sprawny content marketing pozwoli na kojarzenie twojej firmy z wysoką jakością. Od tego już prosta droga do sprzedaży - skojarzenia z wiedzą ekspercką pozytywnie wpłyną na decyzje zakupowe użytkowników sieci.

Celem content marketingu jest również wywołanie zaangażowania - niech internauci udostępniają twoje artykuły. Ty zyskasz rozgłos, a użytkownicy - potrzebną wiedzę. Dlatego tak ważne jest, abyś na swoich stronach umieszczał wartościowe treści, zgodne z ustaloną przez ciebie tematyką. Dla content marketingu lepsza jest dogłębna wiedza na jeden temat niż pobieżna w wielu dziedzinach. Twoja strona nie powinna być kopią istniejących w sieci tekstów czy infografik. Twórz je sam lub zlecaj ich tworzenie copywriterom i content designerom.

Meta znaczniki i atrybuty w języku HTML a SEO

Teraz przyjrzymy się niektórym elementom kodu źródłowego strony. Niektóre znaczniki i atrybuty związane ściśle z językiem HTML mają bowiem znaczenie przy indeksowaniu stron przez roboty wyszukiwarek. Czym jest indeksowanie? To rejestrowanie nowych stron pojawiających się w sieci i ich tematyczne katalogowanie. Dzięki takim działaniom tworzone są rejestry (indeksy), stanowiące zbiór informacji o dostępnych w sieci treściach. W momencie wyszukiwania robot zwany searcherem przeszukuje indeks i “wyrzuca” wyniki najbardziej dopasowane do szukanej frazy.

Niebagatelne znaczenie dla indeksowania stron mają meta znaczniki, nazywane również meta tagami. Znajdują się one w sekcji nagłówkowej strony - w kodzie źródłowym należy ich zatem szukać pod znacznikiem . Zadaniem meta tagów jest opisanie strony, wskazanie jej tytułu, słów kluczowych itp. Które z nich są szczególnie istotne dla robotów indeksujących.

Meta tag title

Meta znacznik title to bodaj najważniejszy z meta tagów. Określa on bowiem tytuł strony i ważny jest zarówno dla robotów wyszukiwarek, jak i dla użytkowników sieci. Zawartość tagu title wyświetlana jest bowiem bardzo często jako tytuł strony w wynikach wyszukiwania oraz na tzw. belce tytułowej. Ważne jest, aby był on niepowtarzalny, oryginalny, ale odnoszący się do tematyki strony. Warto zawrzeć w nim słowa kluczowe opisujące twoją witrynę, jednak w 50-60 znakach, gdyż w przeciwnym razie może on zostać częściowo wykropkowany w wynikach wyszukiwania. Pamiętaj, aby każdej ze stron w swoim serwisie nadać odrębny tytuł.

Meta tag description

Podobnie jak meta tag title, description widziany jest zarówno przez roboty wyszukiwarek, jak i użytkowników. Zawartość tego znacznika to opis strony w wynikach wyszukiwania. Dlatego warto postarać się, aby stworzyć ciekawy i przyciągający uwagę opis - na pewno lepiej będzie on oddziaływał na internautę niż kilka suchych słów umieszczonych pod tytułem. Tworząc opis, warto zastanowić się, kto będzie szukał strony takiej jak twoja - w meta tagu description musisz umieścić tekst, który przekona użytkownika, że to właśnie tutaj znajdzie odpowiedź na interesujące go zagadnienie.

Co zatem powinno znaleźć się w tagu description? Przede wszystkim opis zawartości strony i jej tematyki. Jak już wspomnieliśmy, powinien mieć on charakter perswazyjny - ma za zadanie nakłonić użytkownika do wejścia na twój portal. Powinien także zaciekawić czytelnika i obudzić w nim chęć uzyskania większej ilości informacji. Użyj słów kluczowych - zostaną one wyróżnione graficznie w wynikach wyszukiwania. Pamiętaj jednak, aby nie wpłynęło to negatywnie na czytelność opisu. Deskrypcja ma ograniczoną długość - preferowane są opisy nie dłuższe niż 155 znaków.

Meta tag keywords

Jeszcze kilka lat temu znacznik ten miał spore znaczenie w ustalaniu pozycji strony w wynikach wyszukiwania. Niestety, poprzez złe praktyki umieszczania słów kluczowych nieadekwatnych do tematyki strony, a jedynie popularnych w danym czasie, znaczenie tagu keywords znacznie zmalało. Znacznik ten widoczny jest tylko dla robotów wyszukiwarek i za jego pomocą określają one tematykę danej strony. Nie warto go więc pomijać - opisanie strony właściwymi związanymi z jej tematyką i zawartością słowami kluczowymi pozwala na jej dokładniejsze skategoryzowanie. Jeśli słowa kluczowe nie będą zgodne z tematyką strony, może ona zostać potraktowana jako spam.

Pozostałe elementy strony ważne pod kątem SEO

Roboty indeksujące zwracają również uwagę na inne elementy kodu strony. Przede wszystkim biorą pod uwagę treści wyróżnione znacznikiem oraz - ważne jest, aby w ten sposób wyróżnione zostały słowa lub frazy związane silnie z tematyką strony. Podobnie powinno być z nagłówkami

-

. Powinny one opisywać, co znajduje się w określonej sekcji strony, mają ważne zadanie porządkujące treść. Uwadze robotów nie umykają również anchory - anchor texts - czyli widziane przez użytkowników części linków wychodzących na stronach. Robot sprawdza, czy anchor określa, co znajduje się na linkowanej stronie.

Dane strukturalne

Dane strukturalne to elementy, które mają coraz większe znaczenie w pracy robotów wyszukiwarek. Są to informacje dodatkowe, które pozwalają na dookreślenie zawartości strony. W wynikach wyszukiwania można je zobaczyć jako tzw. fragmenty poszerzone. W zależności od strony mogą to być np. opisy produktu, opinie o produktach, informacje o cenie, średnie oceny, Mogą to być także tzw. breadcrumbs, czyli oznaczenie lokalizacji danej strony w serwisie, lub search box - czyli dodatkowe pole wyszukiwania, które pozwala na dotarcie do różnych stron/kategorii w serwisie wprost z SERP-a. Dane strukturalne można skutecznie zaimplementować za pomocą Asystenta do oznaczania danych Google.

Elementy graficzne ważne dla SEO

Elementy graficzne na stronie internetowej mają dla pozycjonowania znaczenie dwojakie. Pierwsze to wpływ zamieszczonej grafiki na szybkość ładowania strony, drugie - odpowiedni opis grafiki w kodzie źródłowym strony. Przyjrzyjmy się pierwszej kwestii. Zbyt długie ładowanie się strony nie wpływa korzystnie na jej pozycję w wynikach wyszukiwania, lecz także bywa zniechęcające dla samych użytkowników, którzy zdecydują się ją odwiedzić. Powodem zbyt długiego ładowania może być zbyt duża ilość nieskompresowanych obrazów i grafik. To, czy na tempo ładowania się twojej strony ma wpływ umieszczona tam grafika, sprawdzisz za pośrednictwem PageSpeed Insights.

Jeśli okaże się, że tak, należy ją skompresować. Pamiętaj, żeby starać się używać formatów .jpg, .png lub .gif. Najprościej skompresować plik graficzny za pomocą Photoshopa - wówczas wystarczy w opcjach zapisywania zapisać go “dla internetu i urządzeń”. Na pewno straci on wówczas na wadze. Do dostępnych online narzędzi, dzięki którym w łatwy sposób można dokonać kompresji grafik, należy zaliczyć Kraken, Optimizilla czy Compressnow. Jeśli już zmniejszyłeś wagę grafik umieszczonych na stronie, jeszcze raz sprawdź prędkość jej ładowania.

Co powinieneś wiedzieć o znacznikach oraz