Wikipedia mówi nam, że Architektura informacji to sztuka i nauka organizowania oraz etykietowania stron internetowych, społeczeństw sieciowych i oprogramowania w celu wspierania użyteczności informacji.

Użyteczności?

„Użyteczność jest to miara wydajności, efektywności i satysfakcji użytkownika z jaką

dany produkt może być używany dla osiągnięcia

danych celów przez danych użytkowników w danym kontekście.” – Norma iSo 9241

Zadajmy sobie kluczowe pytanie – Jakie cele mają nasi użytkownicy podczas odwiedzania naszej strony internetowej?

Architektura informacji jako interakcja (choreografia) tekstu.

Podczas projektowania łączymy obrazy i słowa, podczas tworzenia strony internetowej musimy dodatkowo zaprojektować odpowiednią architekturę ponieważ elementów mamy znacznie więcej.

Nie możemy pozwolić, żeby klient spędził godzinę na poszukiwaniu podstawowych informacji na naszej stronie. Powinien intuicyjnie poruszać się po niej, spodziewać się, gdzie znajdzie odpowiednie informacje, co się wydarzy jak kliknie poszczególne ikony itp.

Uporządkowanie materiałów znajdujących się na stronie jest kluczowe, nie możemy przytłoczyć użytkownika treścią a jednocześnie musimy dostarczyć mu jak najwięcej potrzebnych informacji. W końcu podczas zakupu nowego auta, któremu sprzedawcy bardziej zaufamy? Temu co udzieli nam wszelkich informacji i da nam przetestować i sprawdzić auto czy temu który szczątkowo udzieli nam odpowiedzi i nawet nie pokaże silnika?

Tak samo jest z prezentacją w internecie, nie za dużo i nie za mało. Nie chaotycznie a uporządkowanie! Planowanie, podzielenie informacji na ważne i mniej istotne, zaprojektowanie struktury menu, wyodrębnienie słów kluczy, wyeksponowanie chwytliwych słów kluczy, odpowiednie tytuły, leady itp.

IA to odpowiednia prezentacja tekstów, materiałów, obrazów.

Po uporządkowaniu treści czas na odpowiednie nazewnictwo. Ustalenie nazw dla wydzielonych grup treści – nawigacji, nagłówków, indeksów, kontekstowe linki, grafiki itd.

IA jako NAWIGACJA

Nawigacja – to system pomagający poruszać się po serwisie i podczas przeglądania jego zawartości w sposób intuicyjny.

IA jako struktura

Pojęcie struktury możemy odnieść do nawigacji w menu.

Struktura szeroka – Flat Architecture

Przykłady: Strona główna, O nas, Usługi, Blog, Kontakt lub Home, Ona, On, Dziecko, Wyprzedaż, Kontakt, Moje konto – to struktura szeroka, są nimi najprościej pisząc główne tytuły/ nagłówki w menu.

• Mniejsza liczba kroków/ kliknięć
• Większe obciążenie pamięci.
• Większa odkrywalność
• Skomplikowany, wielowariantowy wybór (najczęściej jeden z pierwszych)

Struktura głęboka – Deep Architecture

Podstrony menu: – to struktura głęboka, gdzie kliknięcie w jedną kartę powoduje rozwinięcie kolejnych. Przykład takiej struktury: Ona -> Nowości/ Magazyn/ Stroje okolicznościowe/ Produkty -> Bluzki/ Koszulki/ Spódnice/ Szorty / Spodnie/ Sukienki … -> sukienki mini / sukienki midi / sukienki maxi/ sukienki okolicznościowe -> kopertowe/ koronkowe/ koktajlowe / ślubne …

• Większa liczba kroków/ kliknięć.
• Mniejsze obciążenie pamięci.
• Mniejsza „odkrywalność „
• Często prostsze, 0-1 wybory.

Porównajmy: Struktura głęboka vs Struktura szeroka

STRUKTURA GŁĘBOKA: bardziej zadaniowa, specjalistyczna, *mniej dostosowana pod wyszukiwarki.

STRUKTURA SZEROKA: bardziej eksploracyjna, ogólna/ konsumencka, *bardziej dostosowana pod wyszukiwarki

Jak jesteśmy przy menu trzeba przyznać, że w architekturze informacji sporo zmieniły również telefony.

NAV BAR – Plusy

• Stosowany jest w sytuacji, kiedy menu znajduje się ok. 5 pozycji. Chowa się w trakcie scrollowania. Jeżeli opcji jest więcej, można przewinąć ją w poziomie.

NAV BAR – Minusy

• W przypadku zastosowania przewijania, pewne opcje mogą zostać niedostrzeżone.Sprawdza się dobrze tylko w przypadku małej liczby opcji menu.

HAMBURGER MENU – Plusy

Można zaaplikować dużo pozycji wraz z submenu.

HAMBURGER MENU – Minusy

Mniejsza wykrywalność niż w przypadku nav bar. Użytkownicy zapominają, że mogą wybierać pewne opcje z menu.

HUB MENU – Plusy

• Dobra opcja dla aplikacji opartych o zadaniowość. Kiedy użytkownik w ciągu jednej sesji wykonuje jedno zadanie.

O czym warto jeszcze wspomnieć? Zerknij na te wpisy

PODEJŚCIE 3 kliknięć oraz LICZBA MILLERA.

Po co architektura informacji? Jest to również narzędzie nawigacyjne. Uporządkujmy treści, które mają znajdować się na stronie, zaprojektujmy odpowiednie menu i jego nazewnictwo, podstrony. Rozgraniczamy nagłówki i treści, wybrębnijmy słówa klucze itd.

Wprowadzajmy odpowiednią nawigację w zależności od tego co chcemy uzyskać.

IA jako FORMA

Test 5ciu sekund?

„W branży designu i UX mówi się, że masz średnio 5 sekund by przykuć uwagę odwiedzającego lub odejdzie on szukać innych stron. Słyszeliśmy też interpretacje, że klient (na poziomie nieświadomym) podejmuje decyzję już po 0.5s, a pozostałe 4.5s poświęca znalezieniu uzasadnienia.”

IA jako reprezentacja

Test pierwszego wrażenia i skojarzenia. Grafika: Czy ma związek z Twoim produktem/usługą? Nagłówek: Czy w prosty sposób mówi, czym się zajmujesz? Tego typu pytania powinny naprowadzić na odpowiednie zaprojektowanie strony.

Chcemy pomagać swoim klientom, a nie ich rozpraszać prawda? Jest prosta metoda na to, by sprawdzić jak bardzo klarownie komunikuje się Twoja firma. Jest im właśnie test 5ciu sekund.

Potrzebne będą trzy elementy. Komputer, Użytkownik , który wcześniej nie widział strony oraz 5 sekund.

Załaduj stronę główną firmy i pokaż ją Użytkownikowi na około 5 sekund. Po tym czasie zamknij stronę lub wyłącz ekran i zadaj mu kilka pytań.

Jak myślisz, czym się ta firma zajmuje? 
Co może ci zaoferować?
Co ze strony zapamiętałeś? 
Co rzuciło się w oczy?
Co zrobiłbyś w pierwszej kolejności?

Gdzie można kupić bilet?

Gdzie znajduje się oferta oraz cennik?

Chcemy zobaczyć, co zdołał zapamiętać i zrozumieć. Celem tego eksperymentu jest sprawdzenie, czy odwiedzający jest w stanie intuicyjnie poruszać się po stronie i znaleść to czego szuka i wie jak poruszać się po stronie. Jeśli nie, to oznacza, że Twoja architektura informacji jest niejasna.

Najlepiej jeśli test powtórzysz co najmniej kilkukrotnie i kilkoma użytkownikami. Dopiero wtedy będziemy w stanie zauważyć pewne zależności, które mogą nas naprowadzić na lepsze rozwiązanie.

Podsumowanie:

Architektura jest bardzo istotną praktyką w projektowaniu stron internetowych, wymaga od projektanta szczegółowego zgłębienia tematu, analizy materiałów oraz odpowiedniego riserczu, warto poświecić na to więcej uwagi, detale mają ogromne znaczenie w tworzeniu użytecznych stron internetowych.

Jeżeli macie jakieś pytania, skontaktuj się z Nami. Podobał Ci się ten wpis, zostaw nam serduszko.

Zapraszamy również na nasze social media.