Strona z ramkami przestaje być jednostką nawigacji. Użytkownik nie może robić zakładek podstron, dzielić się adresem podstrony ze znajomymi, gdyż URL nie działa zgodnie z oczekiwaniami. Wyszukiwarki indeksując podstronę zaindeksują ją bez ramki, zatem użytkownik znajdując informację przy pomocy wyszukiwarki nie będzie wiedział gdzie i w jakim serwisie się znajduje. Ramki znajdują zastosowanie np. w indeksach pomocy, słownikach itd.
Przeciętny użytkownik poszukuje raczej treści i usług niż nowych technologii. Jeśli strona używająca ich zawiesi przeglądarkę lub znacząco zwolni system - nie wrócą na twoją stronę. Najnowsze technologii używaj jeśli je sprzedajesz oraz jeśli odwiedzającymi twój serwis mają być ich fani i webmasterzy.
Ruchome teksty i obrazy rozpraszają uwagę użytkownika, więc po prostu ogranicz ich użycie do minimum. Twoja strona nie powinna emulować Times Square w Nowym Jorku, gdzie ciągle coś się świeci i miga. Daj użytkownikowi przeczytać ją w spokoju i ciszy. Parametr BLINK jest zakazany!
Spraw, by adresy twoich podstron były odczytywalne dla użytkownika. Nazwa powinna być związana z rodzajem strony, minimalizuj możliwość popełnienia błędu przy ręcznym wpisywaniu adresu (używaj małych liter, krótkich nazw, jeśli to możliwe nie używaj znaczka ~).
Upewnij się, że każda strona ma opis z jakiego serwisu pochodzi (nie zawsze użytkownik dochodzi do niej z głównej strony). Każda strona powinna zawierać odnośnik do strony głównej (zazwyczaj banner firmy po lewej prowadzi do niej) oraz informację o jej pozycji w strukturze całości.
Tylko 10% użytkowników przewija stronę poza część widoczną w ich przeglądarce. Najważniejsze informacje i elementy nawigacji umieszczaj w górnej części strony. Podstrony serwisu mogą być dłuższe (jeśli kogoś zainteresują to przeczyta).
OBECNIE: Użytkownicy są bardziej skłonni do używania przewijanych stron. Aczkolwiek nadal obniża to użyteczność.
Typowy użytkownik niewiele wie o twojej stronie, więc może mieć problemy ze znalezieniem informacji. Zapewnij jasną strukturę i układ strony. Zbuduj też mapę serwisu oraz informuj o pozycji strony w strukturze całości, by użytkownik zawsze wiedział gdzie jest i gdzie może iść. Nawet najlepszy system nawigacyjny może przy dużych serwisach nie być wystarczający, warto wtedy dodać wyszukiwarkę.
Nie należy przedefiniowywać kolorów linków. Kolory standardowe to niebieski - strony nieodwiedzone, purpurowy lub czerwony - strony odwiedzone.
OBECNIE: Kolory można przedefiniowywać, ważne jednak, by zachować spójność na wszystkich podstronach. Warto zostawić linki podkreślone i nie używać podkreślenia w tekście (gdy chcemy wyróżnić tekst używamy pogrubienia lub kursywy).
Warto wynająć osobę do dbania o zawartość strony. Większość ludzi dodaje nowe informacje niż dba o już istniejące. Tańsza metoda od zatrudnienia osoby, to po prostu usuwanie nieaktualnych informacji, a gdy któraś jest jeszcze ważna, ale przeniesiona do archiwum, dodaj odnośnik do nowej lokalizacji.
Badania psychologiczne wykazały, że użytkownik może czekać na załadowanie strony maksymalnie 10 sekund, zanim straci w ogóle ochotę na jej oglądanie. W przypadku niektórych stron 15 sekund może być akceptowalne, bo ludzie się przyzwyczajają. Gdy strona do której kieruje link zawiera duże ilości tekstu, obrazu, czy innych obiektów, warto dodać obok linka informację o rozmiarze - wtedy użytkownik wie, że jeśli chce obejrzeć jej zawartość - trzeba poczekać.
Do poruszania się po stronach www użytkownicy używają linków. Drugim najczęściej używanym elementem jest przycisk Back. Jeśli sprawisz, że użytkownik nie będzie mógł wrócić do poprzedniej zawartości strony, będzie on się czuł niepewnie. Dotychczas mógł próbować wszystkiego - wiedząc, że zawsze ma drogę powrotną.
Nowe okno użytkownik zamyka często nawet przed jego załadowaniem. Jeśli będzie chciał otworzyć w nowym oknie stronę - zrobi to samodzielnie.
Spójność to podstawa użytecznej strony www. Spójność interakcji to dodatkowy powód, dlaczego nie należy otwierać nowego okna (standardowo bowiem kliknięcie odnośnika otwiera stronę zastępując nią aktualną zawartość przeglądarki). Każde inne zachowanie, niezgodne z oczekiwaniami użytkownika sprawia, że nie czuje on się pewnie w czasie przeglądania twojej strony.
Bardzo złą praktyką jest także przedefiniowanie zachowania elementów radio button i checkbox. Dla przykładu pole radio powinny być używane do wyboru jednej z wielu opcji, a akcja dotycząca tego pola powinna się odbyć dopiero po wysłaniu formularza. Niestety można spotkać strony, gdzie pole radio jest używane jak przycisk (wywołuje określoną akcję natychmiast po wybraniu pola). To sprawia, że taki interfejs jest trudny w użytkowaniu.
Użytkownicy chcą wiedzieć, kto odpowiada za informacje podawane na stronie. Biografia i zdjęcia autorów pomagają stać się stronie mniej anonimową i wzmacniają zaufanie do informacji na niej podawanych. Na przykład pod artykułem na stronie powinien znajdować się odnośnik do biografii autora, a także innych artykułów tego samego autora, zamiast odnośnika mailto:. Użytkownicy częściej chcą wiedzieć coś o autorze niż kontaktować się z anonimową osobą. Adres kontaktowy powinien być częścią informacji o autorze. Zachowanie odnośnika, który otwiera program pocztowy zamiast nową stronę także nie należy do standardów i zmniejsza użyteczność strony.
Stare informacje to często dobre informacje i mogą być użyteczne dla czytelnika. Trzymanie na serwerze starszych informacji nie jest drogie, a mogą one być bardzo wartościowe dla niektórych użytkowników. Szacunkowo utrzymanie archiwum to około 10% kosztów utrzymania strony, a wpływa na wzrost użyteczności nawet o 50%.
Za każdym razem, kiedy przenosisz stronę sprawiasz, że odnośniki z innych stron do niej stają się bezużyteczne. Dlaczego zatem postępujesz tak z ludźmi, którzy polecają cię i zapewniają ci darmowych klientów.
Tytuł "strona domowa" niewiele mówi o zawartości strony. To zwykle po tytułach i opisach użytkownicy docierają do strony poprzez wyszukiwarkę. Warto więc dla poszczególnych stron zapewnić tytuły, które mówią o zawartości strony.
Internet jest zalany rozmaitymi stronami, które pomimo żadnej zawartości promują się na wybrane słowa kluczowe. To może przynieść niewielką korzyść, ale najczęściej złości czytelników. Poza tym dziś modne słowo wpisywane w wyszukiwarce nie będzie modne stale. Co miesiąc pojawiają się nowe słowa... nie warto na to marnować czasu i tracić na użyteczności swojej strony.
To wbrew pozorom jeden z najczęstszych błędów. Jeśli zatem nie możesz przenieść strony na szybszy serwer, ogranicz jej wielkość poprzez ograniczenie wielkości obrazków, zaprzestanie używania niepotrzebnych skryptów i DHTMLa.
Użytkownicy nauczyli się nie zwracać uwagi na reklamy w sieci. Niestety nie zwracają też uwagi na elementy strony, które przypominają reklamę. Kiedy ignorujemy coś, nie zwracamy uwagi, co to tak naprawdę jest. Dlatego lepiej unikać wszystkiego, co przypomina reklamę. Użytkownicy doskonale wiedzą, jak ignorować bannery, animacje reklamowe, a także jak zamykać wyskakujące okienka reklamowe.
W sklepach internetowych dla klienta cena jest jedną z najważniejszych informacji. Należy ją umieszczać także przy produktach na stronach kategorii oraz w wynikach wyszukiwania.
Użyteczna wyszukiwarka powinna uwzględniać szukanie po fragmencie słowa, ale także popełnione przez użytkownika literówki, błędną pisownię słowa, brak polskich znaków, czy brak znaków specjalnych. Ponadto wyszukiwarka powinna podawać wyniki zależne od ich ważności, a nie tylko i wyłącznie występowania danego słowa, czy frazy.
Użytkownicy nienawidzą przewijać stron od lewej do prawej. Pionowe przewijanie wydaje się w porządku - może dlatego, że często występuje. Wiele stron jest zoptymalizowanych dla długości poziomej 805 pikseli, co sprawia, że w rozdzielczości 800x600 pojawia się pasek przewijania poziomego, mimo że nie służy do przewijania strony.
Często ustalany jest bardzo mały rozmiar czcionki i nie pozwala się użytkownikowi go zmienić. Problem rośnie wraz z upowszechnianiem się arkuszy stylów.
Inaczej pisze się na potrzeby www, a inaczej do druku. Pisząc tekst na stronę www należy częściej niż w zwykłych tekstach używać nagłówków, list, pogrubionych słów. Pisz krótkimi akapitami, językiem użytkownika. Pamiętaj, by treść była na zasadzie odwróconej piramidy: na początku ogólne informacje, potem coraz bardziej szczegółowe.
Użytkownicy oczekują, że wybranie odnośnika otworzy im stronę, do której odnośnik prowadzi. Każde inne zachowanie odnośnika może sprawić, że będą czuć się zagubieni na twojej stronie. W szczególności jeśli użytkownik chciałby otworzyć stronę w nowym oknie może zrobić to sam - nie wyręczaj go.
FAQ, czyli w tłumaczeniu często (wielokrotnie, licznie) występujące pytania, powinno zawierać rzeczywiście pytania, które często się pojawiają, a nie pytania, które chciałaby usłyszeć firma od swoich klientów. FAQ z pytaniami, których wcale nikt nie chciałby zadać jest bezużyteczne.
Jeśli na stronie zbierasz adresy e-mail umieść też jasną informację o polityce prywatności firmy. Użytkownicy są ostrożni w podawaniu adresów e-mail. Nie oczekuj, że zapiszą się do newslettera, bo jest darmowy. Umieść informację jak często będą go otrzymywać, możesz umieścić przykładowe wydanie newslettera, a także dokładne informacje o polityce prywatności. W przeciwnym wypadku nie spodziewaj się adresów innych niż mickey@mouse.com.
Użytkownicy przy wpisywaniu adresu często robią błędy - im dłuższy adres tym więcej możliwości wpisania go błędnie. Ponadto zbyt długi adres URL staje się niewygodny do przesłania znajomym. Warto też, o ile to możliwe, pozbyć się z niego znaków specjalnych typu tylda (~).
Klikając na odnośnik użytkownik oczekuje, że otworzy mu się strona i coś przeczyta, a nie że otworzy się program pocztowy i będzie musiał pisać. Jeśli używasz odnośnika mailto: postaraj się, by był jasno oznaczony, zatem aby anchor tekst był adresem e-mail np. mickey@mouse.com.
Wiele firm używa mętnego i niejasnego języka opisując cel istnienia swojej firmy, czy przeznaczenie serwisu www.
Kiedy przenosisz zawartość części stron lub te strony do archiwum postaraj się nie zmieniać adresów URL albo przynajmniej przekierowywać stare adresy pod nowe. Inaczej odnośniki z innych stron do twoich stron stają się bezużyteczne.
Bez daty przy artykułach, informacjach, czy innej zawartości, użytkownik nie wie, czy dane te są aktualne, czy przestarzałe. Niektóre fakty, czy rekomendacje zależą bardzo mocno od dat. Na przykład, gdy informujemy o jakimś wydarzeniu lub polecamy używanie konkretnej wersji oprogramowania przez najbliższe dwa lata. Jeśli nie podamy daty użytkownik nie będzie wiedział, czy informacja jest nadal aktualna.
Dobrą praktyką jest używanie miniaturek, a także, gdy linkują one do większych zdjęć. Problemem jest natomiast tworzenie miniaturki. Jeśli tworzymy ją po prostu przez skalowanie, miniaturka zdjęcia, które ma wiele szczegółów, będzie nieczytelna i niezrozumiała. Zamiast skalowania warto najpierw odpowiednio przyciąć zdjęcie, tak by jak najwięcej mówiło o tym, czego dotyczy i co ilustruje. A dopiero potem wykonać skalowanie do pożądanego rozmiaru. Przykładowo: aby otrzymać miniaturkę o wielkości 10% pierwotnego obrazka, najpierw wytnij 32%, a potem to co wyciąłeś zmniejsz do 32%.
Wiele firm przykłada dużą wagę do dostępności strony dla niepełnosprawnych, na przykład dodając parametr ALT obrazkom. Tekst ten powinien pomóc użytkownikom, którzy nie widzą obrazków w poruszaniu się po stronie. Powinien opisywać jakie znaczenie ma obrazek dla interakcji i co użytkownik powinien wiedzieć o nim. Nie ma potrzeby szczegółowego opisywania wizualnych aspektów obrazka. Na przykład, gdy opisujemy logo firmy, które zazwyczaj prowadzi do strony głównej serwisu, nie należy objaśniać w parametrze ALT jak to logo wygląda, ale że to logo jest linkiem do strony głównej serwisu.
Porównanie i wybór - to dwa najważniejsze kroki dla większości użytkowników. Witryny jednak nie wspierają takiego postępowania. Wybierając przykładowo wycieczkę z katalogu, wybieramy daty, miejsce, ilość osób itd. i dopiero po zatwierdzeniu otrzymujemy informację o cenie. A co jeśli chcielibyśmy zmienić jedną z dat? Często musielibyśmy od początku wypełniać formularz, gubiąc poprzednio zdobyte informacje. Co jeśli kupując komputer i ustalając poszczególne parametry w kilku krokach, chcielibyśmy sprawdzić jak wpłynie na cenę wielkość twardego dysku? Czy możliwe jest porównanie cen bez utraty poprzednio zdobytych informacji? Niektóre strony udostępniają możliwość wyboru produktów i porównanie ich w tabeli, ale często taka tabela ma niską użyteczność i nie podkreśla najważniejszych różnic między produktami.
Obecnie sklepy internetowe oferują wiele rozmaitych produktów. Ich lista na stronie może być bardzo długa. Jedna z głównych wytycznych użyteczności mówi o tym, by dać użytkownikowi możliwość przesiania takiej listy informacji, tak by mógł on określić dodatkowe parametry i atrybuty, po których lista będzie filtrowana.
Strony oferujące wiele pozycji powinny zapewnić możliwość sortowania i filtrowania ich. Wiele stron niestety pozwala sortować pozycje po marce. Wspieraj sortowanie po atrybutach, którymi zainteresowani są klienci. Warto zainteresować się w tym celu ich opinią.
Pozwól użytkownikom stosować format danych jaki oni preferują. Ograniczaj w tym celu ilość pól formularza. Z dwóch pól: imię oraz nazwisko, możesz stworzyć jedno imię i nazwisko, gdyż o wiele szybciej napisać imię wraz z nazwiskiem w jednym polu. Nie wymuszaj na użytkowniku konkretnego formatu danych. Często występuje nakaz wpisania numeru karty kredytowej w postaci ciągu liczb. Pozwól użytkownikom stosować spacje lub inne znaki przestankowe, które zapobiegają błędom przy wpisywaniu numeru.
Nie umieszczaj na stronie odnośników, które linkują do aktualnie przeglądanej strony. Gdy użytkownik kliknie taki link poczuje, że marnuje czas, może pogubić się i nie wiedzieć, gdzie obecnie się znajduje, zwłaszcza gdy podążając za takim linkiem strona przewinie się do góry. Jeśli użytkownik jest na podstronie z menu możesz w menu zlikwidować odnośnik i podświetlić pozostały tekst, tak by użytkownik wiedział, gdzie jest obecnie.
Często ustalany jest bardzo mały rozmiar czcionki i niewielki kontrast kolorystyczny, co sprawia że stronę trudno się czyta, zwłaszcza, gdy nie ma możliwości powiększenia liter lub podmiany arkusza stylów.
Zachowaj spójność w oznaczaniu linków. Używaj podkreśleń tylko i wyłącznie dla linków. Zachowaj rozróżnienie linków odwiedzonych i nieodwiedzonych. Wyjaśnij co znajduje się po drugiej stronie linku, formułuj linki opisowo zamiast "kliknij tutaj" - pomoże to zarówno twoim czytelnikom, jak i tobie w promowaniu strony w wyszukiwarkach. Unikaj Javascriptu i przedefiniowywania standardowej interakcji linku. Nie otwieraj linków w nowym oknie (chyba że dotyczy to plików PDF itp.).
Pomimo dobrych intencji większość zastosowań flash'a na stronach www bez wyraźnego powodu nie jest użyteczna. Nie używaj flasha aby sprawić, by twoja strona była ciekawa i dynamiczna. Jeśli jest nudna - przeredaguj zawartość czyniąc ją ciekawszą, zatrudnij fotografa, by wykonał lepsze zdjęcia. Nie dodawaj ruchu na stronie. To nie polepsza uwagi użytkownika, raczej go odpycha. Większość ludzi animowaną zawartość zalicza do treści bezużytecznej. Używanie flash'a do nawigacji jest tak samo złe. Użytkownicy wolą przewidywalne linki i statyczne menu, niż dziwnie zachowującą się animację.
Pisanie dla strony internetowej wymaga krótkich, konkretnych tekstów, podzielonych na akapity, tak by łatwo je było skanować wzrokiem. Zawartość powinna odpowiadać na podstawowe pytania użytkownika i być pisana jego językiem.
Wszystkie inne punkty tej listy łatwo zastosować, ale stworzenie dobrej wyszukiwarki wymaga czasu i inwestycji w lepsze oprogramowanie. Gra jest warta świeczki, bo wyszukiwarka jest podstawowym komponentem dużej witryny internetowej i z roku na rok staje się ważniejsza. Dlatego warto zainwestować w użyteczną wyszukiwarkę uwzględniającą błędnie wprowadzane słowa i podającą wyniki zależne od ich ważności, a nie występowania danego słowa lub frazy.
Nie odrzucaj użytkowników tylko z tego powodu, że używają innej przeglądarki, niż ta dla której przygotowałeś witrynę. Stwórz swoją stronę według standardów i dochowaj staranności, by była kompatybilna z różnymi przeglądarkami.
Formularze używane są zbyt często i są zbyt długie. Nie zadawaj niepotrzebnych pytań i nie dodawaj nadmiernych opcji. Usuń pytania, które są zbędne. Ogranicz ilość pól obowiązkowych do tych, które rzeczywiście takimi są. Wspieraj autouzupełnianie poprzez unikanie niestandardowych pól (używaj mail, adres itd.). Ustaw kursor na pierwszym polu, kiedy formularz jest włączany. To zaoszczędzi klikania. Nie wymuszaj na użytkownikach konkretnego formatu danych.
Mimo że numer telefonu czy adres e-mail są najbardziej pożądanymi formami kontaktu, podanie adresu korespondencyjnego na stronie może być ważniejsze, bo jest jednym z czynników uwiarygodniających. Czy firma bez adresu jest firmą, której chciałbyś dać pieniądze? Warto też umieścić trochę informacji o firmie, to wzmacnia wiarygodność.
Layout o stałej szerokości sprawia, że na dużych monitorach strona będzie niewielka i trudna w nawigacji, i do czytania, podczas gdy przy niewielkiej rozdzielczości będzie wymagała przewijania poziomego. Ponadto przy wydruku może się okazać, że prawa część strony nie została wydrukowana. Bardzo złą praktyką jest ponadto ustalanie stałej szerokości i wysokości strony przy wyświetlaniu informacji w okienkach pop-up. Jeśli już musisz ich użyć, nie zmuszaj użytkownika, by czytał przez judasza, daj mu chociaż możliwość rozszerzania nowego okna.
Jedną z użytecznych rzeczy jakie firmy oferują swoim klientom to możliwość powiększenia i zbliżeń zdjęć produktów. Obejrzenie detali czy tekstur produktu może dać potencjalnemu nabywcy pewność, że chce go zamówić. To zadowalające, że większość stron daje taką możliwość, jednak na wielu jest to źle zaimplementowane. Największym błędem jest, gdy użytkownik klika przycisk "powiększ zdjęcie" i strona wyświetla po prostu to samo zdjęcie. Drugim błędem jest możliwość powiększenia, ale tylko fragmentu zdjęcia. Kiedy użytkownik prosi o duże zdjęcie - pokaż mu duże zdjęcie. Zazwyczaj najlepiej zaoferować użytkownikowi powiększenie zdjęcia, które wypełni cały ekran.