Zapraszam do dalszej lektury w serwisie InternetMaker.pl

Zdjęcie za: http://openofficemouse.com/pr110609.html

Mysz mogłaby posłużyć za książkowy przykład interfejsu opracowanego przez “tych technicznych” dla “innych technicznych”. Z pominięciem usability, ale z uwzględnieniem multum opcji. To dobrze pokazuje dlaczego projektanci interakcji są tak potrzebni :)

Konieczność odwiedzania wszystkich stron i drukowania ich po kolei to przykład nie zwrócenia uwagi na potrzeby użytkowników oraz istotnego problemu usability (i być może braku testów) Właśnie taka sytuacja spotyka nas w portalu Onet.pl. Przykład działania funkcji drukowania można ocenić np. przy tym artykule.

Gdy chcę wydrukować tekst w portalu, to powinienem uzyskać dostęp co całego tekstu. Tak, abym tylko raz musiał nacisnąć przycisk “drukuj”. Nie będę po kolei mozolnie drukować każdej strony tekstu (szczególnie gdy jest ich wiele), jeśli naprawdę, ale to naprawdę nie zależy mi na jego wydrukowaniu. A najczęściej czytając coś w Onecie i innych portalach nie jestem aż tak zdesperowany.

Nawiasem mówiąc opcji drukowania używam także wtedy, gdy chcę zapisać dany artykuł na dysku twardym komputera. To pokazuje, że dana funkcjonalność może mieć zupełnie inne zastosowanie, niż przewidywali to twórcy :-)

Czy takie działanie funkcji drukowania w Onecie jest typowe? Prześledziłem jak drukowanie działa w kilku znanych portalach (część linków kieruje do konkretnych podstron):

• Wirtualna Polska – drukuje cały artykuł
• Gazeta.pl – nie znalazłem przypadku dzielenia tekstu
• Interia.pl – nie znalazłem przypadku dzielenia tekstu
• tvn24.pl – – nie znalazłem przypadku dzielenia tekstu
• Dziennik.pl – drukuje cały artykuł
• Wiadomosci24.pl – drukuje cały artykuł
• Focus.pl – drukuje cały artykuł
• Gazeta Prawna – drukuje cały artykuł

Jak widać nie jest to powszechną praktyką! Wręcz przeciwnie. Kilka portali zrezygnowało nawet z dzielenia tekstów na części. A może to tylko ja nie zauważyłem odpowiednich tekstów? Brawa należą się także tym serwisom, które pomimo dzielenia tekstów na części pozwalają na ich łatwe drukowanie. A Onet ma powód do wstydu :-)

Nie wiem czy utrudnienie drukowania tekstu w Onecie jest przypadkowe czy wynika z jakiegoś planu. Ale pewnie nie tylko ja byłbym wdzięczny osobom zarządzającym portalem za zmianę działania funkcji drukowania.

Na stronie głównej mamy 21 ilustracji. Wskazujemy jedną z nich kursorem myszy – widzimy opis. Przechodzimy do kolejnej – opis poprzedniej znika. A przecież ilustracje często mało mówią na temat dodatku. Z kolei opis tekstowy jest łatwiejszy do zapamiętania i skanowania wzrokiem.

O ile mógłbym utrzymać w pamięci kilka początkowych tytułów, o tyle przy takiej liczbie dodatków jest to praktycznie niemożliwe.

Rozwiązanie problemu jest proste: opisy powinny być zawsze widoczne. I warto to uznać za uniwersalną zasadę poprawiającą użyteczność. Komfort korzystania z serwisu na pewno się poprawi. Gorąco zachęcam autorów do tej zmiany.

Sugeruję także, że przydatne byłyby dodatkowe opisy przekazujący nieco więcej szczegółów na temat dodatków. Nie ma to dużego znaczenia, gdy szukamy czegoś, co już znamy lub o czym słyszeliśmy. Jednak jest ważne, gdy po prostu przeglądamy serwis poszukając czegoś interesującego.

Poniżej zrzut ekranu z serwisu Dolnośląskiej Instytucji Pośredniczącej z działu “Najczęściej zadawane pytania”:

Pytań jest ponad 40. Odpowiedź na każde z nich to osobny plik PDF. Czy takie odpowiedzi zajmują kilkanaście stron? Obejrzałem kilka plików i średni rozmiar odpowiedzi to nie więcej, niż 3 akapity tekstu.

Zastosowane rozwiązanie z pewnością nie sprzyja wygodzie korzystania ze strony. Każe użytkownikowi domyślać się o co chodzi w danym pytaniu, ściągać pliki, otwierać je, czytać, następnie zamykać… Gdybym miał wyrazić się ostrzej, to powiedziałbym, że takie zastosowaniu plików PDF jest absurdalne. Jak widać, format ten nie czyni cudów i musi zostać mądrze wykorzystany.

W sumie jest to ciekawy i przydatny mechanizm. Z jednym problemem. Moje wyszukiwania są zapamiętywane przez przeglądarkę i chciałbym je widzieć podczas wpisywania nowego zapytania. Niestety teraz widzę tylko automatyczne sugestie.

Nie byłoby problemu, gdybym mógł szybko wyłączyć tą opcję. Nie dostrzegam jednak takiej możliwości! Mogę jedynie skorzystać z zaawansowanego wyszukiwania. Okazuje się jednak inaczej. Jeśli choć raz skorzystamy z zaawansowanej wyszukiwarki odznaczając opcję autopodpowiedzi, to zmiana zostanie zapamiętana na stałe. Nie jest to rozwiązania oczywiste i intuicyjne. W ten sposób interfejs nie jest przez nas interpretowany na podstawie jasnych przesłanek, a korzystanie z niego wymaga zabawy w zgadul-zgadula.

Jak ja bym to rozwiązał? Na pewno ustawienie sugestii musi działać w oderwaniu od zaawansowanej wyszukiwarki. To dwie różne funkcje. Nawet prosty przycisk “zastosuj” przy ustawianiu opcji byłby krokiem w dobrym kierunku. Jednak dążyłbym do tego, aby włączanie/wyłączanie sugestii odbywał się w całkowicie innym miejscu.

Wniosek: gdy wprowadzamy funkcjonalność ingerującą w przyzwyczajenia użytkownika i nie jest ona krytyczna dla funkcjonowania serwisu, to dajmy mu możliwość jej wyłączenia. Możliwość ta musi być szybka i bezbolesna.

Jednak z biegiem lat Amazon staje się – wbrew pozorom – coraz mniej użytecznym sklepem. W anglojęzycznym internecie nie ma chyba zbyt wielkiej konkurencji… I moim zdaniem to go ratuje. Na dowód tej tezy przeanalizujmy wspólnie przykładową stronę produktu. Polecam przed dalszą lekturą odwiedzić stronę i pooglądać. Szczególną uwagę zwracając na jej długość…

A więc jest sobie pewna książka. Widziałem ją pierwszy raz w życiu. Nigdy wcześniej o niej nie słyszałem. Trafiłem na nią poprzez listę bestsellerów. Nie mam więc pojęcia czego się spodziewać i o czym ona jest. Chciałbym po pierwsze dowiedzieć się, co to za gatunek. Jeżeli to np. romans to wiem z góry, że mnie nie zainteresuje. Dlatego też sklepy posiadają kategorie produktów i informują klientów do jakiej kategorii dany produkt należy. Niestety, Amazon zapomniał o tej dobrej praktyce:

Druga sprawa. Nigdzie nie widzę także informacji o hierarchii stron w postaci okruszków. Jest to błąd nie tylko dlatego, że nie otrzymałem potrzebnej mi informacji. Gdyby książka mnie zainteresowała i dodałbym ją do koszyka, to mógłbym przejść do strony kategorii szukając podobnych książek. Oprócz tego brak takich informacji niemal zawsze zwiększa wrażenie dezorientacji. Utrudnia poruszanie się w strukturze sklepu i jego eksplorację zmniejszając pozytywne wrażenia użytkowników.

W następnej kolejności chciałbym dowiedzieć się o czym dokładnie jest książka. Szukam więc opisu. Choćby krótkiego. Niestety, żadnego nie widzę. Czy powinienem więc przejść do wyszukiwarki i poszukać innej księgarni? Zapewne tak bym zrobił, ale tym razem postanawiam być uparty. Dopiero pod częścią z prduktami kupionymi przez innych klientów znajduję to, czego szukałem:

Mamy więc kolejny problem. Tym razem z hierachią informacji na danej podstronie. Informacje, które są ważne dla klientów znalazły się na dole. Przeszkadzajki – na górze. Te dodatkowe elementy też mogą mieć znaczenie, ale muszą znajdować się w odpowiednim miejscu. Zastosowanie zasady odwróconej piramidy na pewno by tu pomogło.

Odwrócona piramida jest stosowana w dziennikarstwie. W newsach prasowych najważniejsze informacje znajdują się na początku. Tak samo powinno być w przypadku serwisów internetowych. Tyle, że tutaj nie mamy reklacji początek-koniec, ale góra-dół. Zasada jednak pozostaje niezmienna. Jeżeli użytkownicy muszą zbyt długo szukać najbardziej ich interesujących informacji, to ich poziom irytacji rośnie.

Na zakończenie mały apel: nie ubóstwiajmy Amazonu. To zwykły serwis w którym też jest sporo błędów. Fakt, że coś w nim zastosowano nic sam w sobie nie znaczy.

• Pogarsza wrażenia użytkowników w kontakcie z serwisem.
• Może spowodować opuszczenie serwisu, jeśli użytkownik przeszedł na stronę błędu z innej strony serwisu.
• Może spowodować, że użytkownik nie zapozna się z serwisem, jeśli na stronę błęde przeszedł z innej witryny, np. wyszukiwarki.

Rady, które poniżej przytaczam odnoszą się nie tylko do stron z błędem 404, ale także innych, zbliżonych stron błędów. Na przykład witryna GoldenLine podczas próby wejścia do zamkniętej grupy, której nie jesteśmy członkiem wyświetla coś takiego:

Niezbyt przyjemne, prawda? Taka strona nie odpowiada na kilka ważnych pytań:

• Dlaczego nie mam uprawnień do przeglądania tej strony?
• Co mam zrobić, aby uzyskać takie uprawnienia?
• Gdzie ta strona znajduje się w strukturze serwisu?
• Gdzie mogę się teraz udać?

Na ostatnie pytanie odpowiedź została częściowo udzielona poprzez link do strony głównej. To jednak za mało. Dobra strona błędu powinna zawierać:

• Logo serwisu i slogan (jeśli strona go posiada).
• Główną nawigację serwisu.
• Pole wyszukiwania, najlepiej tuż pod informacją o błędzie.
• Krótkie i przejrzyste wyjaśnienie przyczyn powstania błędu, ale bez użycia języka technicznego.
• Odnośniki do części serwisu przydatnych w tej sytuacji, np. mapy strony.
• Dane kontaktowe.

Przekierowanie na stronę głowną?

Złym wyjściem jest także przekierowywanie użytkownika wchodzącego na nieistniejącą podstronę do strony głównej serwisu. Tak robi np. Wykop. Wprowadza to element dezinformacji, gdzie użytkownik właściwie nie wie, co się stało. Źle wpisał adres? Witryna ma jakiś dziwny błąd? Specjalna strona błędu jest lepszym rozwiązaniem. Jasno opisuje sytuacje i daje z niej wyjście. Zero nieporozumień.

Jak to robią inni?

Na potrzeby tego tekstu znalazłem kilka różnych stron błędów. Na początek zwróćmy uwagę na stronę Allegro:

Jest to niemal idealna strona błędu, jednak pewne rzecz mi się w niej nie podobają. Po pierwsze, użytkownik nie musi wiedzieć, że jest to błąd o numerze 404. Taki techniczny język trzeba wyeliminować. Po drugie, brakuje mi odnośnika do jakichś danych kontaktowych z obługą. Chociaż trzeba pamiętać, że w pewnych sytuacjach brak kontaktu bywa biznesowo skalkulowany (koszty obsługi mogą być wysokie).

Pomysłowy komunikat prezentuje strona błędu w Wirtualnej Polsce

To do czego można się w jej przypadku przyczepić to fakt, że link do strony głównej znajduje się dopiero na saaaaamym dole (nie widać tego na zrzucie ekranu). Wyjaśnienie sytuacji jest za to tak udane, że aż zacytuję: “W naszym portalu mamy tysiące stron. Właściwie to nawet miliony. Pomimo szczerych chęci TAKIEJ STRONY jednak nie znaleźliśmy (a staraliśmy się!). Lecz nie załamuj się! POMOŻEMY!”. I wszystko byłoby świetnie, ale nigdzie linka do działu pomocy nie ma :-)

Ciekawa sytuacja ma miejsce w portalu Interia.pl, gdzie użytkownik zostaje przekierowany do mapy strony. Również nie polecam tego rozwiązania. Silenie się na zbytnią oryginalność jest bezcelowe – istnieją sprawdzone zasady dzięki którym można stworzyć udaną stronę błędu 404. W tej sytuacji niestandardowe rozwiązanie może utrudnić zrozumienie serwisu.

Szukałem długo idealnych stron tego typu. Niestety jest ich naprawdę, naprawdę mało (a więc mamy duże pole do popisu). Za przykład może posłużyć jednak witryna 37signals.com, gdzie widzymy bardzo przejrzysty opis sytuacji, kilka możliwych przyczyn błędu, kontaktowy adres e-mail oraz linki do popularnych części serwisu. Witryna ta nie posiada wyszukiwarki w ogóle, więc jej brak w tym miejscu też jest zrozumiały. Właściwie to nic bym w niej nie zmienił.

Na koniec osobom zainteresowanym stronami błędów i podobnymi sprawami polecam książkę Przyjazne witryny WWW.

Zacznijmy od bardzo przydatnej opcji “zobacz nowe posty”, która w różnych skryptach nosi różne nazwy i różnie (lepiej lub gorzej) funkcjonuje. Na forum ebiznesmeni.pl rozpoznanie znaczenia opcji “Zobacz posty od ostatniej wizyty” może nastręczać pewnych trudności:

Z kolei na forum optymalizacja.com jest to wręcz banalne. Opcja “Zobacz nowe posty” rzuca się w oczy, a jej znaczenie jest oczywiste.

Tu drugie forum jest uruchomione na komercyjnym skrypcie Invision Power Board, a to pierwsze na popularnym phpBB. Różnica między nimi jest spora. Jak widać, sam fakt zebrania grupy programistów open-source, którzy świetnie znają się na swojej pracy nie oznacza, że powstanie intuicyjny i wygodny w użyciu produkt.

Zapoznanie się z listą nowych postów to tylko pierwszy punkt. Trzeba jeszcze wrócić do strony głównej, najlepiej oznaczając wszystkie posty, jako przeczytane. W IPB znów zostało to rozwiązane bardzo wygodnie. Wystarczy użyć opcji “Oznacz wszystkie fora jako przeczytane i wróć do indexu”:

W phpBB nie jest tak różowo. Należy wrócić do strony głównej, zjechać na sam dół i kliknąć w “Oznacz wszystkie fora jako przeczytane”:

Jest to bardziej skomplikowane rozwiązanie. Należy zawsze pomysleć o tym, jak w danej sytuacji możemy maksymalnie uprościć zadanie realizowane przez użytkownika. Przy projektowaniu phpBB ktoś chyba o tym zapomniał.

Niemniej istnieją uniwersalne zasady, które ułatwiają ich projektowanie. Jedna z nich mówi, że należy zawsze jak najbardziej ograniczać liczbę pól formularza. Im ich mniej, tym lepiej.

Błędem jest więc zmuszanie użytkownika do dwukrotnego podawania adresu e-mail. Taki zabieg stosuje chociażby system statystyk Woopra:

Można argumentować, że użytkownik mógłby pomylić adres e-mail. Jasne, mógłby też pomylić imię, nazwisko, cokolwiek innego. Czy z tego powodu będziemy powtarzać każde pole? Nie traktujmy użytkowników jak głupich. Warto powtarzać tylko pole służące do wpisywania hasła, ponieważ w trakcie wpisywania na ogół nie widzimy jego treści.

Dużo na temat projektowania formularzy napisano w książce Przyjazne witryny WWW, którą bardzo polecam.