NEXT 3/2009 - Użyteczna strona WWW

Nawet najpiękniejsza strona WWW może zniechęcić brakiem praktycznych rozwiązań. Prezentujemy zbiór porad dotyczących użyteczności, które pomogą ci projektować strony przyjazne dla internautów.

Dobre rozwiązania z zakresu użyteczności

Witrynę można nazwać użyteczną, jeśli internauta wchodząc na nią, nie musi się zastanawiać, jakiemu zagadnieniu jest poświęcona i jak się po niej poruszać. Użyteczność to także przyspieszanie często wykonywanych zadań, takich jak np. korzystanie z wyszukiwarki, umieszczanie komentarza, przeglądanie zdjęć z galerii, wysyłanie linku do ciekawej informacji znajomemu. Z praktycznego punktu widzenia termin „użyteczność” znaczy tyle, co funkcjonalność strony. Informatycy jednak chętniej używają określenia „użyteczność" (z ang. usability) lub, jak można przeczytać w Wikipedii, „używalność”. Pozostaniemy jednak przy pierwszym terminie. W artykule prezentujemy praktyczne porady, jak uczynić stronę WWW bardziej przyjazną, a także, jak uniknąć błędów, które zniechęcają użytkowników do odwiedzania witryny. 

Unikaj flashowych nawigacji i animowanych elementów

Niską użytecznością charakteryzują się serwisy wykonane we Flashu. Przypomnij sobie, ile razy widziałeś piękną, animowaną stronę, po której trudno było się poruszać, bo znacznie spowalniała działanie komputera? Świetnym przykładem może być dowolna witryna z padającymi w tle płatkami śniegu. Algorytmy wyliczające ich ruch mogą bez kłopotu zawiesić przeglądarkę. Problem staje się jeszcze poważniejszy, jeśli taki algorytm zostanie zawarty w reklamie. W ten właśnie sposób kilka miesięcy temu portal Gazeta.pl uniemożliwił praktycznie przeglądanie swoich zasobów, wyświetlając na każdej stronie reklamę firmy Play z niezoptymalizowanym algorytmem w tle. Bodaj największy wpływ na użyteczność mają wyskakujące reklamy flashowe, które zasłaniają treść i przewijają się razem ze stroną (tzw. toplayery). Niestety, jest to stosowane nagminnie w przypadku polskich portali. Również ingerencja w strukturę stron w formie wyświetlania okienek pop-up i pop-under skutecznie zmniejsza użyteczność serwisu.

Powodem obniżenia użyteczności może być także wolne ładowanie się elementów. W przypadku Flasha niezbędne jest zaprojektowanie czytelnego preloadera (paska postępu pobierania) oraz dogrywanie zdjęć, plików dźwiękowych i filmów na żądanie użytkownika. Jeśli nie zaopatrzymy strony w te elementy, sfrustrowany internauta zamknie witrynę, jeszcze zanim pokaże się treść.

Informacje muszą być łatwe do znalezienia

Po wyświetleniu wszystkich elementów strony odwiedzający powinien bez problemu rozpoznać rodzaj serwisu (np. czy to jest portal, blog, sklep czy strona firmowa), zauważyć nazwę i logo (powinny być w lewym górnym rogu), odnaleźć nawigację i, co ważne, wyszukiwarkę. Na podstronach warto umieszczać informacje o ich położeniu względem struktury całego serwisu. Należy dodać, że wszystkie wymienione elementy informacyjne i nawigacyjne muszą być dostępne bez konieczności przewijania strony.

Informacje powinny być łatwe do znalezienia. Dobrze jest dodać do nich powiększony nagłówek i używać formatowania tekstu, pogrubiając ważniejsze fragmenty. Dzięki temu przekaz jest bardziej zrozumiały. Obrazkom warto dodawać atrybuty alt (tekst alternatywny, wyświetlany w przypadku niemożności pokazania obrazka) oraz title (tekst wyświetlany po najechaniu kursorem na obrazek). Czcionka musi być czytelna, a linki powinny być wyraźnie oznaczone kolorem lub podkreśleniem. Trzeba zwrócić uwagę na to, by tekst linkowany informował, gdzie odsyła, tak by użytkownik nie musiał brać pod uwagę kontekstu.

Złym nawykiem jest stosowanie linków dla słowa „tutaj”. Internauta, by dowiedzieć się, dokąd trafi po kliknięciu na odnośnik, musi przeczytać całe poprzednie zdanie. Wartość informacyjną można podkreślić, dodając do linku atrybut title. Jego treść wyświetli się wtedy, gdy internauta umieści kursor nad odnośnikiem. Dobrą praktyką jest pozostawienie użytkownikowi decyzji, gdzie ma się otwierać kliknięty odnośnik. Tylko w wyjątkowych i uzasadnionych sytuacjach powinno się stosować atrybut target otwierający nowe okno po kliknięciu.

Ocena:    (aby ocenić, musisz się zalogować w serwisie)

 del.icio.us |  Wykop mnie |  Digg this story |  dodajdo.com

• Wiedza to podstawa »
  zbieranie informacji o popularności witryny WWW
• Strona WWW w komórce »
  tworzymy serwis mobilny
• Zaszyfruj kod swojej strony WWW »
  pełne wersje
• Lepsze strony WWW »
  platformy do tworzenia aplikacji internetowych
• Specjalista od WWW »
  Specyfika zawodów informatycznych: webmaster