Ciekawostki branżowe, Eura7, Najnowsze, WWW

Co dziś przyciąga na stronie? Podstawy dobrego web designu

Zasada jest prosta – projektując stronę internetową, wczuwamy się w rolę użytkownika, który widzi ją pierwszy raz w życiu, a nie zna od podszewki. Wbrew pozorom nie musi to oznaczać budowania zupełnie nowych rozwiązań. Warto pamiętać o zasadzie psychologicznej dotyczącej podobieństw i rzeczy już znanych z innych źródeł. Stosowanie popularnych i szeroko znanych standardów jest bowiem sprawdzonym sposobem na stworzenie strony, na której użytkownik z łatwością się odnajdzie, ponieważ na podstawie utartych schematów już wie, jak się po niej poruszać.

Myśląc o grupie docelowej, poznając jej potrzeby i starając się je zrealizować na naszej witrynie, jesteśmy w stanie zyskać zaufanie i wywołać pozytywne konotacje całej marki. Na co zatem szczególnie zwrócić uwagę podczas procesu planowania wyglądu strony?

Przede wszystkim na stworzenie intuicyjnego planu-mapy strony. Na takim szkielecie jesteśmy w stanie zbudować równie dobrą resztę. Strona, której struktura będzie przemyślana, płynnie poprowadzi użytkownika do celu. Wbrew pozorom rozpracowanie architektury informacji nie jest takie proste – trzeba przewidzieć, czego użytkownik szuka, jak wygląda podróż typowego konsumenta po danej stronie, jak mu tę drogę ułatwić i jak zgrabnie wkomponować w nią dodatkową zawartość, czyli nasze inne propozycje, treści reklamowe itd.

Hierarchizacja informacji ściśle wiąże się z tym, jak będzie wyglądała nawigacja strony. Powinna być prosta, zrozumiała, intuicyjna i łatwa w użytkowaniu. Bardzo łatwo ten porządek zakłócić, na przykład zbyt wcześnie “wyskakując” z perswazyjnym komunikatem czy danymi kontaktowymi, które zbijają użytkownika z tropu i niepotrzebnie przyciągają jako pierwsze jego uwagę. To z kolei powoduje pierwsze oznaki jego frustracji i rozczarowania – co prawda ma do dyspozycji całą witrynę, ale nie wie, jak ją rozgryźć i od czego zacząć. Poza tym – z psychologicznego punktu widzenia – wydaje się logiczne, że użytkownik będzie czuł się osaczony i zniechęcony, kiedy na samym wejściu, bez odpowiadania na jego pytanie i oferowania mu czegokolwiek, zostanie zarzucony niepożądanymi w CTA (call-to-action, czyli link, banner czy przycisk, którego celem jest wywołanie konkretnej reakcji użytkownika – kliknięcia, kupna itd.). Z drugiej strony te mogą być mile widziane już na początku, kiedy wnoszą jakąś wartość lub spełniają życzenie użytkownika. Tak więc CTA prowadzące do ważnych podstron czy takie, które już w pierwszej sekcji umożliwiają kupno biletów na wyczekiwany koncert, o którym wiemy wszystko i nie mamy potrzeby scrollować strony z całą ofertą, jak najbardziej spełniają swoją rolę. Najważniejsze, aby odpowiednio sklasyfikować ich użyteczność dla użytkownika.

Pomocną praktyką jest stosowanie tzw. breadcrumbów (te mają też znaczący wpływ na SEO). Jest to ścieżka nawigacyjna, która pokazuje, w jakim miejscu w strukturze strony użytkownik się właśnie znajduje. Ponieważ uwzględnia każdą podstronę, przez jaką przeszedł, łatwo wrócić do poprzedniej kategorii, np. w sklepie internetowym.

Do kwestii nawigacji należą także kolory. Już na tym etapie należy uwzględnić odpowiednią paletę barw, która będzie nawiązywała do brandingu, zawierała kontrastowe odcienie i dzięki którym zawartość będzie czytelna i angażująca. Istotny jest też kontekst kulturowy i to, jakie konotacje wywołują określone schematy kolorystyczne w danych okręgach.

konotacje kulturowe kolorów

Dobra strona powinna być też zbudowana zgodnie ze standardem WCAG 2.0 dostosowanym do potrzeb osób niedowidzących, które używają specjalnych programów czytających witryny. Te uwzględnia się już na poziomie kodu – oznacza się elementy strony w taki sposób, aby czytnik na pewno je rozpoznał. Należy też opatrzyć te elementy, które wpływają na funkcjonalność, podpisami lub innymi znakami graficznymi, które umożliwią rozpoznanie ich osobom z dysfunkcjami wzroku związanymi z widzeniem kolorów, tzw. daltonizmem. Sam redaktor również ma wpływ na dostosowywanie wszelkich nietekstowych elementów, które nie pełnią funkcji ozdobników, poprzez dodawanie w CMS-ie tzw. altów, czyli opisów alternatywnych. Mają tłumaczyć, co znajduje się na grafice, jeżeli ktoś nie może jej zobaczyć. Ponadto, kiedy na stronie wystąpi jakiś błąd czy łącze jest za słabe i obraz się nie załaduje, użytkownik nie zobaczy pustego pola, a właśnie taki alt z objaśnieniem.

Obecnie, kiedy minimalizm zaczął królować również w projektowaniu stron internetowych, jeszcze wyraźniejszym błędem jest pozostawianie użytkownikowi zbyt wielu możliwości wyboru. Powiedzenie, że mniej znaczy więcej, wciąż jest zatem aktualne. Nadmierne bombardowanie konsumenta linkami, w które może kliknąć, produktami, które jeszcze może obejrzeć, czy artykułami, które jeszcze może przeczytać, wprowadza chaos i prędzej spowoduje, że ten opuści naszą stronę. Podobnie z przedstawianiem zbyt wielu szczegółów dotyczących marki, działań czy oferty już na stronie głównej. Kluczem jest budowanie dobrych wprowadzeń, “zajawek”, które zaciekawią klienta i spowodują, że sam będzie chciał w nie kliknąć, by dotrzeć do dalszej części treści. W sytuacji, w której pojawia się zbyt wiele opcji, użytkownik doceni również możliwość filtrowania informacji czy sortowania ich w pożądany sposób, co pomaga w zawężeniu pola poszukiwań.

Bardzo dobrze sprawdza się też angażowanie użytkownika formą. Ruchome elementy, stosowanie naturalnych, organicznych kształtów, zabawa siatką strony, płynne przewijanie czy “smaczki” w postaci mikrointerakcji (to jeden ze sposobów, w jaki interfejs emocjonalnie angażuje użytkownika i reaguje na jego działania. Często są nimi animacje elementów, które za pomocą małych zmian interfejsu mają za zadanie przekazać użytkownikowi feedback, tj. zakomunikować, czy podjęta akcja się powiodła lub nie) to coś, co poza contentem jest w stanie uczynić naszą stronę bardziej oryginalną, a jednocześnie usprawnić poziom obsługi konsumenta.

Nad pozostaniem w pamięci użytkownika trzeba się nieco natrudzić – to jednak jednorazowy wysiłek, który może przynieść firmie korzyści nie tylko w postaci klientów, którzy będą do nas wracać lub polecać nas dalej, ale też rozpoznawalności i stanowienia dobrego przykładu dla innych przedsiębiorstw.

Zapraszam Cię na mój podcast!

Bohaterem każdego odcinka podcastu jest nieoczywiste słowo lub skrót stosowany na co dzień w agencjach marketingu internetowego, którego znaczenie wyjaśniamy wraz z moim gościem rozwijając temat konkretnymi przykładami, dzieląc się danymi i dostępnymi narzędziami.

Zobacz odcinki

Jeżeli potrzebujesz wsparcia przy projekcie internetowym lub szukasz agencji specjalizującej się w komunikacji marketingowej - skontaktuj się z nami.

Zapisz się na biuletyn redaktora naczelnego
Łukasza Wołka. Bezpłatne porady
i nowości marketingowe oraz newsy
z Abanana i Eura7 na Twojej skrzynce e-mail
już za 5 minut!
Pole "imię" nie jest obowiązkowe, ale jeżeli chcesz, żebyśmy zwracali się do Ciebie po imieniu, podaj nam je :)
loader
Dziękuję za zapisanie się do
mojego biuletynu.
Otwórz teraz swoją skrzynkę mailową, potwierdź zgody i aktywację. Sprawdź proszę, czy mail ode mnie nie wpadł do spamu albo do ofert.
CEO Łukasz Wołek ŁUKASZ WOŁEK, REDAKTOR NACZELNY LABBER.PL