Web Design i SEO – co je łączy?

Web Design i SEO – co je łączy?

Tworząc witrynę internetową, musisz dostosować ją nie tylko pod klienta, ale również pod wyszukiwarkę. Te dwa aspekty są niesamowicie ważne w kontekście widoczności serwisu w Internecie. Dawniej, w prehistorii budowania stron internetowych, tworzenie strony pod klienta oznaczało przede wszystkim wizualne dostosowanie serwisu do wymagań odbiorcy. Ewentualnie, co rozsądniejsi, zwracali uwagę na funkcjonalności dostępne na stronie oraz ułatwianie możliwości znalezienia informacji, czy dokonania zakupu (czyli optymalizacja ścieżki zakupowej).

Dostosowanie witryny do wyszukiwarki opierało się z grubsza na sztucznym umieszczeniu fraz kluczowych. Często w dowolnych miejscach na witrynie, dodawano je do kodu strony (np. do znacznika meta keywords) oraz nierzadko na stosowaniu praktyk Black Hat SEO. I to wystarczyło, aby pozyskiwać użytkowników, którzy ostatecznie stawali się klientami.

Konkurencja niezbyt nachalnie próbowała podcinać skrzydła, a kwestie web designu (czyli projektowania strony internetowej) i SEO były zupełnie osobno funkcjonującymi bytami. W skrócie: cóż za złote czasy dla marketingu internetowego! Nie trzeba było się zbytnio wysilać, aby znaleźć się na wysokich wynikach np. w Google.

Współpraca programistów i web designerów z pozycjonerami

Jesteśmy już jednak daleko w przyszłości, kiedy potrzebujesz witryny zoptymalizowanej pod kątem wyszukiwarek i dostosowanej do aktualnych wymogów. Do tego dochodzi kreatywna, użyteczna i przyjazna użytkownikom strona internetowa. Wszystko po to, aby mogli oni w szybki i łatwy sposób znaleźć produkt bądź informację. W nowoczesnym tworzeniu stron internetowych, chodzi o to, aby znaleźć równowagę pomiędzy byciem przyjaznym dla użytkownika i wyszukiwarki. Tym samym stare pojęcia opisujące SEO oraz Web Design, odeszły do lamusa.

Zarówno programista, grafik, jak i pozycjoner, muszą walczyć o to, aby uzyskać możliwie najlepszą użyteczność serwisu, który uzupełnia się wizualnie. Problem powstaje, gdy firmy mają dwa oddzielne zespoły do spraw SEO i Web Designu. Nawet jeśli obie załogi działają sprawnie, ale nie komunikują się wzajemnie, współpraca nad stworzeniem odnoszącej sukcesy w Internecie witryny staje się prawdziwym wyzwaniem. Często pojawia się konflikt, szczególnie, kiedy pracę nad stroną podejmują różne zespoły. Jak więc znaleźć równowagę w tworzeniu strony internetowej? Jak wiele różni, a ile łączy Web Design i SEO? W jakim stopniu specjaliści w tych dziedzinach, powinni ze sobą współpracować?

W jakich aspektach Web Design powinien współpracować z SEO?

Tworząc nową stronę internetową lub tylko zmieniając np. szablon lub CMSa, już na etapie projektowania, powinniśmy skonsultować się z agencją SEO . Jest to ważne, jeśli zamierzamy uzyskać w przyszłości dobrą widoczność serwisu oraz pozyskiwać potencjalnych klientów. Niestety, prawdopodobnie najlepszy programista nie stworzy od razu zoptymalizowanej i przygotowanej do pozycjonowania witryny internetowej. Tak samo jak pozycjoner nie uzyska najlepszego efektu widoczności bez współpracy z web developerem.

Cykliczne i coraz częstsze update’y algorytmu wyszukiwarki, zmuszają twórców do współpracy w niemalże każdej dziedzinie powiązanej z marketingiem internetowym. Im bardziej holistycznie podchodzi się do tematu, tym większa szansa na lepszą widoczność domeny w Google. Jednym słowem, aktualizacje prowadzące do lepszej oceny witryny przez wyszukiwarkę, wymusiły współpracę pozycjonerów z projektantami stron WWW i na odwrót.

Przykładowo, w kwietniu 2015 roku, Google zaktualizował algorytm wyszukiwania, a cały proceder zostało nazwany „Mobilegeddonem”. Aktualizacja ta wymusiła na twórcach stron internetowych, aby były one dostosowane do urządzeń mobilnych, a tym samym responsywne. Im lepiej (według podanych parametrów – czynników rankingowych) prezentowały się domeny i im bardziej były przydatne użytkownikom urządzeń mobilnych, tym lepsze osiągały wyniki wyszukiwań. Aby w ogóle do twórców witryn (i projektantów szablonów), doszła informacja o tych zmianach, musieli uaktywnić się pozycjonerzy. Przepływ informacji był tutaj kluczowy. Pozwolił na wytyczenie nowych standardów w projektowaniu witryn, na czym zyskały obie zainteresowane strony, a w ostateczności i zleceniodawca (klient).

Jak web design wpływ na SEO i na odwrót?

Na jakie ogólne aspekty projektowania witryn powinni zwrócić uwagę web developerzy? Jakie są kwestie, o których powinni pamiętać pozycjonerzy podczas optymalizacji nowej domeny i co przekazać twórcom witryn? Im wcześniej przygotujemy grunt pod optymalizację i UX (User Experience), tym mniej środków będziemy musieli przeznaczyć na późniejsze poprawki. Dlatego wiedza w kontekście współpracy SEO z Web Design, jest tak kluczowa podczas tworzenia nowego szablonu.

Poniżej przedstawiam parę punktów z ogólnymi uwagami dotyczącymi współpracy tych dwóch dziedzin, na które powinieneś zwrócić uwagę.

  1. Dobry wskaźnik User Experience jest tym, na czym powinno zależeć zarówno specjalistom SEO, jak i twórcom witryn internetowych. Roboty wyszukiwarek zachowują się, a przynajmniej starają się zachowywać tak, jak robi to użytkownik w poruszaniu się po stronie. User Experience jest wskaźnikiem, który „ocenia” użyteczność domeny względem jej użytkowników. Czyli to, jak np. łatwo dokonać im zakupu, jak sprawnie poruszać się stronie, jak szybko i trafnie wyszukać produkt i wiele innych. Takie działania wpływają na reakcje użytkowników, które przekładają się nie tylko na konwersję, ale również na wyniki SEO. Chodzi o wyniki ukazywane np. w Google Analytics.

    Jeśli masz źle zaprojektowaną witrynę, na której łatwo się… zdenerwować i z której trudno jest korzystać, Twoi klienci odejdą. Wyszukiwarki natomiast łatwo odczytuje fakt, że strona jest trwale nieużyteczna, co jak wspomniałam, może odciskać piętno na wynikach wyszukiwalności lub klikalności, a tym bardziej może powodować zwiększenie procentu współczynnika odrzuceń. Definicję współczynnika odrzuceń zamieszczam poniżej, ponieważ jest ona kluczowa w procesie pozycjonowania, więc wymaga jak najbardziej zrozumienia.

Współczynnik odrzuceń to liczba sesji ograniczonych do jednej strony podzielona przez liczbę wszystkich sesji, czyli odsetek wszystkich sesji w witrynie, podczas których użytkownicy wyświetlali tylko jedną stronę, uruchamiając zaledwie pojedyncze żądanie do serwera Analytics.

Źródło: support.google.com/analytics/answer/1009409?hl=pl

Przed twórcami witryn, stoi zatem zadanie, aby budować strony funkcjonalne, szybko ładujące się, z czytelną treścią i nowoczesnym, świeżym i lekkim designem, bez barier dla użytkowników. Stosowanie dobrych praktyk w projektowaniu witryn pozwoli zatrzymać na nich nie tylko użytkowników, ale i roboty wyszukiwarek.

2. Nowoczesny design strony internetowej, tak samo jak jej forma użyteczności, może zatrzymać użytkownika dłużej na domenie. Bardzo dużo osób może opuścić stronę w pierwszych sekundach tylko dlatego, że nie jest ona estetyczna i modna. W wizycie na domenie, zwłaszcza nowej dla użytkownika, liczy się przede wszystkim pierwsze wrażenie. Ważna jest zarówno wspomniana funkcjonalność (User Experience), ale i doświadczenie wizualne.

Czy domena wygląda wiarygodnie? Posiada nowoczesny design? Na pierwszy rzut oka znajdziesz na niej wszystko to, czego potrzebujesz? Na te i wiele innych pytań, klient potrafi odpowiedzieć sobie w zaledwie pierwszej chwili, po odwiedzeniu strony internetowej. Doświadczenie to, wpływa znacząco na późniejszą konwersję oraz czy użytkownik w ogóle pozostanie na domenie, zmniejszając tym samym procent współczynnika odrzuceń. Dłuższa interakcja może oznaczać również zwiększoną liczbę sesji, a także korzystanie z linków wewnętrznych (w tym np. z linków w menu), co wspiera pozycjonowanie fraz kluczowych.

Dobry projekt witryny, pomaga również ludziom nawiązać więź z marką i wzbudzić zaufanie od pierwszej sekundy (a pamiętaj, że na wywarcie pierwszego wrażenia, mamy ich mało!). Łącząc wysokiej jakości treści (które powinny być tworzone przy użyciu fraz kluczowych) z nowoczesnym designem, otwierasz furtkę użytkownikom zaangażowanym. Tym samym pokazujesz wyszukiwarce, że Twoja witryna jest godna zaufania.

3. Podczas projektowania witryny, powinno się zwrócić uwagę na kwestię indeksacji. Zaindeksowanie podstrony w Google oznacza, że staje się ona widoczna w indeksie (czyli w wynikach wyszukiwania) z uwzględnieniem wszelakiej treści na niej się znajdującej. W praktyce, każda podstrona, z poszczególnymi wyjątkami, powinna być dostępna dla robotów Google, czyli posiadać status „index, follow”. Nierzadko zdarzają się sytuacje, w których projektanci stron internetowych, zapominają odblokować wszystkie linki dla robotów. Nadają im wtedy błędny status „noindex, nofollow” (chociaż dla pojedynczych podstron, są to poprawne dyrektywy).

Co więcej, przy błędnej budowie szablonu i korzystaniu z dynamicznego ładowania się niektórych podstron, możemy pozbawić się możliwości zaindeksowania takich linków. Tutaj jednak każdy przypadek wymaga osobnej analizy. Poprzez błędne wybory, można utrudnić sobie osiąganie dobrych wyników w pozycjonowaniu.

4. Podczas budowy strony, kluczowe jest zwrócenie uwagi na strukturę linków kategorii, produktów, czy po prostu podstron informacyjnych. Jeśli witryna internetowa jest wyjątkowo duża i posiada ogromną ilość podstron, to zwrócenie uwagi na tę kwestię już na etapie wdrażania szablonu jest kluczowe. W ten sposób można uniknąć wielu zmian i przekierowań w obrębie URL-ów na etapie późniejszym, np. podczas tworzenia planu optymalizacji. Linki powinny być czytelne i zbudowany ze słów bądź fraz kluczowych nawiązujących do tematu podstrony. Ich gradacja powinna być czytelna i funkcjonalna, aby użytkownik nie miał wątpliwości, w jakim miejscu strony się znajduje.

Lepszym rozwiązaniem będzie zastosowanie URL-a w postaci takiej:
www.strona-przyklad.pl/kategoria/nazwa-podkategorii
zamiast takiej:
www.strona-przyklad.pl/search=?p=4/oferta

Pozycjoner jest w stanie już na roboczym etapie poradzić web developerowi, jak takie linki powinny wyglądać, analizując chociażby rozpisaną strukturę menu (w arkuszu kalkulacyjnym). Przy bardzo dużych stronach, czyli takich posiadających wiele podstron, zagadnienie to jest bardzo ważne i pozwala uniknąć późniejszych wielu przekierowań.

5. W przypadku posiadania na sklepie dużej liczby produktów (a tym samym wielu grafik do nich) albo obszernej galerii zdjęć, funkcjonalna może okazać się optymalizacja opisów – atrybutów ALT. Taką optymalizację można wykonać również później (po wdrożeniu strony), jednak nieocenione i pomocne jest wdrożenie ALT-ów na początkowym etapie jej budowy. 

Atrybuty ALT to tekst alternatywny dla obrazu, czyli fraza opisująca to, co na nim się znajduje. Każdy znacznik ALT powinien być unikalny. Dlatego na startowym etapie wdrażania szablonu, odgórnie możemy ustalić reguły pobierające opisy ALT np. z nazw produktów, co znacznie ułatwi późniejszą optymalizację. Tak samo, jak w przypadku ustalenia wyglądu linków, takie działanie znacznie wspomaga pozycjonowanie.

6. Istotną kwestią dotyczącą optymalizacji, która powinna zostać wdrożona na etapie budowania strony internetowej, jest odpowiednie oznaczenie nagłówków. Na każdej podstronie powinien znajdować się tylko jeden nagłówek H1. Najczęściej jest to nazwa podstrony, kategorii lub produktu – ponieważ te elementy zawierają naturalne frazy kluczowe.

Niemniej, najlepszą opcją byłaby możliwość ich późniejszej edycji. Kolejne formy nagłówków, to H2, H3, H4, itd. Tutaj możliwość występowania jest nieco bardziej dowolna, jednak powinna być zachowana gradacja. Po wykonaniu wstępnego audytu, pozycjoner jest w stanie ustalić, jak powinny wyglądać nagłówki H1, H2, H3… i gdzie być umiejscowione. Oczywiście, po wdrożeniu szablonu, nagłówki bardzo często wymagają dopracowania, ale określenie ich stylu i formatowania odgórnie, pomaga uporać się z wyglądem szablonu.

7. Web Developer oraz SEOwiec, muszą postarać się o przejrzystą i funkcjonalną nawigację. Użytkownicy nie powinni szukać zbyt długo tego, czego potrzebują. Tak samo robot Google – im więcej URLi musi przejść i pokonać barier, im bardziej struktura menu jest skomplikowana, tym zmniejsza się szansa na dobrą widoczność. Uporządkuj zatem swoją nawigację, uprość linki. Czasem im mniej kategorii, tym lepiej.

web developer i pozycjoner

8.  Stwórz hierarchię treści na domenie – powinny one być przede wszystkim czytelne. Nie używaj zbyt małych czcionek, bladych lub jaskrawych kolorów fontów. Dawniej, aby oszukać algorytmu wyszukiwarki, praktykowało się umieszczanie białej czcionki na białym tle w celu „upchania” jak największej ilości fraz kluczowych. W tych czasach, zdecydowanie nie zaleca się tej praktyki.

9. Przyspiesz ładowanie się strony! Wybranie odpowiedniego serwera, dopasowanego do możliwości Twojej domeny, to kluczowa kwestia, na którą zwróć uwagę na początku całej drogi z web designem. To, jak szybko otworzy się minimalistyczny, nowoczesny szablon, warunkuje późniejsze działania użytkowników. Każde milisekundowe opóźnienie ładowania się strony, może zmniejszyć konwersję. Projekt strony powinien ładować się szybko, co z kolei przełoży się na satysfakcję użytkowników oraz robota wyszukiwarki. Im dłużej pozwolisz im czekać na załadowanie się strony, tym gorsze wrażenie może ona uzyskać.

10.  Ostatni, ale bardzo ważny temat – responsywność. Każdy element szablonu powinien skalować się do wersji mobilnej, aby stronę móc wygodnie przeglądać na urządzeniach typu smartfony, tablety, itp. Oczywiście responsywność ma dużo wspólnego z kwestią User Experience, a właściwie się w niej zawiera. Użytkownicy otwierają strony na urządzeniach o różnych rozdzielczościach, dlatego tak ważne jest uelastycznienie designu witryny do tych możliwości. Zaletą projektowanie responsywnego jest fakt, że można stworzyć jeden szablon, który samoistnie skaluje się do odpowiedniej wielkości. Google oficjalnie przyznaje się, że nagradza witryny posiadającą przyjazne użytkownikom wersje mobilne, umieszczając responsywność jako jeden z czynników rankingowych.


Jeśli chcesz sprawdzić, czy Twoja witryna jest przyjazna mobilnie (mobile-friendly), możesz zweryfikować to pod linkiem: search.google.com/test/mobile-friendly

SEO kontra Web Design

Często cele, do jakich dążą projektanci witryn oraz SEOwcy są sprzeczne. Podczas gdy nowoczesny Web Design skupia się na zminimalizowaniu ilości treści na stronie i dąży do większego ascetyzmu, SEO upycha więcej i więcej fraz kluczowych, wrzuca nagłówki i zmniejsza zbyt duże grafiki.

Kiedy web designerzy chcą tworzyć projekty oparte na jednej stronie, tzw. one page layout, pozycjonerom jest to zdecydowanie nie na rękę. Więcej na ten temat przeczytasz tutaj: One page layout – za i przeciw w kontekście SEO. Nowoczesny projekt zakłada używanie jak największej ilości przekazu graficznego, najlepiej zaprojektowanego na użytek własny firmy.

Natomiast SEO preferuje treść w formie pisanej, a nie graficznej, która zawadza swoją wielkością i parametrami. Przysłaniając tym samym frazy kluczowe i spychając tekst na margines. Na czym więc powinniśmy się skupić? Jakie działania powinny być priorytetowe w budowie serwisu?

Odpowiedź: SEO i Web Design idą w parze

Jaki pożytek mielibyśmy z najnowocześniejszej i najbardziej funkcjonalnej strony, jeśli nikt nie odnalazłby jej w wyszukiwarce? Czy jakiekolwiek leady generowałaby domena z przestarzałym szablonem i brakiem klarownej nawigacji, pomimo dobrego wypozycjonowania jej? Po co wyrzucać pieniądze w błoto i pozycjonować witrynę, która nie jest nawet responsywna (a powinna być według najnowszych wytycznych Google)? W jaki sposób, potencjalny klient ma odnaleźć produkt, jeśli nie posiada on w ogóle swojego linku i/lub nie indeksuje się w Google?

Rozpocznij badania SEO już na początku projektu. Poproś doświadczoną firmę w branży o audyt, który wskaże najsłabsze punkty strony z naciskiem na kwestię User Experience. Przemyśl, w jaki sposób chcesz, aby Twoja witryna została znaleziona w Internecie, jaki jest Twój rynek docelowy oraz kim są odbiorcy oferty. Te informacje wykorzystaj do stworzenia strategii fraz kluczowych, które następnie zostaną wdrożone na stronę. Pamiętaj o tym, że domena musi jednocześnie angażować ludzi do działania (i kupowania), ale również nie irytować.

Być jak najbardziej przejrzysta wizualnie, ale też zawierać umiejscowione precyzyjnie frazy kluczowe. Projektowanie stron internetowych wpływa na User Experience w taki sam sposób, w jaki działa w tej dziedzinie SEO. Dlatego należy docenić tę współpracę i realizować projekty kompleksowe, których nie trzeba będzie po krótkim czasie łatać dodatkowo płatnymi kampaniami marketingowymi.

Zastanawiasz się, jak to wszystko ugryźć i w jaki sposób połączyć projektowanie witryn internetowych z SEO? Najlepszym rozwiązaniem jest zgłoszenie się do firmy, która holistycznie podejdzie do tematu i zajmie się Twoją domeną korzystając z wiedzy zarówno programistów, web designerów, ale i pozycjonerów. Przy odpowiedniej współpracy, nowa, przygotowana pod optymalizację witryna, jest w stanie osiągać dużą ilość wyświetleń i klikalności. Zapraszamy do kontaktu!

Specjalistka ds. SEO
Kasia Cieślik