Użytkownicy telefonów są inni. Mają mniejsze ekrany. Obsługują stronę dotykiem. Mają mniej cierpliwości do tarcia. Nagrania sesji ujawniają problemy typowe dla urządzeń mobilnych, których testy na komputerze nie wychwytują. Pole formularza, które dobrze działa na komputerze, na telefonie może być nie do wypełnienia. Przycisk, który łatwo kliknąć na komputerze, na telefonie może być za mały. Układ, który na komputerze jest czytelny, na telefonie może wprowadzać zamęt. Osoby testujące na komputerze tych problemów nie widzą. Nagrania sesji mobilnych je pokazują. Odwiedzający z telefonu trafia na Twoją stronę. Próbuje nawigować. Menu jest za małe. Dotyka złej pozycji. Gubi się. Nagranie pokazuje jego zmagania. Próbuje wypełnić formularz. Pola są ściśnięte. Klawiatura zasłania stronę. Rezygnuje. Nagranie pokazuje frustrację. Optymalizacja mobilna wymaga mobilnej perspektywy. Programiści optymalizują pod komputery. Użytkownicy telefonów potrzebują optymalizacji mobilnej. Nagrania sesji wypełniają tę lukę. Pokazują użytkowników telefonów tak, jak naprawdę odbierają Twoją stronę.
Ten artykuł wyjaśnia, jak dzięki nagraniom sesji poprawić doświadczenie mobilne i responsywny projekt.
Wykryj problemy z wielkością celów dotyku i celnością stuknięć
Telefon działa na dotyk. Komputer na mysz. Dotyk jest mniej precyzyjny. Przycisk, który wystarcza dla kursora myszy, jest za mały dla palca. Nagrania sesji pokazują problemy z celnością stuknięć w sposób widoczny. Odwiedzający z telefonu próbuje stuknąć przycisk. Chybia. Próbuje ponownie. Trafia w zły przycisk. To zmaganie jest niewidoczne w metrykach. W nagraniach jest oczywiste.
Oglądaj nagrania z telefonów. Czy odwiedzający stukają celnie. Czy często chybiają. Czy trafiają w zamierzony przycisk. Czy w ten obok. Problemy z celnością pokazują, że interfejs jest zbyt gęsty.
Małe przyciski powodują błędy stuknięć. Zbyt wiele przycisków blisko siebie powoduje zamęt. Cele dotyku potrzebują miejsca. Nagranie pokazuje, które elementy utrudniają stukanie. Powiększ je. Odsuń od siebie. Użyteczność na telefonie się poprawi.
Zwróć uwagę na uszkodzony układ mobilny i problemy z czytelnością tekstu
Ekrany telefonów są mniejsze. Treść, która mieści się na komputerze, nie mieści się na telefonie. Tekst robi się malutki. Obrazy się zniekształcają. Układy się rozsypują. Nagrania sesji pokazują problemy z układem mobilnym.
Oglądaj nagrania z telefonów. Czy odwiedzający może przeczytać tekst. Czy powiększa go, żeby czytać. Czy rezygnuje z czytania. Tekst, który wymaga powiększania, jest za mały. Obrazy, które się nie skalują, są problemem. Układy, które się nie dostosowują, są zepsute.
Responsywny projekt powinien dostosowywać układ do rozmiaru ekranu. Jeśli nagrania pokazują problemy z układem, responsywność zawiodła. Napraw układy na telefony. Spraw, by tekst dało się czytać bez powiększania. Skaluj obrazy odpowiednio.
Wykryj problemy z nawigacją mobilną
Nawigacja mobilna różni się od tej na komputerze. Komputer ma stany najechania. Telefon nie może najechać. Komputer ma miejsce na menu. Telefon nie. Nawigacja mobilna musi być inna. Nagrania sesji ujawniają porażki nawigacji mobilnej.
Oglądaj nagrania z telefonów. Czy odwiedzający ma dostęp do nawigacji. Czy rozumie, jak się poruszać. Czy się gubi. Czy klika pozycje nawigacji przez przypadek. Problemy z nawigacją uniemożliwiają poznanie strony.
Menu mobilne często używa ikony hamburgera. Jeśli odwiedzający jej nie widzą lub nie rozumieją, nawigacja zawodzi. Menu mobilne często zasłania treść. Jeśli zasłania ważną treść, odwiedzający się frustrują. Nagranie pokazuje problemy z nawigacją mobilną. Napraw je projektem zaczynającym od telefonu.
Zwróć uwagę na problemy z klawiaturą i wprowadzaniem danych w formularzach na telefonie
Formularze na telefonie są trudne. Klawiatura zasłania pół ekranu. Pola tekstowe są małe. Autouzupełnianie działa niekonsekwentnie. Nagrania sesji pokazują tarcie w formularzach mobilnych.
Oglądaj nagrania interakcji z formularzem na telefonie. Czy klawiatura się pojawia i zasłania formularz. Czy odwiedzający widzi, co wpisuje. Czy ma kłopot z klawiaturą. Czy autouzupełnianie pomaga, czy myli. Nagranie pokazuje użyteczność formularza na telefonie.
Formularze mobilne wymagają innego projektu. Ogranicz liczbę pól. Używaj typów pól dostosowanych do telefonów. Testuj zachowanie klawiatury. Nagranie pokazuje, co działa, a co nie.
Porównaj sesje mobilne i na komputerze, aby wykryć tarcie zależne od urządzenia
Doświadczenia na telefonie i komputerze się różnią. Tarcie może wystąpić na telefonie, a nie na komputerze. Może też wystąpić na komputerze, a nie na telefonie. Porównanie nagrań pokazuje problemy zależne od urządzenia.
Obejrzyj nagranie rezygnacji na telefonie. Potem obejrzyj odpowiednie nagranie z komputera. Czy te same problemy się pojawiają. Czy są inne. Tarcie zależne od urządzenia wymaga poprawek zależnych od urządzenia.
Niektóre problemy są uniwersalne. Niejasna propozycja wartości. Mylna nawigacja. Pojawiają się na obu urządzeniach. Niektóre problemy zależą od urządzenia. Wielkość celów dotyku. Zasłanianie przez klawiaturę. Pojawiają się tylko na telefonie. Ustal, które problemy są które. Napraw oba rodzaje odpowiednio.
Najczęściej zadawane pytania
Jaki jest minimalny zalecany rozmiar celu dotyku na podstawie nagrań sesji mobilnych?
Oglądaj nagrania z telefonów. Jeśli odwiedzający stukają celnie, rozmiar celu jest w porządku. Jeśli często chybiają, cele są za małe. Standard branżowy to minimum 48 na 48 pikseli. Nagrania sesji pokazują jednak, co sprawdza się u Twoich użytkowników. Niektórzy mają większe palce. Inni pewniejszą rękę. Zachowanie w nagraniach pokazuje, jaki rozmiar działa dla Twoich odbiorców. Dzięki kreatorowi stron WEMASY możesz to skonfigurować bezpośrednio na swojej stronie.
Czy testować telefony na prawdziwych urządzeniach, czy wystarczą dane z nagrań sesji mobilnych?
Używaj obu. Nagrania sesji pokazują prawdziwe zachowanie użytkowników na prawdziwych urządzeniach. To bezcenne. Nie da się jednak przetestować każdego urządzenia. Użyj nagrań, by wykryć problemy. Użyj testów na urządzeniach, by zrozumieć zachowanie konkretnych modeli. Nagrania odpowiadają na pytanie, co jest zepsute. Testy na urządzeniach odpowiadają, dlaczego jest zepsute właśnie na tym urządzeniu.
Skąd wiedzieć, czy problemy z wydajnością mobilną wynikają z projektu, czy z prędkości sieci?
Obejrzyj nagrania. Jeśli elementy ładują się wolno, problemem może być sieć. Jeśli jednak elementy są widoczne, a mimo to powodują problemy, winny jest projekt. Nagrywaj zarówno szybkie, jak i wolne połączenia mobilne. Sprawdź, czy problemy z projektem się utrzymują. Problemy z siecią pojawiają się tylko przy wolnych połączeniach. Problemy z projektem pojawiają się wszędzie.
Z jakich urządzeń mobilnych warto oglądać nagrania w pierwszej kolejności?
Sprawdź swoją analitykę. Z jakich urządzeń pochodzi najwięcej ruchu. Najpierw oglądaj nagrania z tych urządzeń. Potem z mniej popularnych. Nie zaniedbuj ich jednak. Urządzenie z małym ruchem może mieć wysoki odsetek rezygnacji. Ustalaj kolejność według wpływu. Duży ruch i wysoka rezygnacja to sprawa krytyczna. Mały ruch z jakąkolwiek rezygnacją też może wymagać poprawy.
Czy nagrania sesji pomogą wybrać między responsywną stroną a aplikacją mobilną?
Częściowo. Nagrania pokazują, czy wersja mobilna strony działa. Jeśli nagrania z telefonów pokazują duże tarcie i słabą konwersję, aplikacja mobilna może pomóc. Aplikacje mają jednak własne tarcie. Nagranie nie przewidzi sukcesu aplikacji. Użyj nagrań, by zrozumieć problemy mobilnej wersji strony. Doprowadź ją do jak najlepszego stanu. Rozważ aplikację, jeśli wersja mobilna nadal wypada słabo.
Jak optymalizować pod urządzenia o różnych rozmiarach ekranu, skoro mam nagrania tylko z popularnych modeli?
Responsywny projekt powinien działać na różnych rozmiarach. Testuj na wielu rozmiarach ekranu podczas tworzenia. Użyj nagrań, by znaleźć tarcie. Optymalizuj na ich podstawie. Potem przetestuj poprawki na innych rozmiarach. Responsywny projekt to jedna strona, która działa na każdym rozmiarze. Nagrania pokazują, co wymaga poprawy. Szerokie testy zapewniają, że poprawka działa także na rozmiarach, których nie nagrano.