Wykorzystaj optymalizację mobilną w Klaviyo formularzu rejestracyjnym

Przegląd

Dostosuj swoje formularze Klaviyo do komputerów stacjonarnych i urządzeń mobilnych bez powielania formularzy, pomagając w szybszym publikowaniu i poprawiając wrażenia użytkowników mobilnych.

Optymalizacja pod kątem urządzeń mobilnych pozwala projektować środowiska dla poszczególnych urządzeń, edytując widoki mobilne i stacjonarne obok siebie, a także wybierając, czy zmiany w blokach mają być synchronizowane między urządzeniami, czy pozostać specyficzne dla urządzenia.

Kilka słów na początek

• Niektóre typy bloków nie obsługują rozłączania między urządzeniami. Wyjątki obejmują: Ujawnienie, Spin, aby wygrać, Wizerunek (obsługiwane osobno) i Numer telefonu (zgoda wieloetapowa).

   

Jak to działa

Przełącznik podglądu dwóch urządzeń

Wyświetl podgląd formularza na komputerze i urządzeniu mobilnym obok siebie, aby zobaczyć, jak zmiany dostosowują się na różnych urządzeniach w czasie rzeczywistym. Ogranicza to przełączanie się między aplikacjami i przyspiesza jakość projektowania mobilnego.

Bloki połączone i niepołączone

Domyślnie równoważne bloki na komputerach i urządzeniach mobilnych są połączone: zmiany w jednym widoku są przenoszone do drugiego. Możesz odłączyć bloki, aby wprowadzać zmiany tylko na urządzeniach mobilnych lub komputerach stacjonarnych bez duplikowania formularza.

Możesz odłączyć/połączyć wybrany blok, klikając przycisk odłączenia w oknie lub klikając przycisk odłączenia w panelu bocznym. 

Gdy blok zostanie odłączony:

• Zmiany dotyczą tylko bieżącego widoku urządzenia; blok innego urządzenia nie jest zmieniany.
• Klonowanie niepołączonego bloku tworzy klon tylko w bieżącym widoku urządzenia (klonowanie połączonego bloku powiela go na obu urządzeniach).

Ponowne łączenie bloków:

• Ponowne połączenie tworzy nowy sparowany blok między urządzeniami. Jeśli blok odpowiednika został usunięty, ponowne połączenie tworzy go dla drugiego urządzenia, dzięki czemu oba widoki mają ponownie blok (możesz wtedy usunąć wszelkie duplikaty, których nie potrzebujesz).

teaser na urządzenie

Możesz odłączyć teaser za pośrednictwem panelu bocznego, dzięki czemu zarówno na komputerach stacjonarnych, jak i urządzeniach mobilnych będzie on miał własną stylizację teaser. Ponowne połączenie przywraca widoczność wszystkich urządzeń dla ponownie połączonego teaser.

Krok po kroku

Otwórz podwójny podgląd

1. Otwórz formularz w edytorze.
2. Przełącz się na podgląd za pomocą przełącznika, który pokazuje obok siebie zarówno wersję desktopową, jak i mobilną, aby ocenić układ i odstępy na pierwszy rzut oka.

Odłącz blok w celu edycji na urządzeniu

1. Wybierz blok, który chcesz dostosować na urządzeniu mobilnym.
2. Wybierz opcję Unlink, aby zmiany na urządzeniach mobilnych nie miały wpływu na komputery stacjonarne.
3. Dostosuj swój układ mobilny (np. lokalizację, rozmiary czcionek, odstępy) do czytelności na mniejszych ekranach.
4. Powtórz tę czynność dla innych bloków.

Połącz ponownie, gdy chcesz ponownie udostępnić zachowanie

1. Zaznacz blok i wybierz opcję Przełącz.
2. Jeśli na drugim urządzeniu brakuje odpowiednika, edytor utworzy go automatycznie.
3. Usuń zduplikowane bloki.

Ustaw teaser według urządzenia (opcjonalnie)

1. Otwórz ustawienia teaser i wybierz opcję Unlink.
2. Skonfiguruj zawartość lub widoczność teaser niezależnie dla komputerów stacjonarnych i urządzeń mobilnych.

3. Połącz się ponownie później, jeśli chcesz, aby jedna strona teaser miała zastosowanie do obu urządzeń.

    

Najlepsze praktyki dla formularzy mobilnych

• Nadaj priorytet mniejszym ekranom: używaj większych czcionek, zwięzłych tekstów.

• Zwiększ docelowe dotknięcia i pionowe odstępy, aby przyciski i wejścia były łatwe w użyciu.

• Rozważ wyświetlanie pełnoekranowe na urządzeniach mobilnych, aby zapewnić ostrość i przejrzystość, zwłaszcza na mniejszych urządzeniach.

• Zadbaj o celowość obrazów. Jeśli obraz boczny konkuruje z treścią na małych ekranach, ukryj go lub uprość układ.

   

Ograniczenia i zachowania, o których warto wiedzieć

• Połączony blok to pojedynczy blok z widocznością urządzenia ustawioną zarówno na komputery stacjonarne, jak i urządzenia mobilne. Wszelkie zmiany wprowadzone w obu widokach aktualizują ten jeden udostępniony blok.

• Kiedy odłączasz blok, edytor tworzy drugi blok pod maską i ustawia każdy blok na inne urządzenie (jeden tylko na komputery stacjonarne, jeden tylko na urządzenia mobilne). Od tego momentu edycje nie są synchronizowane między nimi.

• Odłączanie nie jest obsługiwane w przypadku niektórych typów bloków: Ujawnienie, Spin to win, Obraz (obsługiwany oddzielnie w pracy z obrazami pobocznymi) i Numer telefonu (zgoda wieloetapowa).

• Klonowanie zachowuje się inaczej w zależności od stanu połączenia: klony połączonych bloków pojawiają się na obu urządzeniach; klony niepołączonych bloków pojawiają się tylko w widoku bieżącego urządzenia.

• Po ponownym połączeniu wybrany blok staje się źródłem prawdy i jest wyświetlany na obu urządzeniach. Jeśli brakuje odpowiednika, edytor go utworzy; jeśli istnieje wiele wersji, może być konieczne ręczne usunięcie dodatkowych bloków, których nie chcesz zachować.

   

Rezultat

Teraz powinieneś być w stanie utworzyć formularz rejestracyjny zoptymalizowany pod kątem urządzeń mobilnych bez konieczności tworzenia dwóch oddzielnych formularzy. 

Rozwiązywanie problemów

• Nie widzę opcji unlink/relink na bloku:
  Typ bloku może nie obsługiwać odłączania (zobacz wyjątki).

• Moja mobilna zmiana wpłynęła na wersję desktopową (lub odwrotnie):
  Upewnij się, że blok jest odłączony przed edycją wersji specyficznej dla urządzenia.

• Mój link utworzył dodatkowy blok:
  Jest to oczekiwane, jeśli brakowało odpowiednika. Usuń duplikaty, których nie potrzebujesz po ponownym połączeniu.

   

Kolejne kroki

• Pierwsze kroki z formularzem rejestracyjnym.

• Podstawy: projektowanie formularzy.

• Jak testować A/B formularz rejestracyjny.