Lekcje z mobilnego projektowania stron internetowych
Rozwój mobilny to wściekłość, a branża interaktywna jest w wielkim zamieszaniu, ponieważ na rynek trafiają niezliczone tablety i smartfony.
Rozwój aplikacji mobilnych przyciąga największą uwagę, podczas gdy sieć mobilna po cichu skrada się. Jednak sieć mobilna robi postępy każdego dnia, ponieważ coraz więcej programistów uruchamia interfejsy zoptymalizowane pod kątem urządzeń przenośnych.
Wspaniałą cechą mobilnej sieci jest to, że jest ona zbudowana w oparciu o te same narzędzia, które są używane w tradycyjnym projektowaniu i tworzeniu stron internetowych.
Dzięki temu jest znacznie bardziej dostępny niż tworzenie aplikacji. Ponadto wielu użytkowników będzie chciało odwiedzić witrynę firmy w podróży, bez konieczności korzystania z pełnej aplikacji.
Budowanie stron zoptymalizowanych pod kątem urządzeń mobilnych jest tak podobne, a jednocześnie tak odmienne niż projektowanie na komputery. Pewne czynniki nabierają znacznie bardziej znaczącej roli. Na przykład odmiany wielkości ekranu, zasięg uwagi użytkownika i problemy z użytecznością są bardziej krytyczne niż kiedykolwiek wcześniej.
Te same problemy są zawsze obecne na pulpicie, ale czasami łatwiej je przeoczyć. Poniżej przedstawiamy kilka lekcji, które można wyciągnąć z optymalizacji, która ma miejsce w sieci mobilnej. Lekcje mogą bezpośrednio informować o tym, jak projektujemy i jak myślimy o tradycyjnym projektowaniu stron internetowych i architekturze strony.
Uproszczona nawigacja na stronach mobilnych
Jedną z pierwszych rzeczy, która staje się oczywista, gdy przekopujemy się na witryny mobilne, jest ekstremalne uproszczenie nawigacji. Nawigacja staje się nie tylko bardzo widoczna i ma kluczowe znaczenie na stronie mobilnej, ale jest również często przycinana, aby skupić się tylko na najbardziej krytycznych elementach.
Uważam, że to niesamowite, jak można osiągnąć najwyższy poziom nawigacji do dwóch lub czterech elementów w większości witryn mobilnych. Oczywiście zdaję sobie sprawę, że treść na stronie mobilnej jest często zoptymalizowana pod kątem zamierzonej publiczności. Na przykład, Kościół Tabernakulum Prawdy ma sześć opcji w swojej głównej nawigacji, z których tylko jedna wprowadziła się do nawigacji dla wersja mobilna ; a ta, która go stworzyła ("Kontakt"), jest punktem centralnym całej strony głównej.
Treść, która nie dotarła do wersji mobilnej, jest oczywiście nadal aktualna. Interfejs mobilny ma za zadanie złapać ludzi, którzy próbują znaleźć kościół lub sprawdzić czas obsługi lub po prostu skontaktować się z nimi. Są to najbardziej prawdopodobne cele mobilnego surfera. Ci, którzy trafiają na pełną stronę na komputerze stacjonarnym, prawdopodobnie będą chcieli tych rzeczy, ponieważ chcą zbadać kościół, aby zobaczyć, czy jest to miejsce, do którego chcieliby odwiedzić.
Jaka lekcja jest do nauczenia? Czy te dwa interfejsy nie są skierowane do zupełnie różnych odbiorców i mają zupełnie inne cele? Być może, ale możemy się wiele nauczyć od skrajnego ogniskowania interfejsu mobilnego. Zwróć uwagę, w jaki sposób wszystko dotyczy działań, które możesz podjąć? Kościół wyeliminował wszystkie elementy nawigacyjne, które czują się jak pudełka do sprawdzenia.
Ciekawym elementem jest opcja nawigacji "O mnie" na pełnej stronie internetowej. Strona mobilna może być zoptymalizowana dla ludzi w drodze, ale nie ma powodu, aby zakładać, że nie byliby zainteresowani czytaniem o kościele i jego przekonaniach. Ktoś mógł wspomnieć o męczącym kościele, co skłoniło cię do sprawdzenia go na telefonie.
Dlatego opcja nawigacji dla tego elementu powinna zostać zmieniona. Co jeśli zamiast tego komunikuje się coś w stylu "Co powinieneś o nas wiedzieć"? Choć trochę długi, odzwierciedla bardziej pomocne podejście. Ogólne wiadro "O mnie" wydaje się być miejscem przechowywania wszystkich informacji, których nikt nie czyta. "Przewodnik dla odwiedzających nasz kościół" jest o wiele bardziej przydatny i ukierunkowany.
Prostota i skupienie interfejsu mobilnego pokazuje, że wszystko musi mieć cel, aby zdobyć slot na stronie internetowej. Gdyby tak było w przypadku pełnej strony internetowej, bylibyśmy mniej skłonni do wypełnienia go pozornie ważnymi treściami i bardziej skłonni do upewnienia się, że wszystko ma jasną funkcję.
Odzwierciedla to mentalność bardzo ukierunkowaną na zadania. Każda opcja zachęca użytkownika do podjęcia aktywnego kroku. To tak, jakby każda opcja pasywna została wyczyszczona i zredukowana do czynności, które można podjąć w witrynie mobilnej. To prowadzi nas do następnej lekcji: bądź wyjątkowo zorientowany na zadanie.
Witryny mobilne są zorientowane na zadania
Z nastawieniem na zadania, przemyślmy całą witrynę. Choć strona główna jest pięknie zaprojektowana, wezwanie do działania jest o wiele mniej oczywiste. Treść jest pełna fragmentów informacji, które czekają, aż zdecydujesz się zainteresować.
Na przykład duży baner podświetlający nadchodzące wydarzenie nie wywoła mi jakiegoś działania; bardzo pasywny. Dzięki mentalności zorientowanej na zadania możemy znacznie poprawić wezwanie do działania "Czytaj więcej". Może to być tak proste, jak sprawienie, by wezwanie do działania było znacznie bardziej widoczne; na przykład duży przycisk w kontrastującym kolorze pomarańczowym. Ponadto połączenie można zmienić na "Dowiedz się więcej i zarejestruj się".
Innym przykładem jest wiadomość powitalna. Doceniam intencję i komunikat, o którym tu mowa. Wiadomość pokazuje, że za witryną znajdują się prawdziwi ludzie i stara się, aby strona była osobista. Ale ponownie przeanalizujmy to z mentalnością zorientowaną na zadania. Dobrym przykładem takiego wstępu byłoby wyraźne wezwanie do działania zachęcające odwiedzających do podjęcia kolejnego kroku. W końcu jedyni ludzie, którzy będą to czytać, to nowoprzybyli. Obecni członkowie przejdą obok tego do takich rzeczy jak kalendarz wydarzeń. Dlatego zaproponuj punkt konwersji dla użytkowników, np. "Zadaj nam trudne pytanie" lub "Czego możesz się spodziewać po odwiedzeniu".
Natomiast pole "gość specjalny" jest fantastyczne. Odnosi się do kluczowych problemów i skłania ludzi do głębszego kopania. Zastanawiam się tylko, czy może to być bardziej widoczny element strony. Znowu członkowie dotrą do miejsca, do którego muszą się udać; więc skupienie się na tych, którzy są nowi na stronie internetowej i kościele, przeszedłoby długą drogę, by zmaksymalizować szansę.
Wiem, że tak naprawdę biję tę stronę, ale nie dlatego, że jej nie lubię, ani że nie spełnia ona swojej funkcji. Moim celem jest tylko rzucić wyzwanie naszemu myśleniu i naszym z góry przyjętym wyobrażeniom o tym, jak powinna wyglądać i robić strona internetowa. Właściwie pochwalam ten kościół za stworzenie pięknej i funkcjonalnej strony internetowej z mobilnym rozszerzeniem do startu!
Witryny mobilne radykalnie zmniejszają ich zawartość
Kolejną oczywistą lekcją związaną z paradowaniem w dół nawigacji jest to, że strony mobilne niezmiennie zmniejszają ich zawartość. Nie tylko liczba opcji sprowadza się do podstawowej funkcjonalności i celu witryny, ale także znacznie się zmniejsza.
W niektórych przypadkach większość kopii jest całkowicie wyeliminowana! Nasuwa się pytanie, czy ta treść jest niezbędna na pełnej stronie internetowej, jeśli wersja mobilna działa dobrze bez niej? Divi Aruba jest świetnym tego przykładem. Powabny marketingowy tekst, położony na wierzchu zdjęcia, może wydawać się elementem obowiązkowym dla strony głównej, ale został nukowany na mikro witryna mobilna .
W wersji mobilnej logo jest umieszczane na tym samym obrazie, a mimo to nadal przekazuje dokładnie tę samą wiadomość: jeśli chcesz pojechać w takie miejsce, czytaj dalej. Dlaczego nie wykorzystać tego prominentnego miejsca, aby przyciągnąć ludzi do pożądanego działania? Z pewnością projektanci wiedzą, co jest najważniejszym elementem do konwersji odwiedzających klientów. Wykorzystaj te informacje do działania i prowadź tam ludzi z wyraźnym wezwaniem do działania zamiast puszystego marketingu.
Wszystkie dobre rzeczy, sans puch
To prowadzi nas do następnej lekcji: stracić puch. Następnym przykładem jest pozytywna demonstracja tego. Podróż Tex to strona internetowa informacji turystycznej dla stanu Teksas. Ma jasno określony cel i odbiorców. Na szczęście projektanci w pełni przyjęli myśl o puszystym umyśle.
Nie tylko mini witryna mobilna skup się całkowicie na danym temacie i kluczowych artykułach, ale tak samo działa cała witryna! Cóż za ulga, że nie widzę prawie żadnego puchu. Dodanie czegoś ponurego jak historia Teksasu byłoby zbyt kuszące. Gdyby ludzie chcieli lekcji historii, nie przyjdą na tę stronę. Będziesz trudny do znalezienia treści, które nie są związane z pojedynczym celem tej witryny.
Nabierz nawyku kwestionowania wszystkiego. Jest to jedyny sposób, aby naprawdę ugotować stronę internetową do jej najważniejszych elementów, co dokładnie dzieje się na dobrej stronie mobilnej. Dokonuje się trudnych wyborów, a poza tym wycina się cenne treści w celu usprawnienia strony internetowej. Zadzwoń do puchu za to, co to jest i nuke to!
Branding jest królem w sieci mobilnej
Chodzi mi o kreatywność w sieci. W rzeczywistości wiele największych zmian w branży pojawiło się w wyniku odmowy utrzymania status quo. Ale jest czas i miejsce na wszystko. Tak wielu projektantów używa ich zadań jako pretekstu do wypuszczenia swoich kreatywnych soków, nie tylko w celu zrobienia czegoś kreatywnego. Przekształca to stronę w projekt dla projektanta, a nie dla klienta i jego potrzeb. Jest to jedna rzecz, o której telefon komórkowy ostrzega raczej odważnie.
Branding jest niesamowicie spójny w sieci mobilnej, a jedną z najbardziej spójnych części jest umieszczenie logo. W witrynach mobilnych nie znajdziesz żadnych szalonych logo na dole ze stałymi stopkami. Funkcjonalność to król, a loga zawsze pojawiają się u góry. Czy możesz sobie wyobrazić uderzenie w mobilną stronę internetową i nie zobaczenie logo od razu? Jest to jednak powszechne na wielu pełnych stronach internetowych.
Oto kilka stron internetowych, które choć są minimalne i pozbawione oszałamiającego stylu, są bogate w branding, którego nie można przegapić.
Ta lekcja może mieć ogromny wpływ na to, w jaki sposób podchodzisz do swojej pracy i na fundamentalną wartość, jaką dajesz swoim klientom. Dla każdego projektanta, który dowiaduje się, że potrzeby klienta powinny być ich pełnym celem dla projektu, jest jeszcze jeden, który chce pokazać światu, jak kreatywne i oryginalne są.
Podobnie jak każdy inny zaangażowany w tworzenie strony internetowej, projektant stron internetowych powinien być zdecydowany w obsłudze klienta, pomagając w jego biznesie i poprawiając wyniki finansowe. Przy każdym elemencie, który umieścisz na mobilnej stronie internetowej, bierze pod uwagę jego rolę i korzyści, jakie przyniesie. Zastosuj tę mentalność do wszystkiego, co robisz, a wkrótce znajdziesz silnego sprzymierzeńca w swoim kliencie.
Im bardziej uwzględniamy potrzeby klienta i zrobimy wszystko, co w naszej mocy, aby wnieść wartość na ich stronie internetowej, tym bardziej dostrzegamy zasadniczą zmianę w naszej pracy. Przejdziemy od budowania "fajnych rzeczy" do patrzenia na wszystko z perspektywy klienta. Czy ta funkcja zwiększa zyski? W jaki sposób można zmienić projekt, aby poprawić jego działalność? Jeśli produktem ubocznym twojej pracy jest więcej pieniędzy dla klienta, wtedy znajdziesz wszędzie szansę.
Strony internetowe pozbawione sztuczek
Jednym z największych osiągnięć sieci mobilnej jest całkowity brak gadżetów. Aby być uczciwym, w Internecie jest czas i miejsce na sztuczki. W rzeczywistości dedykuję im całe części moich książek. Ale brak gadżetów na stronach mobilnych pokazuje, że te pozornie świetne pomysły nie służą żadnemu celowi.
Wszystko, co trafia na stronę mobilną, powinno przejść przez kilka filtrów. Czy treść jest istotna i całkowicie przydatna? Czy treść jest krytyczna i czy służy najważniejszemu celowi witryny? Czy strona jest łatwa w użyciu i zrozumiała? Czy nawigacja jest niekonwencjonalna? Jeśli tak, czy ma to kluczowe znaczenie dla funkcji strony internetowej? Odpowiedź może brzmieć tak, ale częściej niż nie, będzie decydującym nie.
Niektóre sztuczki, które są zauważalnie nieobecne w rozwoju mobilnym to ekrany powitalne, niezwykła nawigacja, bezsensowne animacje i interaktywność, wbudowane regiony przewijania, dziwne układy i układy o stałej szerokości. Wydajność mobilnej sieci jest niesamowita.
Wniosek
Jak widzisz, mamy wiele lekcji do nauczenia się z internetu mobilnego; w szczególności jego zdolność do ujawniania niepotrzebnych elementów strony internetowej. Podobnie jak w przypadku wielu rzeczy w życiu, niewielka zmiana perspektywy często otwiera nasze oczy na prawdziwą wartość rzeczy, które od dawna uważaliśmy za oczywiste.
Nie sugeruję, że straciliśmy z oczu cel sieci. Proponuję raczej, abyśmy przyjęli o wiele bardziej strategiczną mentalność.
Patrick McNeil jest niezależnym pisarzem, programistą i projektantem. W szczególności uwielbia pisać o projektowaniu stron internetowych, szkolić ludzi w zakresie tworzenia stron internetowych i budowania stron internetowych. Najnowszy projekt Patricka to Podręcznik projektanta WWW ; zawiera wiele tematów podobnych do tego artykułu. Możesz dowiedzieć się więcej na ten temat TheWebDesignersIdeaBook.com . Śledź Patricka na Twitterze @designmeltdown .
Ten post został dostarczony przez DudaMobile, a witryna mobilna firma tworząca.
Jakie aspekty mobilnego projektu próbujesz przetłumaczyć na pulpit? Czy widzisz prostotę i szybkość w sieci mobilnej?