Pomiń łącza nawigacjiStrona główna > Kurs Usability > Firmowy serwis WWW > Projektowanie strony głównej

Projektowanie strony głównej - tomik99 2009-07-24 16:32:15

Projektowanie strony głównej jest zajęciem niewdzięcznym i trudnym. Dlaczego? Przede wszystkim masz mnóstwo informacji, które możesz pokazać, i sporo ograniczeń dookoła. Z tego też powodu odkładałbym projektowanie strony głównej do czasu, aż uzyskany zostanie spójny obraz najważniejszych podstron serwisu. Gdybym miał odpowiednią ilość czasu zebrałbym większość treści na wszystkie podstrony. Wtedy dużo łatwiej będzie zadecydować, które z informacji z głębi serwisu należy wyciągnąć na główną. Niestety, często strony główne powstają życzeniowo. Skutkiem tego atrakcyjny obszar strony głównej promuje sekcje strony, w których nie ma interesującej treści lub, co gorsza, sekcje „w budowie”.

W kilku ostatnich projektach różnych serwisów zaczynaliśmy od stron z treścią. Stwierdziliśmy, że to właśnie po nie przychodzą użytkownicy i na nich spędzają najwięcej czasu. Wielu z nich nawet nie trafia na stronę główną (ruch z wyszukiwarek, reklam, rekomendacje znajomych). W niektórych serwisach nawet w statystykach ruchu widać, że są podstrony o większej ilości odsłon niż strona główna. Zaczęliśmy, więc projektować najpierw strony z treścią, następnie poprzez wyciąganie z nich najważniejszych rzeczy powstały strony kategorii/działów, wyciągając najważniejsze rzeczy ze strony działów, stworzyliśmy stronę główną. Proces projektowania był bardziej płynny i wszyscy byliśmy zadowoleni z takiej kolejności projektowania. Gorąco polecam to podejście.

Wróćmy jednak do naszej ukochanej strony głównej, która jest oczkiem w głowie całej firmy. Zresztą w niejednej korporacji zapisy na miejsce reklamowe na stronie głównej są przyjmowane na kilka miesięcy do przodu. Zastanówmy się, co musimy koniecznie tam zaprezentować. 

Co musi się znaleźć na stronie głównej?

Z pewnością najważniejszym przekazem firmowej witryny WWW jest jej tożsamość. Należy zbudować jasny komunikat, że oto użytkowniku trafiłeś na stronę firmy X. Jeśli struktura firmy, której stronę budujemy, jest skomplikowana (jeśli nie czujesz tego problemu, polecam odwiedzić choćby strony KGHM i zobaczyć strukturę spółek), jestem zdania, ze lepiej stworzyć więcej odrębnych stron. Odbiorca nie musi interesować się tym, kto jest właścicielem danej spółki, w skład której grupy wchodzi. Najpierw musimy zapewnić jasny komunikaty, aby odwiedzający serwis mógł upewnić się, że dobrze trafił.

Zatem na początek na pewno logo i elementy z systemu identyfikacji wizualnej. Sam system identyfikacji wizualnej firmy (nazywany też CI) dobrze jest zdobyć przed projektowaniem, aby zapoznać się z wizualnym przekazem danej marki. Coraz częściej klienci korporacyjni posiadają także web-guidelines, czyli poradniki, w jaki sposób powinno się konstruować firmowe witryny WWW. Najczęściej w takim poradniku przedstawione są wizualne rozwiązania, które są preferowane przez daną korporację. Może tu być zaprezentowanie, w jaki sposób powinniśmy formatować linki, nagłówki czy obrazki na stronie. Ciekawostką, na którą się natknąłem, jest historia web-guidelines firmy Siemens. Podobno bardzo dobrze stworzona obszerna specyfikacja uzasadnia nawet, skąd wywodzą się stosunki proporcji elementów w serwisie WWW.

Na stronie głównej umieszczamy następnie elementy nawigacyjne — takie jak menu, punkty startowe, opcjonalnie wyszukiwarkę. Przy każdym projekcie rozważyłbym, czy i jeśli tak, to jaką treść należy publikować na stronie głównej. Coraz częściej zamiast sekcji aktualności pojawiają się filmy wideo prezentujące, czym zajmuje się firma. Osadzając wideo w serwisie, warto pamiętać o opcjach pozwalających wyciszyć dźwięk. Optymalne rozwiązania odgrywają zapętlone kilka pierwszych sekund filmu i zachęcają do kliknięcia Odtwarzaj. Dopiero wtedy uruchamiany jest cały film i włączany dźwięk. Unikniesz irytowania internautów oraz będziesz mieć pewność, że obejrzą film od początku.

Oczywiście kolejnym elementem strony głównej są formy reklamowe. W obrębie serwisu korporacyjnego są to zazwyczaj reklamy autopromocyjne. Najlepiej przewidzieć na nie miejsce, nawet jeśli nie będziemy z nich korzystać już teraz. Wstawianie form reklamowych na szybko niestety zazwyczaj źle odbija się na wyglądzie serwisu.

Nie można zapomnieć o tym, by na stronie głównej umieścić elementy budujące zaufanie (choćby stopkę) oraz zapewnić stronie oznaki życia. To ostatnie jest trudniejsze, niż mogłoby się wydawać. Sugeruję porozmawiać z agencją PR lub znaleźć taką, która zechce zająć się także aktualizacją strony WWW. To dobre rozwiązanie, które wielokrotnie sprawdziłem. Agencja PR nie dość, że potrafi szybko i sprawnie pisać, to jeszcze spojrzy na firmę z zewnątrz i trafnie oceni, o czym warto informować. PR będę wychwalał jeszcze w dalszych rozdziałach tej książki.

Jakie problemy napotkasz projektują stronę główna?

Można by powiedzieć, że największy problem związany ze stroną główną to to, że jest ona tylko jedna. Niestety, każdy chce się na niej znaleźć. Można obejść ten problem, tworząc główne strony dla poszczególnych obszarów działania firmy i wtedy traktować stronę główną tylko w kategoriach strony rozprowadzającej ruch.

Mit związany z tym, że internauci nie przewijają stron, powoduje dodatkowo, że każdy chciałby, aby jego link, banner, fotka, wideo — znalazły się jak najwyżej. Internauci oczywiście przewijają strony. Elementy znajdujące się na górze strony są trochę częściej klikane, ale różnice, które zauważyłem, nie były aż tak wielkie. Dla pocieszenia powiem, że elementy znajdujące się przy samej dolnej krawędzi strony są często klikane częściej niż te w części środkowej.

Dobrze jest upewnić się, że zaprojektowana strona główna odpowiada na następujące pytania (rysunki 5.2 i 5.3):

  • Co to jest?
  • Co oni tutaj mają?
  • Co mogę tu zrobić?
  • Dlaczego powinienem być tu, a nie gdzie indziej?

Rysunek 5.2. Tekst wraz z rysunkiem pokazującym, jak w trzech krokach skorzystać z usług serwisu. Źródło: http://videosteam.pl

Rysunek 5.3. W serwisie e-gotowka.pl mamy bardzo klarowny przekaz. Od razu wiadomo, co można tutaj zrobić. Źródło: http://e-gotówka.pl

Zwiększanie ilości informacji

Można zwiększyć ilość informacji prezentowaną na stronie głównej poprzez elementy sekwencyjnie wyświetlające reklamy. Należy pamiętać o tym, aby użytkownik mógł zaingerować w przekaz (zatrzymać, przewinąć). Jeśli wykonasz interesujący element rotujący reklamy, to może on nawet zachęcić niektórych użytkowników do wzmożonego zainteresowania. Oczywiście efekt ten jest krótkotrwały.

Efekty najazdu

 

Dla zaoszczędzenia miejsca stosuje się często efekty polegające na wyświetlaniu opisu dopiero po wskazaniu elementu kursorem. Niestety, generuje to wiele problemów. Użytkownik musi odszukać i sprawdzić wszystkie potencjalne elementy, które mogą być elementami menu. Poza tym w danej chwili można wyświetlić tylko jeden opis, nie można zatem porównać wszystkich opcji. W dodatku niekiedy opisy nie zawsze pojawiają się w bezpośrednim sąsiedztwie kursora, musimy kierować wzrok raz na kursor, raz na opis (rysunki 5.4 i 5.5).

Rysunek 5.4. Zadanie dla domyślnych! Znajdź menu na tym zrzucie ekranu. Menu ukryte zostało pod kwadracikami obok nutki. Nutka i kwadraciki sugerują, że ten element służy do kontroli głośności. Niestety, pod tym niepozornym elementem znajduje się całe menu serwisu. Źródło: http://mozdzer.com


 
Rysunek 5.5. Serwis Casio także wymaga od odwiedzających mnóstwa cierpliwości

Tego typu rozwiązanie nie pozwala na ocenę zawartości strony bez wchodzenia w interakcję. Wbrew pozorom to nie jest dobre. Nie chcemy przecież wymuszać interakcji na użytkowniku.

Sugeruję odwrócenie sytuacji — czytelne menu tekstowe, a po wskazaniu elementu menu uruchamia się jakaś interakcja lub pojawia element graficzny. Wtedy i wilk syty, i owca cała.

Dla zaoszczędzenia miejsca stosuje się często efekty polegające na wyświetlaniu opisu dopiero po wskazaniu elementu kursorem. Niestety, generuje to wiele problemów. Użytkownik musi odszukać i sprawdzić wszystkie potencjalne elementy, które mogą być elementami menu. Poza tym w danej chwili można wyświetlić tylko jeden opis, nie można zatem porównać wszystkich opcji. W dodatku niekiedy opisy nie zawsze pojawiają się w bezpośrednim sąsiedztwie kursora, musimy kierować wzrok raz na kursor, raz na opis (rysunki 5.4 i 5.5).


Wyszukiwarka


Tomasz Karwatka

Tomasz Karwatka

Optymalizacja sklepu

Informacje o nowościach

Nowe publikacje, case study i raporty.



Partnerzy:

  • Ideacto
  • helion.pl
  • 7point
  • cary
  • biznes 2.0