Odnośniki

Odnośniki, zwane także linkami, są kwintesencją funkcjonalności stron internetowych. Chociaż przyzwyczailiśmy się do ich istnienia, znamy zasady jakimi się rządzą, nie powinniśmy zapominać o kilku prostych regułach. Ich stosowanie zapewni nam lepszy odbiór strony przez użytkownika. To on czyta naszą stronę, to on z niej korzysta i robi to bo chce. Dlatego powinniśmy mu to zadanie ułatwiać, aby chciał więcej lub (o zgrozo) musiał chcieć.

Użyteczność odnośników

1. Upewnij się czy obszar klikania nie jest zbyt mały.

Próba trafienia i kliknięcia w obszar jednego piksela jest trudna do zrealizowania. Taki link z założenia nie jest użyteczny. Równie ciężko jest kliknąć w literę alfabetu I czy l (np w liście typu: a, b, c, d, … ,i , … z) przy, załóżmy, foncie o wielkości 10px. Odnośniki tego typu powinny mieć dodane odpowiednie odstępy wewnętrzne (padding: 1px 2px czy padding: 2px 4px).

Trzeba zapewnić także bezpieczną odległość pomiędzy sąsiadującymi linkami. Próba wyboru odnośnika X nie może skończyć się wyborem odnośnika Y.

2. Nie dodawaj graficznych usprawnień w przypadku najazdu kursorem na odnośnik.

Popularna chmurka (tooltip), czyli tekst wyświetlający się automatycznie po najechaniu na link w zupełności wystarcza. Dozwolone są oczywiście lekkie zmiany graficzne oparte o CSS, jednak stosowanie rozbudowanych upiększaczy zamiast systemowej chmurki nie jest zalecane. Dodatkowa potrzeba stosowania mechanizmów javascript, zwiększenie objętości grafiki, każdorazowe pojawianie się czegoś dużego, migającego, nietypowego może rozdrażnić użytkownika i zniechęcić do ponownych odwiedzin naszego serwisu.

3. Nie wymuszaj na użytkowniku otwarcia odnośnika w nowym oknie.

Docelowa zawartość każdego standardowego odnośnika może być uruchomiana zarówno w nowym jak i obecnym oknie (zakładce). Przy czym otwarcie w obecnym oknie (zakładce) jest opcją domyślną, a otwarcie w nowym oknie (zakładce) następuje podczas jednoczesnego przytrzymania klawisza CTRL (CMD) i kliknięcia. Na ogół 99% użytkowników zna tę zasadę, a jej zmiana wywołuje u nich frustrację. Pamiętajmy, że to użytkownik jest odpowiedzialny za wybór pomiędzy obecnym, a nowym oknem.

4. Odnośnik powinien kierować do docelowej wersji strony.

W przypadku gdy istnieje potrzeba zamieszczenia odnośnika do strony X, a strona ta jest kopią, bądź przekierowaniem do strony Y, powinniśmy użyć odnośnika bezpośrednio do strony Y. Mam tu na myśli szczególnie mechanizmy skracania linków typu TinyUrl. Zawsze istnieje prawdopodobieństwo, że TinyUrl nie zadziała prawidłowo, a nasz użytkownik trafi w inne niż żądane miejsce… http://tinyurl.com/2zked8

5. Wyróżnij graficznie odnośnik

Odnośnik, który się wyróżnia jest lepiej postrzegany przez użytkownika. Możemy użyć innego koloru tekstu, możemy również zastosować podkreślenie. Warto zaznaczyć, że podkreślenie i kolor niebieski odnośnika są opcjami standardowymi i jesteśmy do nich już przyzwyczajeni. Nie oznacza to, że wszystkie odnośniki mają być niebieskie i podkreślone, jednak nie można używać niebieskiego koloru i podkreślać tekstu, który odnośnikiem nie jest. Dobrą praktyką jest wyróżnienie stanów odnośnika: odwiedzony oraz nieodwiedzony.

6. Nie używaj odnośników “kliknij tutaj”.

Zdanie “Zapoznaj się z naszą nową ofertą” brzmi i wygląda lepiej niż “Nowa oferta dostępna tutaj“. Zasada działa podobnie w drugą stronę. Nikt nie wpisuje w wyszukiwarce Google telewizory tutaj, wpisujemy raczej telewizory nowa oferta.

Niniejszy artykuł był inspirowany artykułami:


  • Sobee 2008-02-06 11:41:52

    Bardzo ciekawy artykuł.
    Wydaje się to oczywiste, ale zdarza się, że sie zapominamy…

    Mam taką jedną stroną w swojej historii czytania internetu,
    na którą nigdy nie wszedłem, bo nie potrafiłem ustrzelić linku z takiej strony startowej/okładki/pierwszej/powitalnej…

    Pozdro z WhiteStocku

  • GalAnonim 2008-02-06 17:22:04

    Piękny artykuł, mam wrażanie, że nawet praca doktorska o linkach nie jest w stanie dotrzeć do osób, które powinny być osobami zainteresowanymi.
    Dzięki poprzedniemu komentarzowi jednak zdałem sobie sprawe w czym tkwi problem, artukuł powinien być napisany nie po polsku lecz bełkotem polsko-angielskim. :) Artykuł w języku agnielskim także by się nie przyjął, gdyż niewielu w polsce potrafiło by zrozumieć menu restauracji Mc’Donalds w kraju anglojęzycznym, o zamówieniu jakiegoś jedzenia nie ma mowy :)
    Jedno co chciałem Ci przekazać " GŁOWĄ MURU NIE PRZEBIJESZ"!!!
    Aby reszta zrozumiała " TWOJĄ HEAD NIE DESTROINIESZ ŻADNEGO WALLA"
    :D
    Pozdrawiam i życzę większej ilości czytelników posługujących się językiem polskim w stopniu zaawansowanym, wielkie możliwości - uczniowie szkół, a nawet niektóre przedszkolaki :)

  • Gosia Zychalska 2008-02-06 23:14:14

    Nie do końca zgadzam się z punktem nr 3. Piszesz, że 99% użytkowników zna zasadę z przytrzymaniem ctrl w celu otwarcia strony w nowym oknie. Nie uważam się za laika w kwestii Internetu, komputerów itp., a mimo to nie znałam tej zasady. I jestem przekonana, że masa ludzi jej nie zna. Poza tym osobiście wolę, gdy strona np. z wnioskiem do wypełnienia otwiera się w nowej zakładce. Do Twojego punktu widzenia przekonuje mnie jedynie fakt, że ludzie lubią mieć wybór nawet w tak prozaicznej kwestii, jak otwarcie strony w obecnym czy nowym oknie. I tu trzeba pójść na kompromis. Wspomniany przeze mnie wniosek (i inne tego typu dokumenty) powinien otwierać się w nowym oknie, natomiast pozostałe strony w tym samym (co jest zresztą naturalne). W serwisie firmy X tak właśnie robię:]

  • Smoku 2008-02-08 23:42:34

    Zgadzam się z Gosią, że nie każdy użytkownik, szczególnie ten początkujący wie o tym, że link w nowym oknie/zakładce (w zależności od przeglądarki) otwiera sie przytrzymując Ctrl. Ludzie za to bardzo szybko uczą się, że można kliknąć na linku prawym przyciskiem i wybrać otwórz w nowym oknie/zakładce.

    Nie zgadzam się z Gosią w tym, że przykładowe wnioski (i inne tego typu dokumenty) powinny być otwierane w nowym oknie/zakładce. Jestem zdania, że takie elementy powinny być publikowane w ten sposób, że kliknięcie w odnośnik powinno wymuszać ściągnięcie i zapisanie tego dokumentu (np. jako PDF lub lepiej ODF) na dysk użytkownika.

    Jestem przy tym gorącym zwolennikiem ODF. Moim zdaniem PDF-y to zło na które musimy się godzić. To, że takie dokumenty (szczególnie PDF-y) uruchamiane są w oknie przeglądarki to pomyłka. Nie dość, że jest to dużo bardziej zasobożerne, niż otwarcie dokumentu uprzednio zapisanego na dysku, to dodatkowo, rzadko który developer optymalizuje PDF-y pod sieć www (mało który wie, że taka opcja w ogóle istnieje).

  • Gosia Zychalska 2008-02-11 22:46:11

    Cieszę się Smoku, że nie zgadzasz się ze mną w tej kwestii :) Mam teraz dużą motywację, aby udowodnić mój punkt widzenia ;)

    Zacznę od tych nieszczęsnych PDF’ów. Jeżeli wrzucam na stronę PDF’y, to "każę" im otwierać się w nowym oknie. Dlaczego? Ponieważ to nie jest integralna część strony, lecz zamieszczony na niej dodatkowy dokument. Osobiście nie życzę sobie, aby przeglądarka wymuszała na mnie zapisywanie na dysku jakichkolwiek treści.

    Sprawa nr 2 - są strony, których otwieranie w nowym oknie eliminuje problem np. zbyt rozbudowanego menu. Podam konkretny przykład: serwis ING Banku Śląskiego. Z kart kredytowych rozwiń proszę "Promocja - 50 zł piechotą nie chodzi!" Jest to strona promocyjna, która otwiera się w nowym oknie. Ma ona ponad kilkanaście zakładek w menu. Takich stron promocyjnych Bank ma więcej. Gdyby wszystkie miały otwierać się w tym samym oknie, powstałoby menu długie jak stąd dotąd (wtajemniczeni wiedza o co chodzi ;)). Przy serwisie, który ma ponad 2 tys. stron, trzeba iść na ustępstwa i kompromisy (jak choćby nawet ukryte zakładki w menu, przykład: Pakiety ubezpieczeniowe - kliknij którykolwiek z pakietów). Oczywiście idealnie jest, gdy wszystkie treści na stronach znajdują swoją pozycję w menu. Niestety nie zawsze jest to możliwe.

    Z niecierpliwością czekam na Twoją kolejną wypowiedź :)

dodaj komentarz

Formularz dodawania komentarzy