Zachowaj ostrożność podczas korzystania z tych popularnych trendów w projektowaniu stron internetowych

Jak większość produktów kulturalnych, projektowanie stron internetowych ma swój własny duch czasu. Każdego roku pojawia się nowy zbiór popularnych elementów konstrukcyjnych, funkcji i trendów. Postawy zmieniają się bardzo szybko, zwłaszcza wraz z szybkim tempem rozwoju nowych technologii.

Niektóre trendy w projektowaniu stron internetowych nie wytrzymują próby czasu. Powinieneś wprowadzić trendy, które utrudniają użyteczność lub zniechęcają odwiedzających witrynę w przeszłości. Projektanci powinni wystrzegać się wykorzystywania następujących trendów, które mogą zrazić do siebie ludzi, z którymi chcą się zaangażować.

Za mało negatywnej przestrzeni

Negatywna przestrzeń odgrywa ważną, ale często niedocenianą rolę w użyteczności. Czasami nazywana białą spacją, jest to przestrzeń wokół i między obrazem lub elementem projektu. Podobnie jak w sztuce, negatywna przestrzeń w web designie ma swoją moc jako element artystyczny. Niestety, niektórzy uważają negatywną przestrzeń za zmarnowaną przestrzeń, ale podobnie jak ściany muzeum potrzebują przestrzeni między dziełami sztuki, tak samo bloki projektowania stron internetowych. Ujemna przestrzeń sprawia, że ​​zawartość Twojej witryny jest czytelna i łatwa do znalezienia.

Projektanci stron internetowych powinni posłuchać rady Coco Chanel, mówiącej, że mniej znaczy więcej – „zanim wyjdziesz z domu, spójrz w lustro i usuń jedno akcesorium”. Projektanci stron internetowych muszą zastanowić się, w jaki sposób elementy CSS i HTML domyślnie nie mają pustego miejsca, zanim zaczną dodawać dodatkowe zasoby.

Połącz ten problem z wysokiej jakości treścią, której potrzebuje każda dobra strona internetowa, a problem jest oczywisty – zbyt bogata strona internetowa ze zbyt wieloma miejscami do przejrzenia. Gdy wokół każdego elementu jest dużo miejsca, użytkownicy zobaczą Twoje treści, a Twoje CTA będą się wyróżniać.

Istnieje kilka łatwych poprawek dla zatłoczonej witryny. Najpierw użyj nieskończonej pojemności przewijania pionowego. Gdy górna nawigacja jest przejrzysta, umieszczenie innych elementów drugorzędnych pod zakładką jest całkowicie akceptowalne. Gdy początkowo nawigacja po witrynie jest łatwa, użytkownicy nie będą mieli nic przeciwko szukaniu dalszych informacji. Po drugie, (o typografii porozmawiamy później) uważaj na rozmiary czcionek. Zbyt duży zajmuje miejsce i może czytać agresywnie, jak e-mail od szefa wielkimi literami. To równowaga – znajdź czcionkę, która nie przytłacza, ale nadal przyciąga uwagę.

Hamburgerowe menu

Jednym z najważniejszych trendów w projektowaniu stron internetowych ostatnich lat jest menu hamburgerów. Ten trend wynikał po części z gwałtownego wzrostu liczby użytkowników korzystających ze stron internetowych na urządzeniach mobilnych. Celem menu hamburgera jest ukrycie nawigacji w menu, aby nie zaśmiecało głównej przestrzeni strony. Użytkownicy rozpoznają ikony i zazwyczaj nie mają problemu ze znalezieniem pełnego menu. To dobry pomysł – jeśli ludzie wiedzą, czego chcą, zanim tam dotrą.

Problem pojawia się, gdy witryna jest uzależniona od organicznego odkrywania treści przez użytkownika. Jak mówi Łukasz Wróbleski „oczywiście zawsze wygrywa”. I to jest oczywiste – większa widoczność oznacza większe użytkowanie. Rozważmy przykład Facebooka. Kiedy portal społecznościowy przeniósł się z górnego menu hamburgerów do dolnego paska kart w aplikacji na iOS, zaangażowanie użytkowników wzrosło, podobnie jak wzrost zadowolenia użytkowników, wyższe przychody i szybkość (i jej postrzeganie).

Ograniczanie ilości innych treści, które użytkownicy naturalnie odkryją, jest niebezpieczną grą. Ukrywając kategorie, odwiedzający nie są od razu narażeni na opcje.

Menu hamburgerów jest szczególnie szkodliwe dla witryn eCommerce, w których firmy są uzależnione od kontaktu użytkowników z towarami. Kiedy użytkownicy muszą otworzyć menu, mogą przegapić najbardziej oczywiste i ważne aspekty Twojej firmy. A jeśli Twoja firma jest uzależniona od tego, czy czytelnicy oglądają kanał RSS, należy całkowicie unikać menu hamburgerów; wpływają niekorzystnie na witryny z wiadomościami, które polegają na tym, że czytelnicy mogą zobaczyć pokrewne tematy i inne aktualne nagłówki.

Karuzele na stronie głównej

Karuzele na pierwszej stronie są teraz wszechobecne i można je zobaczyć w witrynach, od stron małych firm po duże korporacje. Projektantów przyciągają karuzele, ponieważ tworzą ekonomię wizualną, dostarczając wiele informacji za pomocą jednej funkcji.

Jeśli Twoja firma nadal próbuje wypromować swoją nazwę, używaj karuzeli z rozwagą. Karuzele utrudniają ludziom znalezienie Twojej strony i mogą negatywnie wpłynąć na optymalizację wyszukiwarek (SEO), ponieważ zazwyczaj oznaczają mniej treści w treści strony. Mniej tekstu na stronie oznacza mniej metainformacji, które Google może znaleźć.

Istnieją jednak obejścia, takie jak dodanie tekstu do samej strony, ale to podważa sens korzystania z karuzeli dla ekonomii wizualnej. Karuzele mogą również powodować poważne problemy z ułatwieniami dostępu w witrynie. Znane są z tego, że spowalniają czas ładowania i często używają JavaScript, co może powodować problemy z wydajnością.

Karuzele nie tylko sprawiają, że witryna jest mniej dostępna, ale nie angażują skutecznie odwiedzających, którzy mają do niej dostęp. Badanie z 2013 r. wykazało, że około 1% odwiedzających witrynę kliknęło karuzelę, w zależności od tego, czy karuzela była przekierowywana automatycznie, czy ręcznie.

A jeśli weźmiemy pod uwagę rady Wróblewskiego dotyczące menu hamburgerowych, to z karuzelami jest podobnie – nie są one oczywiste. W powyższym badaniu 83% z 1%, którzy kliknęli, kliknęło pierwszy obraz. Co to oznacza dla czterech innych obrazów, którymi masz nadzieję przyciągnąć użytkowników? Nie osiągają żadnego przebiegu i niewiele robią, aby promować zaangażowanie.

Wróblewski wykorzystuje projekt karuzeli PJ McCormicka na Amazon jako przykład, który faktycznie działa. Obrazy są podzielone na segmenty, a gdy użytkownik najedzie kursorem na określoną sekcję, staje się obrazem w karuzeli, co oznacza, że ​​użytkownicy mogą kliknąć tam, aby znaleźć to, czego szukają.

Wyskakujące okienka

Rozwijane menu mogą być skomplikowane w obsłudze nawet przez najbardziej wykwalifikowanych użytkowników, dodać tę złożoność do małego ekranu i jest to koszmar dla nawigacji. Z drugiej strony elementy sterujące menu wyskakującego oferują zawartą listę opcji menu, które można łatwo przewijać niezależnie od ostrości lub tempa użytkownika. iPhone firmy Apple jest tego dobrym przykładem – przeciągnij, przesuń lub szturchnij – duży cel i opcje wybaczania ułatwiają sterowanie.

Dobrze zrobione wyskakujące okienka świetnie nadają się do złożonych danych wejściowych – danych wejściowych dotyczących dat, wzrostu, wagi – i znacznie usprawniają proces.

Na przykład zamiast trzech opcji wprowadzania daty – dnia, miesiąca i roku – jedno pole daty może otworzyć zestaw wyskakujących menu, które umożliwiają użytkownikom przewijanie trzech list jednocześnie w celu wprowadzenia prawidłowej daty. Ta prosta poprawka może skrócić czas wprowadzania danych i zmniejszyć niecierpliwość użytkowników.

Łączenie nieskończonego przewijania z zawartością stopki

Nieskończone przewijanie może być przydatnym narzędziem do projektowania. Niekończące się i bezproblemowe ładowanie treści może zapewnić satysfakcjonujące wrażenia użytkownika. Witryny takie jak Pinterest wykorzystują nieskończone przewijanie do doskonałego efektu i są częściowo odpowiedzialne za utrzymanie tego trendu. Chociaż przewijanie w pionie odniosło wielki sukces w przypadku niektórych aplikacji, przewijanie w poziomie nadal wprawia wielu użytkowników w zakłopotanie. Często nawet nie zdają sobie sprawy, że jest to opcja. Jeśli treść wydaje się kończyć, oni również zostaną zakłopotani.

Nieskończone przewijanie staje się problemem, gdy witryna ma również stopkę z treścią, do której użytkownicy mogą chcieć uzyskać dostęp. Użytkownicy będą przewijać w dół iw dół i nie będą mogli nadrobić zaległości w stopce. Doświadczeni użytkownicy mobilni zrozumieją to, ale jeśli to ich frustruje, mogą nie próbować. Nawigacja powinna być nie tylko oczywista, ale także łatwa.

Wolno ładujące się ekrany

Powodem numer jeden – przez osuwisko – użytkownicy opuszczają witrynę, jest powolny czas ładowania. W ankietach około połowa użytkowników twierdzi, że nie będzie czekać dłużej niż 10 sekund na załadowanie strony. Ponieważ przyzwyczailiśmy się do szybszych połączeń i urządzeń internetowych, ludzie oczekują, że strony ładują się niemal natychmiast. Im dłużej trwa ładowanie ekranu, tym większe prawdopodobieństwo, że użytkownik odejdzie.

Użytkownicy nie powinni ponosić za to winy, technologia sprawiła, że ​​nasze doświadczenia zostały wystarczająco uproszczone, że stało się to oczekiwaniem. Kiedy równoważysz skomplikowaną zawartość, która może spowolnić czas ładowania, zastanów się, czy będzie miało znaczenie, jeśli nikt jej nie zobaczy. Użytkownicy mobilni nie siedzą i nie piją latte podczas sprawdzania Twojej witryny — są w ruchu i oczekują, że korzystanie z urządzeń mobilnych będzie równie szybkie.

Niepotrzebnie skomplikowana typografia

Różnorodność dostępnych obecnie krojów pisma sprawia, że ​​projektanci stron internetowych mogą pokusić się o użycie wielu czcionek na jednej stronie. Istnieje często cytowana wskazówka typograficzna, że ​​nigdy nie należy używać więcej niż dwóch lub trzech czcionek w jednym dokumencie.

Chociaż mogą zaistnieć okoliczności, które uzasadniają stosowanie wielu czcionek, zwykle lepiej jest skupić się na czystym, jasnym przekazywaniu informacji. Wróblewski przedstawia swoje notatki na temat najlepszych praktyk typograficznych Tima Browna. Jednym z najważniejszych elementów typografii jest równowaga – równowaga w rozmiarze, w prowadzeniu, a w pewnym stopniu poprawia czytelność i estetykę. Jaki sens ma czcionka, jeśli nie należy jej czytać? Zaciemnianie przejrzystości projektu jest sprzeczne z intuicją i nie zwiększy czytelnictwa.

Wybranie jednej lub dwóch czcionek tworzy jednolity wygląd i pomaga użytkownikom lepiej zidentyfikować markę. Pamiętaj, że celem jest zaangażowanie użytkowników. Wiele czcionek w zbyt wielu rozmiarach utrudnia wygodne czytanie witryny. Jeśli tekst jest nieczytelny, nikt nie pozostanie na stronie przez dłuższy czas.

Elementy pływające

Elementy pływające mogą być świetnym sposobem na przyciągnięcie uwagi użytkownika, ale jeśli zostaną ustawione w niewłaściwym czasie, mogą zrazić użytkowników, blokując część strony i odwracając ich uwagę od tego, co chcą zobaczyć. To wszystko, ale gwarantuje, że nie będą wchodzić w interakcję z witryną. Elementy pływające są szczególnie frustrujące dla użytkowników mobilnych, którzy próbują uzyskać dostęp do witryny na mniejszym ekranie.

Ponadto elementy pływające często nie działają zgodnie z przeznaczeniem, otwierając się nawet po zamknięciu i unosząc się nad ważnymi funkcjami strony. Im bardziej skomplikowane staje się doświadczenie użytkownika, tym mniejsze prawdopodobieństwo, że będzie on nadal korzystał z witryny.

Przewijanie paralaksy

Przewijanie paralaksy niekoniecznie jest złym wyborem projektowym i zostało wykorzystane z doskonałym skutkiem w wielu kampaniach marketingowych. Oferuje nową możliwość wyróżnienia się witryn i ostatnio zyskała na popularności.

Ma pewne wady. Podobnie jak w przypadku karuzeli, może to negatywnie wpłynąć na SEO, ponieważ wyszukiwarki mają mniej treści do indeksowania. Przewijanie paralaksy również nie jest dobrym wyborem do projektowania witryn, które powinny być dostępne dla urządzeń mobilnych. Ponieważ opiera się na JavaScript i wielu grafikach, może powodować bardzo powolne ładowanie strony, zwiększając prawdopodobieństwo, że użytkownik zniecierpliwi się i wyjdzie przed załadowaniem strony.

Jak najlepiej wykorzystaj trendy

Chociaż istnieją zdecydowanie odpowiednie aplikacje dla wszystkich tych trendów, projektanci stron internetowych powinni dokładnie przemyśleć, zanim zdecydują się z nich skorzystać. Najlepszą zasadą dla każdego projektanta jest przywiązywanie większej wagi do funkcjonalności i doświadczenia użytkownika niż do modnych trendów. Przy każdym projekcie pamiętaj o radach Łukasza Wróblewskiego i bądź oczywisty. Bez względu na to, jak dobra jest treść, jeśli jest ukryta, jest bezużyteczna.