Budowa szablonów i stron RWD – zmiany w Google po 21 kwietnia

Rok 2015 przez wielu specjalistów naznaczony został jako „rok mobile”. W sieci pojawiło się  mnóstwo artykułów, które przepowiadają nastanie problemów dla wszystkich właścicieli serwisów, którzy nie zapewniają internautom wersji swojego serwisu przeznaczonej pod urządzenia przenośne o czym przeczytasz w artykule Polskie SEO SEM 2015. Samo Google dało sygnał, który został zinterpretowany na różne sposoby przez czytelników. Niezaprzeczalny fakt jest tylko jeden – 21 kwietnia wyszukiwarka wprowadzi aktualizację, która ma się przełożyć na poprawę pozycji serwisów posiadających mobilne wersje.

Czego mamy się spodziewać? Czego mamy się bać i czy faktycznie powinniśmy wszyscy jak najszybciej zlecać stworzenie responsywnej lub mobilnej wersji strony? Co jeszcze warto wiedzieć o budowaniu stron mobilnych?

Czy gra jest warta  świeczki?

Na facebookowych grupach SEO I SEO Poland przeprowadziłem ankietę z pytaniem o to, jaka część ruchu pochodzi z urządzeń mobilnych? Najwięcej głosów sugeruje, że ruch z urządzeń mobilnych to od 20 do 30 proc. wszystkich wejść na witryny.  Na drugim miejscu znalazł się przedział 10-20 proc. a były i takie osoby, u których ruch mobilny przekracza 30 proc. Przy takich proporcjach jednoznaczne jest, że właściciel stron powinien zapewnić odwiedzającemu odpowiednią wersję strony, aby go nie zniechęcić.

Ankieta Facebook Grupa seo…

Ankieta SEO Poland Google+

Ciekawe komentarze do ankiety

Podstawy budowy stron mobilnych

Użytkownik powinien mieć do dyspozycji serwis, którego obsługa przez urządzenia mobilne będzie komfortowa i łatwa. Kwestie o które należy zadbać to przede wszystkim:

• wyświetlany obszar stron powinien dopasowywać się do rozmiaru urządzenia,
• użytkownik nie powinien być zmuszany do powiększania i pomniejszania treści dla możliwości zobaczenia całej strony, strona nie powinna zmuszać również do przewijania w poziomie, dla poznania serwisu,
• czcionki powinny być skalowalne, aby ułatwiało to odczyt na małych ekranach,
• wszelkie dotykowe elementy na stronie powinny być od siebie odpowiednio oddalone, aby nie generowały problemów z obsługą,
• warto pamiętać, że większość przeglądarek komórkowych nie odczytuje zawartości Flash, a oznacza to, że animacje i tak się nie wyświetlą.
• strony powinny zawierać okno robocze korzystające  z tagu meta viewport, który informuje o regulacji rozmiaru strony oraz jej skalowaniu.
• należy zadbać o szybkości i wagę stron pod mobile

Co warto zrobić w tym kierunku?

Optymalizacja obrazków (dpi dostosowane do wyświetlania na monitorze, a nie np 300). Wymiary zdjęć takie jak powinny być, aby przeglądarka nie musiała skalować obraz. Kolejna kwestia to stosowanie narzędzi które wykorzystują ulepszone algorytmy kompresji jpg / png, optymaliacja kodu (usunięcie części zakomentowanych / niepotrzebnych, minifikacja html / css / js) – istnieją do tego narzędzia zarówno jako wtyczki do WP , moduły php działające online jak i programy desktopowe – wykonujemy kompresję / optymalizację kodu  i uplodujemy pliki na serwer.

Optymalizacja szybkości strony powinna być pierwszym krokiem w procesie jej dostosowania pod urządzenia mobilne, tak by korzystanie z serwisu nie wymagało wykorzystania bardzo dużych ilości transferu.

Więcej przeczytaz w pomocy google https://support.google.com/webmasters/answer/6101188?hl=pl

Dedykowane adresy url

Strona pod urządzenia przenośne może być wyświetlana użytkownikowi pod innym adresem niż wersja pod komputery. Często stosowanym adresem dla wersji mobilnej jest wydzielenie osobnej subdomeny np. m.adresstrony.pl . Ułatwienie rozpoznania konfiguracji witryny przez Google będzie możliwe poprzez zastosowanie odpowiednich adnotacji:

• na stronie pod komputery należy umieścić tag link rel=”alternate”, w którym wskażesz odpowiedni adres URL wersji na komórki, 

• wersja serwisu pod urządzenia przenośne niech zawiera tag link rel=”canonical”, który wskaże odpowiedni adres wersji pod komputery – dotyczy to sytuacji, kiedy treść wersji mobile jest identyczna, jak tej pod komputery.

Wspomniane adnotacje należy umieścić albo bezpośrednio w kodzie HTML, albo w mapie witryny. Dzięki dwukierunkowej adnotacji Google wie, że ma do czynienia ze stronami, które mają równoważną treść i powinny być traktowane jako jeden serwis. Jeśli wersje strony będą traktowane jako całkowicie odrębne, niezależne od siebie, może to wpłynąć negatywnie na pozycje strony w rankingu – w takich sytuacji po prostu mamy do czynienia z duplicate content, które postrzegane jest przez Google negatywnie. Należy szczególnie zadbać o to, aby przy zastosowaniu znaczników rel=”alternate” i rel=”canonical” każda strona mobilna posiadała swój odpowiednik na komputery, a nie np. kilka różnych stron w wersji pod komputer prowadziło do dokładnie tej samej pod urządzenia mobilne.

Jeśli strona obsługuje automatyczne przekierowania prowadzące pod odpowiednie adresy URL, należy pamiętać o odpowiednim przekierowaniu robota Google. Można zastosować przekierowania:

• przekierowanie HTTP – zaleca się stosowanie kodu 302, istotne aby przekierowanie było zgodne z adresem określonym w ramach tagu rel=”alternate”.
• przekierowanie JavaScript – przekierowania tego typu można dokonać na wiele sposobów, a jednym z nich jest wykorzystanie funkcji matchMedia(). W przypadku tego typu przekierowania musimy się liczyć z opóźnieniem w ładowaniu serwisu.

Webmasterzy mogą korzystać zarówno z przekierowań dwustronnych i jednostronnych. Np. wchodząc z urządzenia mobilnego na wersję pod komputery zostaniemy przekierowani na wersję mobilną, ale w odwrotnej sytuacji już to nie nastąpi. I tutaj mamy przykład przekierowania jednostronnego. Google nie wskazuje, które rozwiązanie jest najlepsze, lecz sugeruje przede wszystkim dbać o użytkownika i np. dać mu możliwość przeglądania wersji komputerowej mobilnie, jeśli będzie miał taką potrzebę.

Więcej poczytasz w pomocy Google https://developers.google.com/webmasters/mobile-sites/mobile-seo/configurations/separate-urls?hl=pl

Konfiguracja nagłówka http

W przypadku dynamicznego serwowania treści, serwer wysyła z jednego adresu url różny kod w zależności od urządzenia.  W tym przypadku od razu wiadome jest, że strona ma inny kod stworzony dla użytkownika smartfonów, dlatego serwer powinien wysłać do robota Google wskazówkę, że ma zaindeksować taką stronę, aby odnaleźć wersję na komórki. Wskazówka powinna być umieszczona w nagłówku HTTP Vary. Nagłówek Vary to informacja, że odpowiedź ze strony serwera będzie uzależniona od rozpoznanego typu urządzenia.

Przy wykrywaniu klientów użytkownika niestety dochodzić może do błędów:

• Aby wykryć klienta należy go dopasować do ciągów tekstów, które są zapisane na liście na serwerze. Problem w tym, że wymaga to ciągłego aktualizowania, aby można było rozpoznać nowe urządzenia, tymczasem wielu webmasterów po prostu tych list nie aktualizuje.
• Często może dochodzić do błędów przypisania. Wtedy np. użytkownik mobilny jest rozpoznawany jako komputerowy. Strony potrafią traktować również tablety jak smartfony. Wykrywanie klientów powinno obejmować ciągi znaków typowe dla danego urządzenia np. zawierające słowo „Android”, ale nie składające się wyłącznie z tego słowa.

Wady:

• utrzymywanie 2 różnych kodów witryny,
• w przypadku witryn bez repozytorium treści (baza / pliki), konieczność zarządzanie tą samą treścią  w 2 lokalizacjach,
• konieczność synchronizacji  znacznikami meta (canonical / alternative) stron pod komputer i urządzenia mobilne (potencjalne źródło problemów z indeksowaniem),
• problemy z poprawnym rozpoznaniem czy request pochodzi z urządzenia mobilnego i jaką wersję mu zaserwować,
• strona taka sama pod względem wizualnym na wszystkich rozdzielczościach “mobilnych” (można kombinować ale w ten sposób zbliżamy się do RWD więc po co?)

Zalety:

• separacja kodów mobilnych od niemobilnych witryny (jest to wada i zaleta – zależy od upodobania osoby wykonującej stronę)
• waga witryny mniejsza, szybkość wczytywania / renderowania większa od tej wykonanej w RWD

 Więcej przeczytasz w pomocy Google https://developers.google.com/webmasters/mobile-sites/mobile-seo/configurations/separate-urls?hl=pl

Podstawy RWD

RWD (Responsive Web Design) czyli elastyczne projektowanie witryn, oznacza tworzenie serwisów, które swój układ uzależniają od rozdzieczości urządzenia na których są wyświetlane. Przesyłany jest ten sam kod html, a dopiero na podstawie definicji stylów  CSS strona jest odpowiednio renderowana przez przeglądarkę. Google wykryje taką konfigurację jeśli nie będzie miało blokowanego dostępu do indeksowania zasobów strony  (częsty błąd wynikający z blokowania katalogów zwierających css’y/skrypty js).

Wersja RWD Desktop

Wersja RWD mobile

Przeglądarki będą wiedziały, że Twój serwis jest dopasowany pod różne wersje urządzeń, jeśli umieścisz następujący Tag w kodzie html::

<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>

Jeśli wspomnianego meta tagu zabraknie, przeglądarki mobilne będą automatycznie renderować stronę pod szerokość ekranu komputera stacjonarnego. Poprawią wygląd, dopasują czcionki, jednak uzyskany efekt będzie daleki od pozwalającego na swobodne korzystanie ze strony – głównie chodzi o to że strona nie będzie dostosowana do obsługi dotykowej ze względu na “małe” elementy (linki, przyciski itp) i wymaga powiększania/przesuwania .

Najważniejsze zalety elastycznego projektowania stron to przede wszystkim:

• używanie pojedynczego adresu url dla wybranej treści, co ułatwia choćby jej linkowanie,
• mniej czasochłonne jest dbanie o  strony zbudowane w taki sposób,
• rzadziej dochodzi do błędów spotykanych w serwisach mobilnych,
• nie ma konieczności każdorazowego przekierowywania użytkownika na właściwy dedykowany adres, co skraca czas wczytywania,
• nie ma problemu duplikacji treści pomiędzy wersją na komputery i urządzenia mobilne,
• nie ma konieczności stosowania metaznaczników canonical i alternate,
• to rozwiązanie jest promowane przez Google,
• nie występuje problem rozpoznania czy request pochodzi z urządzenia mobilengo

Wady:

• przemieszanie kodu “mobilnego i niemobilnego co wymusza konieczność testowania każdej zmiany na wersjach tej i tej,
• na etapie projektowania / dostosowania należy bardzo dokładnie przemyśleć strukturę witryny pod komputery, tak aby jej elementy skalowały się i przemieszczały wraz z rozmiarem ekranów urządzeń mobilnych. Niekiedy jest to niewykonalne i trzeba witrynę tworzyć od nowa. W większości przypadków trzeba pójść na kompromis “estetyczny”. Drugim istotnym problemem projektowym jest ustalenie przedziałów rozdzielczości (punktów granicznych) po przekroczeniu których strona ma zmieniać swój układ, Na rynku jest tyle smartfonów o różnych rozdzielczościach, że wszystkim się nie dogodzić a więc kolejny kompromis. Te przedziały można ustawić na podstawie statystyk GA dla danej witryny / branży i wybrać max 3 najbardziej popularne. Innym sposobem jest zaczęcie od zaprojektowania treści / uładu tak, by pasowały do ekranu o małym rozmiarze, a potem powiększaniu go do momentu kiedy uznajemy, że wygląd strony należy dostosować. W tym punkcie rozdzielczości  tworzymy punkt graniczny. W ten sposób punkty pod kątem treści / układu elementów będą optymalne i uzyska się  najmniejszą ich liczbę.

Przy tworzeniu serwisów przyjaznych dla urządzeń przenośnych można stosować JavaScript, ale powinno to być przemyślane. Trzy najczęstsze zastosowania JavaScriptu w przypadku serwisów optymalizowanych pod urządzenia przenośne to:

• JavaScript serwowany dynamicznie –  każde urządzenie otrzymuje ten sam kod html, przy czym JavaScript jest przesyłany z adresu URL, który określa w sposób dynamiczny rodzaj w zależności od użytkownika.

• Wykrywanie łączone – po stronie klienta witryna korzysta z JavaScriptu, a z technik wykrywania pod stronie serwera i w ten sposób przesyłane są odpowiednie treści.

• JavaScript adaptacyjny – każde urządzenie otrzymuje te same treści HTML, CSS i JavaScript. Sposób działania czy funkcjonowania strony zmienia się po wykonaniu JavaScriptu.

Więcej przeczytasz  w pomocy Google https://developers.google.com/webmasters/mobile-sites/mobile-seo/configurations/responsive-design?hl=pl

Podstawowe błędy i ich unikanie

Najczęściej w budowie witryn mobilnych spotkane są bardzo podobne błędy. Oto te najważniejsze i sposoby na ich unikanie:

• Zablokowane pliki JavaScript, CSS i obrazy – robot Google powinien mieć dostęp do JavaScript, CSS oraz grafik, aby widział ją tak jak użytkownicy. Plik robots.txt nie może blokować ich indeksowania. Blokada obniża jakość renderowania i może mieć wpływ na niższą pozycję w rankingu.
• 404 wyłącznie na urządzeniach mobilnych – zdarzają się sytuacje kiedy użytkownik otwierając dany odnośnik na komputerze widzi jego zawartość, a w przy urządzeniu mobilnym wyświetla się błąd. W przypadku zauważenia, że użytkownicy na urządzeniach przenośnych trafiają na wersję pod komputery, przy czym dana strona posiada wersję pod urządzenia mobilne – ustaw odpowiednie przekierowanie. Aby unikać błędów:
  • dodaj stronę do narzędzi dla webmasterów – otrzymasz wtedy powiadomienie w centrum wiadomości,
  • używaj elastycznego projektowania witryn – dzięki temu użytkownicy zobaczą taką samą stronę bez względu na wykorzystywane urządzenie,
  • sprawdzaj błędy indeksowania w narzędziach dla webmasterów,
  • zadbaj o poprawność wykrywania urządzeń w przypadku serwowania dynamicznego
  • jeśli Twoja strona posiada oddzielną wersję url na smartfony, skonfiguruj serwer tak, aby przekierowywał użytkownika pod równoważne adresy,
  • jeśli dana strona serwisu nie posiada wersji pod urządzenia mobilne, to lepiej zatrzymać użytkownika na wersji pod komputery, niż pokazać mu stronę błędu.
• Zawartość, której nie da się otworzyć – niektóre typy materiałów filmowych i innych, nie są możliwe do otwarcia na urządzeniach mobilnych. Wynika to z licencji, wymogu posiadania odpowiedniego odtwarzacza czy stosowania Flasha. Aby uniknąć wyświetlenia użytkownikom błędu tego typu należy stosować do zamieszczania filmów i animacji tagi w standardzie HTML5. Animacje w standardzie HTML5 pomaga tworzyć m.in. Google Web Designer.
• na urządzeniach mobilnych mogą wystąpić problemy z okienkami modalnymi / popup’ami – zwłaszcza z ich zamykaniem przez użytkownika – należy unikać takich rozwiązań
• Błędne przekierowanie– jeśli wykorzystujesz różne adresy url pod komputery i urządzenia przenośne to zadbaj o odpowiednie przekierowania. Złym rozwiązaniem jest przekierowanie przy wersji mobilnej użytkownika np. na stronę główną bez względu na to, jaki adres url wybrał. Aby nie dopuścić do problemów:
  • Dodaj stronę do narzędzi dla webmasterów. Otrzymasz wtedy powiadomienia jeśli zostanie wykryte przekierowanie z jakiejkolwiek podstrony na stronę główną. Będziesz również mógł sprawdzić wszystkie inne błędy przekierowania.
  • Jeśli dana podstrona nie posiada wersji mobilnej to lepiej pozostawić użytkownika na wersji pod komputery, niż przekierować go na stronę główną.
  • Wykorzystaj elastyczne projektowanie witryn, aby wyświetlać te same treści na komputerach i urządzeniach przenośnych.
• Stosowanie pełnoekranowych reklam – webmasterzy używają na swoich stronach reklam, które zasłaniają cały ekran. Mocno utrudnia to korzystanie ze strony, jak również może negatywnie wpłynąć na jej indeksowanie. Dużo lepszym rozwiązaniem w takiej sytuacji będzie promowanie aplikacji czy usług za pomocą reklamy graficznej wbudowanej w treść.
• Złe wzajemne linkowanie – częstym błędem w przypadku serwowania odrębnych adresów url zoptymalizowanych pod urządzenia mobilne jest stosowanie linków do wersji komputerowej i na odwrót. Dochodzi do sytuacji kiedy np. wybrane linki na wersji mobilnej kierują do pewnego adresu na stronie pod komputery.
• Wolne działanie wersji serwisu pod urządzenia przenośne – wolno wczytujący się serwis może irytować użytkownika. W celu sprawdzenia przyczyny wolnego wczytania można wykorzystać narzędzie PageSpeed Insights, które powinno pomóc znaleźć przyczyny problemów.

Więcej przeczytasz w pomocy Google https://developers.google.com/webmasters/mobile-sites/mobile-seo/common-mistakes/?hl=pl

WordPress i wersja dla komórek

 Witryny oparte na WordPress`ie można hostować bezpośrednio w domenie wordpress.com lub wykorzystać samo oprogramowanie w witrynie umieszczonej na własnej domenie i serwerze. W jaki sposób zapewnić wersję mobilną w obu przypadkach?

Hostowanie na domenie WordPress

W pierwszym z przedstawionych przypadków warto wcześniej dokonać kopii zapasowej witryny, a następnie przystąpić do utworzenia jej wersji mobilnej. System WordPress automatycznie zaprezentuje użytkownikowi motyw przyjazny dla urządzeń mobilnych, który będzie odpowiadał motywowi wykorzystywanemu obecnie oraz platformie mobilnej gościa.

Hostowanie we własnej domenie

W drugim przypadku, należy sprawdzić, jaki motyw jest używany. Taką informację możemy pozyskać z panelu administracyjnego. Numer wersji powinien być widoczny w górnej części panelu lub w stopce. Można go znaleźć w podglądzie źródła witryny, szukając metatagu generator z numerem wersji, albo w pliku  /wp-includes/version.php, w edytorze tekstu.

Jeśli wykorzystywany motyw wymaga aktualizacji, należy tego dokonać, dzięki czemu uwzględnione zostaną w systemie najnowsze zabezpieczenia, zaś sama witryna stanie się przyjazna dla urządzeń mobilnych.

Kolejnym krokiem jest sprawdzenie adresu URL w narzędziu „Test optymalizacji mobilnej”. Żadnej dodatkowej akcji użytkownik nie będzie musiał podejmować, jeśli test wykaże wynik  „przyjazny dla urządzeń mobilnych”(Awesome! This page is mobile-friendly!). W przeciwnym wypadku należy zmienić lub zmodyfikować używany motyw. Motyw dostosowuje się automatycznie do zaistniałych warunków. Czasem wystarcza aktualizacja używanego motywu.

Nowy motyw przetestujmy w wersji demo na komputerze i urządzeniach mobilnych, a jeśli takimi nie dysponujemy, w narzędziach dla programistów Google Chrome można skorzystać z funkcji „emulacji urządzenia przenośnego”.  Kontroli motywu dokonamy z wykorzystaniem narzędzia PageSpeed Insights w WordPress. W wyszukiwarce motywów można ustawić filtr „motyw z tagiem responsive layout”. Wyniki wyszukiwania zaprezentują wyłącznie motywy elastyczne. 

Wersja WordPress na komputer i smartfon

 Twórcy witryn WordPress, którzy nie chcą zmieniać dotychczasowego motywu, mogą wzbogacić swoją stronę o funkcje optymalizacji mobilnej. Można w tym celu skorzystać z rozwiązań opartych na wtyczkach:

• Jetpack – dla właścicieli witryn hostowanych w domenie wordpress.com i we własnych domenach,
• WPTouch – wtyczka tworząca osobną wersję witryny z osobnym motywem dla urządzeń mobilnych,
• WP Mobile Detector – wtyczka oferuje motywy pod urządzenia mobilne.

Można też samemu zaprojektować motyw witryny przyjaznej dla użytkowników mobilnych, korzystając z WordPress Codex.

Po wprowadzeniu wszelkich zmian w motywach witryny WordPress, hostowanej na własnej domenie, można na koniec sprawdzić ją za pomocą narzędzia testu optymalizacji mobilnej.

Więcej przeczytasz w pomocy Google https://developers.google.com/webmasters/mobile-sites/website-software/wordpress?hl=pl

Narzędzie Google do testowania witryn mobilnych

 Po utworzeniu wersji witryny, która ma być przyjazna dla urządzeń mobilnych, warto ją przetestować. Google posiada odpowiednie ku temu narzędzia, m.in. Test zgodności z urządzeniami przenośnymi.

Test jest bardzo prosty i wymaga podania jedynie ścieżki dostępu do witryny. Analizuje on adresy URL witryn pod kątem ich obsługi przez urządzenia mobilne. Strony „przyjazne dla urządzeń mobilnych” spełniają odpowiednie kryteria, które są sprawdzane przez robota Google.  Narzędzie znajduje się pod adresem: https://www.google.com/webmasters/tools/mobile-friendly/

Po wprowadzeniu adresu strony narzędzie zwraca odpowiedni komunikat:

Tak wygląda pozytywny test strony, natomiast negatywny:

Pozytywny wynik testu mobile

Negatywny test stron mobilnych

Szybkość ładowania witryny

Dla przyjazności strony pod kątem użytkowników mobilnych ma znaczenie również jej prędkość ładowania.  Strona powinna być dopasowana do możliwości i rozdzielczości tabletów oraz smartfonów. Można to sprawdzić korzystając z narzędzia PageSpeed Insights Tool od Google. Narzędzie opiera się nie tylko na pomiarze szybkości ładowania witryny. Można nim przetestować stronę pod kątem czynników takich jak:

• niepotrzebne pluginy na stronie,
• skonfigurowanie wyświetlania strony na mniejszych ekranach,
• dopasowanie rozmiaru strony do mniejszych ekranów,
• zapewnienie odpowiedniej wielkości przycisków,
• używanie czytelnych rozmiarów czcionek.

Inne narzędzie, które możemy wykorzystać to http://gtmetrix.com/. Po wpisaniu adresu narzędzie dokonuje szczegółowej analizy. Jako ciekawostkę potraktujecie zestawienie znajdujące się pod adresem http://gtmetrix.com/top1000.html. Znajdują się tam szczegółowe dane dla znanych serwisów – warto zerknąć np. jak wygląda porównanie dla Google i Bing.

Mobile SEO Tool

Kolejnym, ważnym narzędziem testującym przyjazność witryny dla urządzeń mobilnych, jest Mobile SEO Tool od Feedthebot. Aplikacja pozwala na sprawdzenie konfiguracji gotowej strony mobilnej i skontrolowanie, czy jest ona kompatybilna z wytycznymi Google.

https://www.google.com/webmasters/tools/mobile-friendly/

Jak traktować tablety?

Tablety są jednymi z najczęściej wykorzystywanych urządzeń mobilnych do przeglądania stron internetowych. Witryny przygotowywane pod kątem użytkowników tych urządzeń powinny opierać się na elastycznych zasadach kreacji. Dzięki temu użytkownik będzie mógł wygodnie przeglądać stronę www na swoim tablecie.

Elastyczne projektowanie witryn

Przy dostosowywaniu witryny pod kątem tabletów, nie trzeba zmieniać adresu URL, choć nie jest to wykluczone. Jeśli twórca strony zdecyduje się na oddzielne adresy URL, powinien zezwolić botowi Google na zaindeksowanie adresów URL dla tabletów, a także użyć tagu rel=”canonical”.

Google radzi, aby odróżniać przy wyświetlaniu witryny w przeglądarce użytkownika, smartfon i tablet z systemem Android na podstawie user agenta. Przy tabletach pojawi się tylko słowo „Android”, a przy smartfonach również słowo „Mobile”.

Więcej przeczytasz w pomocy Google

http://googlewebmastercentral.blogspot.com/2012/11/giving-tablet-users-full-sized-web.html

https://developers.google.com/webmasters/mobile-sites/mobile-seo/other-devices/tablets?hl=pl

Alternatywne rozwiązania dla nie smartfonow

Witryny internetowe mogą być wyświetlane z wykorzystaniem telefonów komórkowych – zarówno smartfonów, jak i feature phone (telefonów starszej generacji). Telefony z internetem, które nie są smartfonami nie obsługują zapytań o media CSS, dlatego też webmaster chcący zoptymalizować posiadaną witrynę pod kątem użytkowników wykorzystujących w praktyce takie urządzenia, powinien zastosować technikę dynamicznego serwowania treści lub zaproponować dedykowany adresy URL dla strony www specjalnie z myślą o telefonach z internetem.  Webmaster korzysta przy tym z tej samej konfiguracji serwera, który stosuje się przy optymalizacji witryny pod kątem smartfonów. Należy wybrać konfigurację serwera tak, by w odpowiedzi wysyłał nagłówek HTTP „Vary: User-Agent”.

Dedykowane adresy URL dla poszczególnych użytkowników – smartfonów, komputerów i telefonów starszej generacji z internetem, mogą użyć trzy różne konfiguracje serwerowe:

• Konfiguracja ze specjalnym adresem URL: http://phone.example.com/page-1,z dopiskiem <link rel=”canonical” href=”http://www.example.com/page-1″ />
• Konfiguracja adresów URL na wszystkie komórki: http://m.example.com/page-1  z adnotacją  <link rel=”canonical” href=”http://www.example.com/page-1″ />
• Konfiguracja osobnych adresów URL na telefony z internetem: http://example.com/page-1 z adnotacją: <link rel=”canonical” href=”http://www.example.com/page-1″ />.

Więcej przeczytasz w pomocy Google https://developers.google.com/webmasters/mobile-sites/mobile-seo/other-devices/feature-phones?hl=pl

Zmiany w google a witryny mobilne

Google zmieniając i aktualizując swoje algorytmy wyszukiwania dąży do przedstawiania użytkownikom wyłącznie najlepiej dopasowanych wyników dla ich zapytań. Podobnie jest podczas wyszukiwania treści na urządzeniach mobilnych.  Algorytmy Google są dostosowywane skrupulatnie do tych nowych wzorców i aktualizowane pod kątem poprawnej konfiguracji, możliwości ich wyświetlania na nowoczesnych urządzeniach oraz znajdowania przez użytkowników witryn zoptymalizowanych pod kątem komórek. Wprowadzone zostało także indeksowanie aplikacji, aby podkreślić ich wartościową treść.

Już od 21 kwietnia 2015 roku optymalizacja mobilna będzie bardzo istotnym wyznacznikiem pozycji strony www w mobilnych wynikach wyszukiwania , bez względu na język i kraj na świecie, w którym użytkownik będzie korzystał z mobilnej wyszukiwarki.

Do zmiany tej już przygotowują się webmasterzy, przeprowadzając testy zgodności witryn z urządzeniami przenośnymi i wprowadzając do nich niezbędne zmiany optymalizacyjne.

Przeczytaj komunikaty Goole

http://googlewebmastercentral.blogspot.com/2015/02/finding-more-mobile-friendly-search.html

https://productforums.google.com/forum/?utm_medium=email&utm_source=footer#!category-topic/webmaster-pl/HPKlntf1FJM

Google Analytics dla urządzeń mobilnych

Google Analytics pozwala nam dość precyzyjnie sprawdzić statystyki dotyczące ruchu mobilnego w naszej witrynie. Możemy w łatwy sposób sprawdzić z jakich urządzeń korzystają nasi potencjalni klienci i przeanalizować te dane pod katem osiąganych konwersji. Po stworzeniu odpowiedniego segmentu niestandardowego, który uwzględnia tylko ruch z urządzeń mobilnych możemy szybko sprawdzić jak zachowują się użytkownicy, jakie strony przeglądają, ile czasu spędzają w witrynie oraz skąd do nas przychodzą (z wyników organicznych, z kampanii reklamowych, witryn odsyłających itp.). Dzięki takim danym i odpowiedniemu kontekstowi możemy wykorzystać te dane do realizacji naszych celów biznesowych.

Tworzenie segmentu:

Widok raportu dotyczącego źródeł ruchu (segment MOBILE):

Rodzaje urządzeń (raport):

Podsumowanie – co nas czeka?

John Mueller wspomniał podczas jednego z ostanich HO (https://www.youtube.com/watch?v=ujq-OTI5ET8)  , że  aktualne różnice pomiędzy wynikami uzyskiwanymi na komputerach i urządzeniach mobilnych są nieznaczne, bo zależą od dosłownie kilku czynników, w tym błędów w przekierowaniach i flasha wyświetlanego dla użytkowników mobilnych –  dopiero po kwietniowej zmianie różnice będą bardziej widoczne. Trudno przewidzieć jak duża będzie skala zmian, ale na pewno trzeba stwierdzić niezaprzeczalny fakt – posiadanie odpowiedniej wersji strony pod urządzenia przenośne w najbliższym czasie będzie niezbędne. Procent użytkowników przeglądających strony przez urządzenia przenośne będzie coraz wyższy, a brak odpowiedniej wersji strony może po prostu zniechęcić użytkowników do witryny.

A co myślą inni o mobile?

Łukasz Rogala – rogala.pro

Mobile jest seksy. I o tym warto pamiętać, szczególnie kiedy Google oficjalnie zapowiada zmiany z tym związane. Tworząc nową stronę postawiłbym na RWD ponieważ to bardzo wygodne rozwiązanie zarówno dla użytkowników jak i wyszukiwarki (brak przekierowań, mniejsze ryzyko problemów z tego wynikających).

PS. podczas pisania poradnika swoją wiedzą podzielili się TomekB, Marcin Wsół

PS.2. Jeśli ktoś jeszcze nie wie co to jest polskie RWD to zapraszam wiki http://pl.wikipedia.org/wiki/RWD 🙂