Jak upewnić się, że moja witryna jest przyjazna dla urządzeń mobilnych? Lista kontrolna

Opublikowany: 2016-05-18

Jak informowaliśmy w piątek w naszym podsumowaniu wiadomości SEM , analityk trendów Google dla webmasterów, John Mueller, potwierdził, że ostatnia fala zmian w sygnale rankingowym Google dla urządzeń mobilnych właśnie się zakończyła.

Od czasu pierwszej aktualizacji „ Mobilegeddon ”, która zadebiutowała 21 kwietnia 2015 r., przyjazność dla urządzeń mobilnych była ważnym czynnikiem rankingowym w wynikach wyszukiwania Google. W swoim poście na blogu zapowiadającym zmiany algorytmu dwa miesiące wcześniej, Google powiedział, że chce, aby użytkownicy „łatwiej uzyskiwali trafne, wysokiej jakości wyniki wyszukiwania, które są zoptymalizowane pod kątem ich urządzeń [mobilnych]”.

Firma Google od lat potwierdza i potwierdza swoje zaangażowanie w przyjazność dla urządzeń mobilnych,wdrażając etykietę „przyjazną dla urządzeń mobilnych”, aby odróżnić witryny przystosowane do urządzeń mobilnych, wprowadzając zmiany na stronie wyników wyszukiwania dla urządzeń mobilnych, w tym przyjazne dla użytkownika adresy URL i rozszerzone linki do podstron, oraz uruchomienie Accelerated Mobile Pages, aby zapewnić ultraszybkie działanie mobilne.

Teraz, dzięki najnowszej aktualizacji, Google jeszcze bardziej wzmocnił swój sygnał rankingowy przyjazny dla urządzeń mobilnych, co sprawia, że ​​dla webmasterów jeszcze ważniejsze jest posiadanie witryny spełniającej standardy Google.

Mając to na uwadze, w jaki sposób możesz upewnić się, że Twoja witryna jest odpowiednia? Przygotowaliśmy przydatną listę kontrolną czynności, które należy robić (lub których nie należy robić), aby uzyskać od Google możliwie najczystszy rachunek zdrowia mobilnego.

Nie używaj Flasha

Większość przeglądarek mobilnych nie może renderować treści Flash, więc jedną wyraźną zasadą przy tworzeniu witryny przyjaznej dla urządzeń mobilnych jest: nie używaj Flasha. Raport Google dotyczący obsługi urządzeń mobilnych bez wątpienia zaleca korzystanie z „nowoczesnych technologii internetowych” do wyświetlania treści strony, animacji i nawigacji. Auć!

Upewnij się, że widoczny obszar jest ustawiony prawidłowo

Widoczny obszar to rodzaj metatagu , który daje przeglądarce instrukcje dotyczące dostosowywania wymiarów strony i skalowania do różnych szerokości urządzenia. Powinien pojawić się w nagłówku Twojej strony internetowej.

Jeśli nie ma tagu widocznego obszaru, przeglądarki mobilne będą domyślnie renderować stronę na szerokości ekranu komputera. Google ma samouczek, jak ustawić widoczny obszar dla swojej strony i upewnić się, że jest dostępny.

Czego nie robić: ustaw widoczny obszar na stałą szerokość. Niektórzy programiści definiują widoczny obszar na stałą szerokość w pikselach, aby pasował do typowych rozmiarów ekranu mobilnego, ale nadal nie będzie to odpowiednie dla każdego rodzaju urządzenia, więc Google nie ocenia go jako przyjazny dla urządzeń mobilnych.

Jeśli zastosujesz się do instrukcji z samouczka Google i użyjesz wartości widocznego obszaru width=device-width , umożliwi to dopasowanie szerokości Twojej strony do dowolnego urządzenia, z którego korzystają użytkownicy.

Dodanie atrybutu Initial-scale=1 pozwoli również Twojej stronie wypełnić ekran bez względu na to, czy urządzenie jest w orientacji pionowej czy poziomej, dzięki czemu wykorzystasz pełną szerokość ekranu.

Na koniec upewnij się, że zawartość jest dopasowana do widocznego obszaru. Jeśli ustawisz bezwzględne szerokości CSS dla elementów strony, takich jak obrazy i filmy, może to spowodować problem na urządzeniach, które są węższe niż określona przez Ciebie szerokość. Możesz obejść ten problem, używając względnych wartości szerokości, takich jak width: 100% , w swoim CSS.

Użyj dużej czcionki

Jeśli poprawnie skonfigurowałeś swój widoczny obszar, rozmiary czcionek będą skalowane w zależności od urządzenia użytkownika, ale Google dodatkowo przedstawia dodatkowe zalecenia dotyczące czcionki.

Zaleca się używanie podstawowego rozmiaru czcionki 16 pikseli, przy czym wszelkie inne rozmiary czcionek (takie jak mała i duża) są zdefiniowane względem tej linii bazowej. Odstęp w pionie między wierszami powinien być ustawiony na 1.2em.

Staraj się również unikać używania zbyt wielu różnych czcionek i rozmiarów czcionek, co prowadzi do bałaganu i skomplikowanych układów stron.

Rozmieść linki i przyciski

Linki i przyciski, nazywane przez Google również „celami dotknięcia”, trudniej jest nacisnąć na urządzeniu mobilnym niż w przeglądarce na komputerze, ponieważ palce są szersze i generalnie mniej dokładne niż kursor myszy.

Google będzie karać wszystkie strony, na których elementy dotykowe są zbyt małe i blisko siebie, aby można je było dokładnie nacisnąć.

Przeciętny opuszek palca dorosłego ma około 10 mm szerokości, więc Google zaleca minimalny rozmiar celu dotknięcia około 7 mm lub 48 pikseli szerokości – przynajmniej w przypadku najważniejszych celów dotknięcia, takich jak często używane przyciski, linki nawigacyjne, paski wyszukiwania i pola formularzy.

Rzadziej używane cele mogą być mniejsze, ale nadal powinny znajdować się na tyle daleko od siebie, aby użytkownik, który próbuje nacisnąć jeden, nie trafi przypadkowo innego celu. Zalecana przestrzeń wokół mniejszych celów kranowych to co najmniej 5 mm.

Nie używaj pełnoekranowych wyskakujących okienek

Duże lub pełnoekranowe wyskakujące okienka i nakładki, zwane również „reklamami pełnoekranowymi”, takie jak formularz rejestracji na liście mailingowej lub promocja aplikacji, mogą być bardzo uciążliwe na urządzeniu mobilnym.

Chociaż duże, przyciągające uwagę wyskakujące okienka mogą wydawać się dobrym pomysłem z punktu widzenia firmy, Google zdaje sobie sprawę, że zakłócają one przeglądanie witryny na urządzeniach mobilnych i będą karać witryny, które z nich korzystają.

Zamiast pełnoekranowego wyskakującego okienka, Google zaleca użycie banera lub wdrożenie indeksowania aplikacji, co pozwoli na wyświetlanie treści z Twojej aplikacji w wynikach wyszukiwania, co czyni ją bardzo skuteczną metodą promocji.

Przeprowadź kontrolę za pomocą narzędzi Google

Najłatwiejszym sposobem sprawdzenia, czy Twoja witryna osiąga wszystkie właściwe cele pod kątem dostosowania do urządzeń mobilnych, jest skorzystanie z udostępnionych przez Google narzędzi do przeprowadzenia kontroli.

Search Console Google, wcześniej znana jako Narzędzia dla webmasterów, zawiera sekcję „Użyteczność na urządzeniach mobilnych”, w której zdiagnozujesz wszelkie utrzymujące się problemy z Twoją witryną, zwykle jeden z błędów wymienionych powyżej.

Możesz również sprawdzić kondycję poszczególnych stron na urządzeniach mobilnych, wklejając adres URL do testu optymalizacji mobilnej Google. A Google Developers ma sekcję zawierającą listę typowych błędów popełnianych podczas projektowania na urządzenia mobilne, która zawiera dodatkowe informacje na temat takich rzeczy, jak nieodtwarzalna zawartość, wadliwe przekierowania i błędy 404 oraz sposoby ich naprawy.

Potrzeba szybkości

W swoich zaleceniach dotyczących współpracy z programistą w celu stworzenia witryny przyjaznej dla urządzeń mobilnych (jeśli nie jesteś w stanie samodzielnie wprowadzić niezbędnych zmian w witrynie), Google sugeruje poproszenie programisty o „zobowiązanie do szybkości”.

Chociaż Google nie uwzględnia niskiej prędkości ładowania jako jednego z problemów, które „należy naprawić” w zakresie obsługi urządzeń mobilnych, wiemy, że prędkość jest czynnikiem rankingowym, a statystyki pokazują, że niska prędkość ładowania może często powodować, że użytkownicy porzucają strony internetowe.

Jeśli więc chcesz zapewnić użytkownikom jak najlepsze wrażenia, a także zapewnić swojej witrynie dostosowanej do urządzeń mobilnych jak największe szanse na wyższy ranking, rozważ jak największe przyspieszenie jej działania.

Google PageSpeed ​​Insights ma kartę „mobilną”, która da Twojej stronie ocenę szybkości mobilnej na 100, wraz z poradami, jak naprawić elementy, które mogą ją spowalniać.

Zapewni to również Twojej stronie mobilnej ranking na 100 i będzie oznaczał wszelkie problemy z dostosowaniem do urządzeń mobilnych w taki sam sposób, jak inne narzędzia Google.

Istnieją również Accelerated Mobile Pages, ultraszybkie mobilne strony internetowe Google, które działają w nowej wersji HTML. Stworzenie wersji AMP Twojej witryny na urządzenia mobilne to kolejny sposób na upewnienie się, że jest ona szybka i przyjazna dla urządzeń mobilnych, chociaż wielu SEO wciąż powstrzymuje się od wdrożenia AMP z wielu powodów. Jest to opcja, ale nie konieczność posiadania szybkiej i przyjaznej dla Google strony mobilnej.

___
autor: Rebecca Sentance