Techniki pozycjonowania mobilnego

Obecnie miliony użytkowników uzyskują dostęp do sieci za pomocą smartfonów z systemem Android, iOS lub Windows. W związku z tym konieczne stało się, aby strony internetowe dostosowywały się do tego zmieniającego się środowiska i wprowadzały odpowiednie zmiany w ich projekcie, aby przyciągnąć więcej widzów.

Przeglądanie i używanie wersji witryny na komputery może być trudne na urządzeniu mobilnym. Wersja, która nie jest przyjazna dla urządzeń mobilnych, wymaga od użytkownika uszczypnięcia lub powiększenia w celu odczytania treści. Użytkownicy uważają to za frustrujące i prawdopodobnie porzucą witrynę. Natomiast wersja przyjazna dla urządzeń mobilnych jest czytelna i dostępna od razu.

Ostatnia aktualizacja Google nakłada obowiązek, aby witryna była przyjazna dla urządzeń mobilnych, aby działała w wyszukiwarkach mobilnych. Pamiętaj, że witryna, która nie jest przyjazna dla urządzeń mobilnych, nie będzie miała żadnego wpływu na zwykłe wyszukiwarki.

W tym rozdziale zobaczymy, jak dostosować witrynę internetową do urządzeń mobilnych, aby zapewnić użytkownikom, którzy uzyskują dostęp do witryny za pomocą urządzeń mobilnych, optymalne wrażenia.

Co to jest SEO witryn mobilnych?

Optymalizacja pod kątem wyszukiwarek mobilnych to proces projektowania witryny internetowej w celu dostosowania jej do wyświetlania na urządzeniach przenośnych o różnych rozmiarach ekranu i niskiej przepustowości. Oprócz przestrzegania wszystkich zasad pozycjonowania, które obowiązują w przypadku strony na komputery stacjonarne, przy projektowaniu strony internetowej na urządzenia mobilne należy zachować szczególną ostrożność. Witryna jest przyjazna dla urządzeń mobilnych, jeśli ma następujące atrybuty -

  • Dobra witryna mobilna ma responsywną konstrukcję, która dobrze działa na komputerach stacjonarnych i urządzeniach mobilnych. Nie tylko ogranicza konserwację serwisu, ale także zapewnia spójność treści dla wyszukiwarek.

  • Zawartość dobrej witryny mobilnej można łatwo odczytać na urządzeniu mobilnym bez konieczności powiększania ekranu. Ma odpowiednie czcionki, kolory i układy.

  • Poruszanie się po dobrej witrynie mobilnej na małym ekranie jest łatwe. Zawiera linki i przyciski, którymi można łatwo manewrować palcem.

  • Dobra witryna mobilna jest lekka, przez co jej ładowanie w sieciach komórkowych zajmuje mniej przepustowości i czasu.

  • Strona główna serwisu mobilnego odgrywa najważniejszą rolę w łączeniu użytkowników z treściami, których szukają. Dlatego dobre strony mobilne dbają o to, aby najważniejsze linki były wyświetlane na Stronie Głównej, aby były wystarczająco widoczne.

Ranking witryny zależy w dużej mierze od tego, jak przyjazny jest dla użytkownika. Aby zaprojektować świetną witrynę dostosowaną do urządzeń mobilnych, postępuj zgodnie z podanymi poniżej wskazówkami.

Zoptymalizuj swoją witrynę pod kątem urządzeń mobilnych

Jeśli Twoja witryna jest już zoptymalizowana pod kątem wyszukiwarek, optymalizacja jej pod kątem urządzeń mobilnych nie powinna być zbyt trudna. Najpierw zastanówmy się, czego potrzeba, aby przejść na telefon komórkowy. Możemy podzielić kroki na trzy szerokie kategorie -

Step 1 - Wybierz konfigurację mobilną

Step 2 - Informuj wyszukiwarki

Step 3 - Unikaj typowych błędów

Wybierz konfigurację mobilną

Do wyboru są trzy różne konfiguracje urządzeń przenośnych -

Step 1 - Projektowanie responsywnych stron internetowych

Step 2 - Dynamiczne udostępnianie

Step 3 - Oddzielne adresy URL

Każdy ma swoje zalety i wady. Google zaleca projektowanie responsywne, jednak obsługuje wszystkie trzy konfiguracje. Poniższa tabela pokazuje, jak konfiguracja mobilna wpływa na adres URL i kod HTML -

Konfiguracja mobilna URL HTML
Responsywne projektowanie witryn internetowych Zostaje taka sama Zostaje taka sama
Dynamiczne udostępnianie Zostaje taka sama Różne HTML
Oddzielne adresy URL Różne adresy URL Różne HTML

Responsywne projektowanie witryn internetowych

Google zaleca projektowanie responsywnych stron internetowych, ponieważ jest to najprostsza konfiguracja mobilna i bardzo łatwa do wdrożenia. Podaje ten sam kod HTML pod tym samym adresem URL, ale dostosowuje wyświetlanie do rozmiaru ekranu urządzenia mobilnego.

Dynamiczne udostępnianie

Dynamiczne serwowanie to rodzaj konfiguracji mobilnej, w której adres URL Twojej witryny pozostaje niezmieniony, ale wyświetla inną zawartość HTML, gdy jest dostępna z urządzenia mobilnego.

Gdy treść jest dynamicznie udostępniana z serwera, poinformuj Google, że indeksowana przez nią treść może wyglądać inaczej na urządzeniach przenośnych. Główną wadą tego podejścia jest to, że będziesz musiał wykonać dodatkowe przetwarzanie swoich treści na poziomie serwera, zanim zostaną one przekazane użytkownikowi. Takie podejście powoduje niepotrzebne obciążenie serwera i spowalnia jego działanie.

Oddzielne adresy URL

Jeśli masz dwa różne adresy URL - jeden dla użytkowników urządzeń przenośnych, a drugi dla użytkowników komputerów stacjonarnych - pamiętaj, aby wyraźnie poinformować Google, kiedy udostępniać daną wersję. Google nie zaleca oddzielnych adresów URL, ponieważ może automatycznie wykryć, że strony mobilne różnią się od stron na komputery.

Takie podejście nie jest praktyczne, gdy masz dużą witrynę internetową, ponieważ utrzymanie dwóch wersji tej samej witryny będzie wymagało podwójnego wysiłku i pieniędzy. Jednocześnie nie możesz uniknąć różnych rozbieżności w treści, zachowując dwie wersje.

Z punktu widzenia SEO każdy adres URL działa oddzielnie. W związku z tym ranking dla komputerów stacjonarnych nigdy nie zostanie dodany do rankingu mobilnego i zawsze będzie traktowany jako oddzielne witryny internetowe. Nie zalecamy utrzymywania różnych adresów URL dla wersji mobilnych i stacjonarnych, jeśli chcesz czerpać korzyści z SEO.

Poinformuj wyszukiwarki

Upewnij się, że Google i inne wyszukiwarki rozumieją konfigurację Twojego telefonu komórkowego. Co najważniejsze, Google musi zrozumieć twoją stronę, aby mogła odpowiednio ocenić twoją witrynę. Sposób informowania Google zależy od wybranej przez Ciebie konfiguracji mobilnej - elastycznego projektowania witryn, dynamicznego wyświetlania lub oddzielnych adresów URL.

Jeśli Twoja witryna ma rozszerzenie responsive design,Algorytmy Google mogą to zrozumieć automatycznie, bez konieczności informowania Google. Jeśli masz projekt responsywny, upewnij się, że w nagłówku swojej strony masz następujący metatag -

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

Okno robocze decyduje o sposobie wyświetlania strony internetowej na urządzeniu. Witryna z responsywnym projektem zmienia swój rozmiar w zależności od rozmiaru ekranu urządzenia. Zadeklaruj widoczny obszar, aby Twoja strona internetowa wyświetlała się poprawnie na dowolnym urządzeniu.

Jeśli Twoja witryna to dynamically served, upewnij się, że pozwalasz Google wykrywać Twoją konfigurację za pomocą nagłówka HTTP Vary -

Vary: User-Agent

Plik Varynagłówek jest ważny, aby poinformować wyszukiwarki, że różne treści będą wyświetlane na komputerach stacjonarnych i urządzeniach mobilnych. Ten nagłówek jest naprawdę ważny, gdy zawartość jest obsługiwana przez dowolny system pamięci podręcznej, taki jakContent Delivery Network i te systemy będą używać tego nagłówka podczas udostępniania treści na różnych urządzeniach.

Na wypadek, gdybyś utrzymywał separate URLs, na przykład, example.com i m.example.com, wtedy możesz poinformować Google, dodając specjalny link rel=alternate tag w wersji na komputer i odwrotnie w następujący sposób.

Desktop page should have following in its header:
&ltlink rel="alternate" media="only screen and (max-width: 640px)"
href="http://m.example.com" >
Mobile page should have following in its header:
<link rel="canonical" href="http://www.example.com" >

Unikaj typowych błędów

Aby zoptymalizować swoją witrynę pod kątem urządzeń mobilnych, upewnij się, że nie popełnia się następujących błędów -

  • Slow Mobile Pages- Sieci komórkowe są wolniejsze niż sieci przewodowe, dlatego ważne jest, aby zwracać uwagę na to, jak szybko ładują się strony mobilne. Jest to krytyczny czynnik rankingowy Google. Użyj narzędzia SEO dla urządzeń mobilnych, aby sprawdzić szybkość swojej strony mobilnej. Google zapewnia wiele dobrych narzędzi, z których możesz skorzystać. Przeglądaj poniższy link -https://www.google.com/webmasters/tools/mobile-friendly/

  • Don't Block CSS and JavaScript- Google zaleca używanie wbudowanych CSS i JavaScript w witrynach przyjaznych dla urządzeń mobilnych, aby można je było pobrać wraz z zawartością. Więc jeśli nie masz zbyt wiele CSS, spróbuj dostosować go w samym tagu; ale jeśli używasz wielu CSS w oddzielnych plikach, spróbuj dołączyć go na dole, co przestanie blokować inne pobierane treści. Ta sama zasada dotyczy JavaScript, który może być przechowywany wewnątrz samej strony lub umieszczony na dole strony. Jeśli możesz uniknąć umieszczania pliku na górze strony, skorzystaj zasync atrybut podczas ich dołączania.

<script async type="text/javascript" src="jquery.js"></script>
  • Mobile Redirects- Ponieważ sieci komórkowe są zwykle wolne, zbyt wiele przekierowań może obniżyć szybkość strony. Jeśli utrzymujesz wiele adresów URL, upewnij się, że wszystkie linki prowadzą do odpowiednich stron. Jeśli masz wiele adresów URL i rozpoznajesz, że użytkownik odwiedza stronę na komputery stacjonarne z urządzenia mobilnego, a masz równoważną stronę mobilną pod innym adresem URL, zamiast wyświetlać błąd 404, przekieruj użytkownika na ten adres URL.

  • Heavy Images- Ciężkie obrazy wydłużają czas wczytywania, jednak nie możemy się ich całkowicie pozbyć, ponieważ są przydatne i skuteczne. Dlatego należy zachować równowagę między tekstem a grubymi obrazami. Użyj dobrego narzędzia, aby zoptymalizować obrazy i zapisać je w niskiej rozdzielczości, aby uniknąć częstego pobierania.

  • Avoid plug-ins and pop-ups- Wtyczki, takie jak Flash i Java, mogą nie być dostępne na urządzeniu mobilnym użytkownika. Zawsze upewnij się, że na stronie mobilnej nie ma żadnych nieodtwarzalnych treści. Unikaj używania wyskakujących okienek na stronach mobilnych, ponieważ zamykanie tych wyskakujących okienek na urządzeniu mobilnym staje się dość niezdarne.

Tworząc stronę mobilną zawsze miej na uwadze, że użytkownik ma ograniczoną przestrzeń do pracy. Dlatego podczas tworzenia tytułów, adresów URL i metaopisów musisz być tak zwięzły, jak to tylko możliwe - oczywiście bez narażania istoty ani jakości informacji.

Użyteczne narzędzia

Oto lista przydatnych narzędzi, których możesz użyć, aby dowiedzieć się, jak przyjazna jest Twoja witryna -

  • Google Webmaster Tools - Skorzystaj z dostępnych narzędzi i technik Google, aby zrozumieć, czego należy używać, a czego unikać podczas projektowania witryn na komputery stacjonarne i urządzenia mobilne.

  • Mobile Emulator - Pozwala zobaczyć, jak witryna wyświetla się na wielu różnych urządzeniach mobilnych.

  • Moz Local - Użyj tego narzędzia, aby upewnić się, że lokalne SEO jest w porządku.

  • Responsive Web Design Testing Tool - Użyj tego narzędzia, aby zobaczyć, jak Twoja responsywna witryna wygląda na różnych urządzeniach mobilnych z różnymi standardowymi rozmiarami ekranu.

  • Screaming Frog - Jest to przydatne narzędzie, które pozwala analizować witrynę i dwukrotnie sprawdzać wszystkie przekierowania.

  • User Agent Switcher - To jest dodatek do przeglądarki Firefox, którego możesz użyć, aby dowiedzieć się, jak wygląda Twoja witryna po uzyskaniu dostępu z innego klienta użytkownika.