Szykujcie się na “atak” stron mobilnych!
Przeczytasz w około: 3 minuty
Spis treści:
Wszyscy widzą, patrząc na różne promocje w marketach i oferty operatorów, że zalewa nas od dłuższego czasu fala urządzeń mobilnych. Zarówno smartphone’ów jak i tabletów. I to dzięki nim mamy niesamowicie ułatwiony dostęp do sieci.
Jeszcze jakiś czas temu przeglądanie stron w telefonie było naprawdę koniecznością i nie kojarzyło się z czymś przyjemnym. Teraz niejednokrotnie nie chce nam się podchodzić do komputera i sprawdzamy informacje czy po prostu przeglądamy strony właśnie za pomocą urządzenia mobilnego.
Widzimy przez to rosnący trend odejścia od komputerów PC czy Mac na poczet, też telewizorów z wbudowaną kartą sieciową, ale głównie tabletów i coraz większych(?) telefonów, czyt. smartphone’ów.
Dlatego też, nie ma się co dziwić, że Google postanowiło położyć większy nacisk na wersje mobilne stron internetowych. Gigant zapowiedział, że posiadanie wersji mobilnej będzie liczone jako kolejny czynnik rankingowy co w skrócie mówi nam, że strony te będą faworyzowane. Strony główne (pełne), które mają odpowiedniki.
Jak zrobić dobrze stronę mobilną?
Pierwsze co nasuwa nam się to to, że ekrany urządzeń mobilnych są mniejsze (głównie chodzi o szerokość) więc wystarczy stworzyć odmianę strony, która jest węższa. Do tego mniej obrazków i tyle. I tak i nie. Jest kilka zasad o których należy pamiętać:
- szerokość strony nie powinna być stała tylko dopasowująca się do rozdzielczości urządzenia. Tutaj wkraczamy na temat responsywności, która mówi właśnie o automatycznym dopasowaniu strony do każdego typu urządzenia
- duże i ciężke grafiki nie pasują do strony mobilnej, ale również filmiki wstawiane na stronę, które stwarzają problemy z otwarciem – pamiętajmy, że mamy różne urządzenia o różnych mocach
- przekierowanie na stronę o innym rozmiarze (na stronę mobilną) powinno być niezauważalne dla użytkownika. Wszystko ma się wykonywać szybko i bez przerw czy problemów
- każda podstrona pełnej wersji strony powinna mieć mobilny odpowiednik. Wdrożone powinno byc przekierowanie 1:1 odpowiednich wersji. Nie możemy sobie pozwolić na taki system przekierowań:
Najczęstsze błędy
Każdy popełnia błędy. Błędy w świecie stron mobilnych są tym częstsze i łatwiejsze do popełnienia, że urządzeń różnego typu jest cała masa – różne wielkości ekranów, różne moce… można tak dalej.
Jednakże jesteśmy w stanie wytypować najczęściej popełniane błędy przy tworzeniu takich stron:
- zbyt ciężki, rozpraszający użytkownika layout strony
- zbyt duże, spowalniające witrynę obrazki
- nie dające się odtworzyć filmy
Użyteczność strony mobilnej (UX)
User eXperience (UX) stron mobilnych to temat na cały wykład i osobne publikacje, ale o kilku prostych, a często zapominanych, należy pamiętać. Zwróćmy uwagę, że w przeważającej większości już teraz mamy do czynienia z urządzeniami dotykowymi, więc:
- twórzmy łatwo dostępne przyciski
- wyróżniajmy najważniejsze rzeczy na stronie – reszta na bok (po co rozpraszać użytkownika?)
- pamiętajmy i prostocie i stonowanej kolorystyce
Trochę przykładów
Świat stron opiera się aktualnie na różnego rodzaju systemach zarządzania treścią (CMS).
Elegant Themes – twórca szablonów premium dla systemu Wordpess – każdy proponowany produkt optymalizuje do wersji mobilnych.
Ale nowoczesne strony to niejednokrotnie 100%-owa unikalność i projekty stworzone od zera – niewielkie wizytówki czy proste strony. Sposób na pomoc urządzeniu na wykrycie strony mobilnej:
Zaraz bo znaczniku <html> przed załadowaniem wszystkich dyrektyw i reszty kodu, sprawdzamy rozdzielczość urządzenia. Jeżeli szerokość jest niż np. 700 px kierujemy użytkownika na wersję mobilną. Przykład kodu:
<script type="text/javascript">
if (screen.width <= 700)
{
window.location = "https://m.example.com";
}
</script>
Potrzebujesz wsparcia w SEO?
Napisz do nas
Wpis został przygotowany przez zespół redakcyjny złożony z załogi Rocket Media. To była owocna praca załogowa!
Napisz do nas
Zadzwoń do nas