UX i optymalizacja SEO w sklepie internetowym

Nawet najlepiej widoczne w wyszukiwarkach serwisy internetowe, jeśli będą trudne w odbiorze przez użytkowników, nie przyniosą zamierzonych efektów dotyczących konwersji. Jak tworzyć UX bez ignorowania SEO?

Ruch organiczny z wyszukiwarek internetowych jest jednym z istotniejszych źródeł odwiedzin potencjalnych klientów w sklepach internetowych. Przy dobrej optymalizacji SEO serwisu www i dużej sile brandu może być również jednym z tańszych sposobów generowania ruchu, a co najważniejsze - również i konwersji. Wyszukiwarki to podstawowe miejsce w sieci, w którym internauta rozpoczyna poszukiwanie informacji o usługach czy produktach.

Ze względu na to, że za kolejność wyników organicznych wyszukiwarki Google odpowiada skomplikowany algorytm, a dane o jego działaniu nie są publicznie ujawniane, ta część działań marketingowych często pozostaje w sferze domysłów lub testów. Z roku na rok algorytmy wyszukiwarek internetowych stają stają się coraz bardziej “inteligentne”. Mnogość czynników rankingowych spędza sen z powiek specjalistom SEO, trudno czasem nadążyć za informacjami na temat kolejnych dużych aktualizacji algorytmu. Optymalizacja treści na stronie, kodu źródłowego, meta tagów, profilu linków czy sygnały społecznościowe - to tylko niektóre czynniki wpływające na widoczność serwisu w SERP (Search Engine Results Page - strona wyświetlająca listę wyników wyszukiwania). Jeśli na powyższe nałożymy dodatkowo czynniki związane z User Experience i użytecznością serwisów, zrobi się naprawdę ciekawie.

UX (ang. User experience) - projektowanie serwisów www (aplikacji) w sposób funkcjonalny, skoncentrowany na wygodzie użytkownika, dzięki czemu realizowanie celów w obrębie serwisu jest intuicyjne, przewidywalne, sprawia przyjemność i satysfakcję z użytkowania.

SEO - (ang. Search Engine Optimization); Optymalizacja dla wyszukiwarek internetowych - proces dążący do poprawy pozycji witryny na liście wyników wyszukiwania polegający na dostosowaniu kodu strony pod względem zgodności z aktualnym algorytmem wyszukiwarek.

Jednak:

  • czy aby na pewno już teraz wygoda korzystania z serwisu jest ważnym i przede wszystkim mierzalnym czynnikiem rankingowym?

  • czy wykorzystanie efekciarskich trików za pomocą AJAX w prezentacji treści na stronie ma większą wartość niż ta sama treść prezentowana w sposób tradycyjny?

  • czy infinite scrolling ma większą siłę SEO niż tradycyjna paginacja?

Optymalizacja SEO ma na celu stworzenie serwisu jak najbardziej użytecznego, dostępnego i indeksowalnego dla botów wyszukiwarek, z kolei UX - użytecznego i wygodnego dla użytkownika. Oczywiście na wielu warstwach, jak w przypadku np. szybkości ładowania się strony czy wersji responsywnej layout’u pod urządzenia mobilne, te cele są spójne. Istnieje jednak też wiele obszarów, gdzie UX może pokrzyżować plany w SEO.

Algorytmy rankingowe wyszukiwarek dalej w dużej mierze opierają się o czynniki kontentowe, a nie UX’owe.

Ważniejsza w “oczach” Google będzie optymalizacja na poziomie słów kluczowych w meta tagach, nagłówkach Hx czy adresach URL, niż sam wygląd layoutu strony, miejsce umieszczenia buttona CTA czy wygoda użytkownika na ścieżce zakupowej w koszyku.

W jaki zatem sposób podejść do SEO z wykorzystaniem UX?

Po prostu nie rób UX tylko dlatego że SEO tego wymaga. Pamiętaj, aby robić serwisy www jak najbardziej użyteczne dla użytkowników, wykorzystując wszelkie możliwe udogodnienia, na które pozwala obecnie technologia webowa. Ale w tym procesie uwzględnij również optymalizację SEO, która umożliwi robotom wyszukiwarek:

  • Indeksację strony pod statycznym adresem URL

  • Prawidłowe odczytanie pełnej zawartości podstron (szczególnie treści)

  • Dostęp do poszczególnych podstron serwisu

Kiedy dobry UX może wpływać negatywnie na SEO i jak sobie z tym radzić

Wykorzystanie infinite scrolling* (nieskończone przewijanie) na stronach kategorii w sklepie online

Coraz częściej da się zauważyć, że tradycyjna paginacja produktów na stronach kategorii czy podkategorii odchodzi już do lamusa, a zastępuje ją “user friendly” nieskończone przewijanie w prezentacji listy produktów.

O ile rzeczywiście używanie mechanizmu doczytywania produktów na liście bez konieczności przeładowania strony jest wygodne z punktu widzenia użytkownika i skraca jego czas przeglądania dużej oferty, o tyle nie działa to w ten sam sposób na roboty wyszukiwarek internetowych. Treści, które są doczytywane “w locie”, nie są odczytywane przez roboty wyszukiwarek.

Konstruując w ten sposób mechanizm prezentacji treści, należy pamiętać o odpowiedniej optymalizacji kodu pod roboty wyszukiwarek aby umożliwić im dostęp do treści które są “doczytywane”

Dzięki odpowiedniej konstrukcji serwisu wszystkie treści na podstronie są widoczne i indeksowalne przez wyszukiwarki internetowe.

TREŚCI W TABACH, PO Kliknięciu, PO najechaniu myszką

“Content is a king” jak mówi jedno z przykazań osób zajmujących się SEO. Z jednej strony chcielibyśmy, aby wyszukiwarki indeksowały jak najwięcej treści na podstronach w serwisie. Z drugiej strony ukrywamy część treści przed użytkownikami przy pierwszym styku ze stroną, odkrywając je dopiero, gdy użytkownik sobie tego zażyczy, czyli kliknie i wywoła określoną akcję.

Bardzo duża część sklepów internetowych korzysta z tej funkcjonalności, aby skupić uwagę na najważniejszych elementach oferty i łatwiejszej nawigacji, natomiast jeśli użytkownik będzie zainteresowany danym produktem, wywoła dodatkowe informacje ukryte w Tabach.

Jaki to ma wpływ na SEO? Ma i to znaczący, ponieważ według Google najważniejsza jest treść widoczna dla użytkownika bezpośrednio po wejściu na stronę, natomiast treści ukryte (w tym Taby) są ignorowane lub ich wartość jest pomniejszana. Ważne jest, aby najważniejsze treści dla użytkowników były widoczne, a treści poboczne, które charakteryzują dany produkt/ofertę, użyte w tabach. Cytując wskazówki Google:

Upewnij się, że ważne treści są domyślnie widoczne w witrynie. Google może indeksować zasoby HTML ukryte w elementach nawigacyjnych, takich jak karty czy sekcje rozwijane. Uważamy jednak, że dostępność takich treści dla użytkowników jest nieco ograniczona, więc proponujemy umieszczenie najważniejszych informacji w domyślnym widoku strony.

Wskazówki dla WebMaster'ów znajdziesz pod tym linkiem

FILTROWANIE BEZ PRZEŁADOWANIA

Filtrowanie produktów w sklepie według określonych kryteriów (np. określony producent, zakres cenowy, rozmiar, kolor itp.) jest jednym z ważniejszych aspektów wpływających na wygodę użytkowników, zwłaszcza w przypadku dużej liczby produktów w danym listingu. Filtry to również ważny element optymalizacji SEO, dzięki któremu możemy poszerzyć widoczność serwisu internetowego na bardziej szczegółowe słowa kluczowe. Jednak... nie zawsze.

W niektórych sklepach wykorzystywane jest rozwiązanie pozwalające na dynamiczne filtrowanie bez przeładowywania strony oparte o technologię AJAX. Dzięki aplikacjom AJAX przeglądarka internetowa może dostarczać treści od razu po wyborze przez użytkownika cechy - bez konieczności przeładowywania strony. Z punktu widzenia UX jest to wygodne rozwiązanie - użytkownik natychmiast otrzymuje listy produktów zawężone do wybranych przez niego kryteriów. Niestety, z punktu widzenia SEO filtrowanie produktów w technologii AJAX nie jest idealne.

Roboty wyszukiwarek nie są w stanie odczytywać treści ładowanej dynamicznie bezpośrednio w przeglądarce - nie mogą przetworzyć wyników filtrowania ani ich zaindeksować, bo nie mają do nich dostępu (kod strony pozostaje niezmienny). Google próbowało radzić sobie z tym problemem tworząc schematy i wskazówki dotyczące crawlowania AJAX, jednak od października 2015 roku rozwiązania te nie są już przez Google wspierane.

Z punktu widzenia SEO lepszym wyjściem jest generowanie statycznych URL’i dla wyników filtrowania. Aby wyniki filtrowania były dostępne dla robotów wyszukiwarek i mogły zostać zaindeksowane, muszą powstać odrębne, indeksowalne podstrony statyczne dla poszczególnych zawężeń związanych z cechami produktów. W przypadku takiego rozwiązania użytkownik w trakcie filtrowania musi zatwierdzić swój wybór cech, na ogół poprzez przycisk “Filtruj”. Ze względu na nieco dłuższy proces filtrowania statycznego filtrowanie produktów w sklepach jest obszarem, gdzie UX i SEO nie do końca idą ze sobą w parze.

SZYBKOŚĆ ŁADOWANIA STRONY

Jeśli strony internetowe chcą być użyteczne, to zdecydowanie muszą działać szybko, a czas ich wczytywania musi być jak najkrótszy. Szybkość ładowania strony jest czynnikiem rankingowym, a bardzo długi czas ładowania może obniżyć pozycję serwisu w SERP. Jest to szczególnie istotne w przypadku mobilnych wersji serwisów www. Szybkość ładowania witryny zależy w głównej mierze od 3 czynników: wydajności serwera, na którym znajduje się serwis, optymalizacji kodu źródłowego i skryptów, wielkości (kompresji) plików graficznych na stronie.

Aby sprawdzić jakość własnego serwisu pod względem szybkości ładowania strony, możemy skorzystać np. z darmowych narzędzia, które udostępnia Google - PageSpeed Insights

Google Analytics

W sekcji Zachowanie standardowych raportów Google Analytics mamy całą serię raportów dostarczających dane związane z szybkością działania serwisu.

W raportach, oprócz uśrednionych danych dla całej witryny, możemy swobodnie analizować szczegółowo zachowanie dla konkretnych podstron serwisu czy uzyskać sugestie dotyczące optymalizacji tego wskaźnika na stronie.

Wszelkie analizy i proponowane usprawnienia serwowane są przez narzędzie należące do Google, czyli PageSpeed Insights . Dzięki niemu dowiemy się dokładnie, jakie elementy działania strony czy serwera powinniśmy poprawić.

Mobile First Index (RWD lub wersja mobilna strony)

O tym, że w obecnych czasach kanał mobilny jest niezbędny w każdym biznesie on-line, chyba nie trzeba nikogo przekonywać. A jednak. W branży e-commerce nie zawsze jest to takie oczywiste - nie wszystkie serwisy posiadają swoją wersję “mobile”. Najpopularniejszym i najsensowniejszym rozwiązaniem dla sklepów internetowych jest oczywiście wersja responsywna sklepu (RWD*). Z punktu widzenia pozycjonowania jest to również najlepsze rozwiązanie, gdyż mamy jedną optymalizację SEO dla wszystkich urządzeń. Jednak o dobry UX znacznie trudniej zadbać na urządzeniach mobilnych niż na desktopach. Głównie ze względu na mniejsze ekrany tabletów i telefonów komórkowych, przez co zapewnienie możliwości przejrzystego i wygodnego odbioru treści jest nie lada wyzwaniem.

*RWD - Responsive Web Design (RWD) – technika projektowania strony www, tak aby jej wygląd i układ dostosowywał się automatycznie do rozmiaru okna urządzenia, na którym jest wyświetlany np. przeglądarki desktopowej lub mobilnej (dla smartfonów i tabletów). Strona tworzona w takiej technice jest uniwersalna i wyświetla się dobrze zarówno na dużych ekranach, jak i na smartfonach czy tabletach.

W kwestiach związanych z UX dla wersji mobilnych stron również z pomocą przychodzi nam Google, dostarczając odpowiednie analizy i wnioski w swoich narzędziach online. Podstawowe błędy w użyteczności możemy analizować w Google Search Console, gdzie dostaniemy konkretne wytyczne, w jakich aspektach strona może być nieprzyjazna użytkownikom mobilnym.

Obsługa na urządzeniach mobilnych (Google Search Console)

Jak UX i optymalizacja SEO mogą pozytywnie wpłynąć na efektywność sklepu internetowego

Nawet najlepiej widoczne w wyszukiwarkach serwisy internetowe, jeśli będą trudne w odbiorze przez użytkowników, nie przyniosą zamierzonych efektów dotyczących konwersji. Dlatego dobry UX jest kluczowym elementem sukcesu. Jednak w procesie projektowania nie możemy ignorować kwestii SEO. W niektórych przypadkach będzie to łatwe do wdrożenia, w innych trzeba iść na kompromisy, sprytnie lawirując pomiędzy użytecznością a SEO.

Niezależnie od tego na którym aspekcie w danym momencie się skupiamy, trzeba pamiętać o:

  • dobrej jakości treściach

  • łatwej i przejrzystej strukturze serwisu dla każdego typu urządzeń

  • funkcjonalnej nawigacji oraz wyszukiwarce

  • “lekkości” strony wpływającej na czas jej wczytywania

  • optymalnym linkowaniu wewnętrznym

  • wygodnym procesie zamówienia.


O Autorze:

Więcej o SEMPAI

image

Komentarze

Debug turned on!

0.41 select * from `eventjuicer_hosts` where `eventjuicer_hosts`.`host` = ? limit 1
0.48 select * from `bob_event_groups` where `bob_event_groups`.`id` = ? and `bob_event_groups`.`id` is not null limit 1
0.4 select * from `bob_organizers` where `bob_organizers`.`id` = ? limit 1
0.5 select * from `eventjuicer_settings` where `eventjuicer_settings`.`settingable_id` = ? and `eventjuicer_settings`.`settingable_id` is not null and `eventjuicer_settings`.`settingable_type` = ?
0.49 select * from `eventjuicer_settings` where `eventjuicer_settings`.`settingable_id` = ? and `eventjuicer_settings`.`settingable_id` is not null and `eventjuicer_settings`.`settingable_type` = ?
0.34 select * from `eventjuicer_texts` where `eventjuicer_texts`.`textable_id` = ? and `eventjuicer_texts`.`textable_id` is not null and `eventjuicer_texts`.`textable_type` = ?
0.3 select * from `eventjuicer_texts` where `eventjuicer_texts`.`textable_id` = ? and `eventjuicer_texts`.`textable_id` is not null and `eventjuicer_texts`.`textable_type` = ?
0.21 select * from `eventjuicer_pages` where `eventjuicer_pages`.`pageable_id` = ? and `eventjuicer_pages`.`pageable_id` is not null and `eventjuicer_pages`.`pageable_type` = ?
0.13 select * from `eventjuicer_pages` where `eventjuicer_pages`.`pageable_id` = ? and `eventjuicer_pages`.`pageable_id` is not null and `eventjuicer_pages`.`pageable_type` = ?
0.1 select * from `editorapp_posts` where `editorapp_posts`.`id` = ? limit 1
0.12 select * from `editorapp_post_meta` where `editorapp_post_meta`.`post_id` in (?)
0.09 select * from `eventjuicer_users` where `eventjuicer_users`.`id` in (?)
0.13 select * from `editorapp_posts` where `group_id` = ? and `is_published` = ? order by `published_at` desc limit 10 offset 0
0.21 select * from `editorapp_post_meta` where `editorapp_post_meta`.`post_id` in (?, ?, ?, ?, ?, ?, ?, ?, ?, ?)
0.14 select * from `eventjuicer_users` where `eventjuicer_users`.`id` in (?)
0.21 select `bob_tags`.*, `editorapp_post_tag`.`xref_id` as `pivot_xref_id`, `editorapp_post_tag`.`tag_id` as `pivot_tag_id`, `editorapp_post_tag`.`group_id` as `pivot_group_id`, `editorapp_post_tag`.`organizer_id` as `pivot_organizer_id`, `editorapp_post_tag`.`published_at` as `pivot_published_at`, `editorapp_post_tag`.`is_published` as `pivot_is_published` from `bob_tags` inner join `editorapp_post_tag` on `bob_tags`.`id` = `editorapp_post_tag`.`tag_id` where `editorapp_post_tag`.`xref_id` = ?
4.26