Perfection or Vanity

Project: Terminated

Blog nie jest już dalej prowadzony ani aktualizowany. Mimo tego, wpisy i komentarze są dalej dostępne. Możesz przeczytać pożegnalny wpis albo przejść do archiwum.

"Kliknij tutaj" - zaraza Internetu

28 maja 2005

Dla więszości ludzi zaznajamiających się z nowoczesnymi stronami jest to rzecz oczywista, jednak chciałbym ją poruszyć. Mowa oczywiście o linkach konstruowanych z myślą "Piszę tekst, potem ma być link, to bach. Będzie po zdaniu i w ten sposób". Jest to typowy przykład nieumiejętności myślenia strukturalnego, ale właśnie przezwyciężenie tej słabości jest pierwszym krokiem do lepszego zrozumienia budowania nowoczesnych stron.

Internet jest bardzo duży, to wie każdy. Nie każdy jednak zastanawia się, jak dużo ludzi chce przejrzeć stronę dosyć szybko, nie tracąc na nią za dużo czasu. Stosując linki "Kliknij tutaj" sprawiasz, że użytkownik musi szukać wokoło opisu tego hiperłącza. Wystarczy, że przeszukasz sieć i zobaczysz jak nagminna jest ta technika. U mnie "Results 1 - 10 of about 1,030,000,000 for «click here»"

Gdy natomiast zastosujesz technikę wyróżniania słów kluczowych, problem zniknie. Człowiek przeglądający stronę omiecie ją wzrokiem i zatrzyma się na nich właśnie. Tekst

Umieściłem nową wersję programu, którą można pobrać pod tą lokacją

jest karygodny. Należy zaznaczyć słowem kluczowym co człowiek może ściągnąć a nie skąd. Napiszmy:

Umieściłem nową wersję programu, którą można pobrać pod tą lokacją

a będzie znacznie lepiej. Że jak? Że końcowa część zdania jest bez sensu? Właśnie, że nie jest. Lokacja odnosi się do tego samego zdania i pasuje bardzo dobrze. Jeśli to zrozumiesz, zaczniesz myśleć konstruktywnie.

Oczywiście nie należy przesadzać z ilością słów kluczowych. Tak na marginesie: widzisz, jak zaznaczyłem link w tym zdaniu? Przesadzanie powoduje, że efekt może być odwrotny - nie powinno się podawać, na przykład linków do tematu forum, razem z linkiem do strony głównej. Nikt nie jest aż tak beznadziejny, żeby nie umiał klikąć sobie "Strona główna". Czyli poprawnie:

Skorzystaj z opisu jak naprawić ten błąd na forum mozillapl.org

Na koniec dodam jeszcze, że linki muszą być wyraźne. Jeśli wyłączono podkreślenie, powinny zostać pogrubione. Kolor powinien być charakterystyczny, odmienny od tekstu. Dobrze jest to opisane w książce "Wgłąb dostępności". Nigdy nie licz, że ktoś będzie się domyślał czy dany tekst jest linkiem, nakierowując na niego kursor myszy.

Tagi wpisu:

Informacje i hiperłącza

To ja! Piotr Petrus 'Riddle'

Blog o projektowaniu zgodnych ze standardami stron internetowych.

Praktyczne przykłady, sztuczki CSS, sposoby obchodzenia błędów przeglądarek, lekki i nieinwazyjny JavaScript, użyteczny design, dostępność i skrypty użytkownika.

RSS

Informacje o wpisie

Napisał riddle 28 maja 2005 o 13:26

Kategorie: Dostępność, Użyteczność

Dodaj do:

Wpisy archiwalne

Archiwum miesięczne

Dzięki!

Dodaj bloga do Technorati Favorites Dodaj bloga do Del.icio.us Blog należy do sieci 10przykazań.com

Komentarze

  1. Nerf 1 28 maja 2005, 14:00

    Nie „Umieściłem <a>nową wersję programu</a>, którą można pobrać pod tą lokacją”, tylko „Umieściłem (zamieściłem) <a>nową wersję programu</a>”. Pisanie „którą można pobrać pod tą lokacją” jest bez sensu, bo jeśli odnośnik nazywa się „nowa wersja programu”, to w zasadzie wiadomo, że można ją stamtąd pobrać. Inna sprawa, że czytelnik przyzwyczajony do „kliknij tutaj” może być zdezorientowany i jeśli ktoś chce zachować kompatybilność wstecz, to ma to jakiś sens. Osobiście wychodzę z założenia, że dobry tekst to taki, który po wydrukowaniu nie traci znaczenia - więc „którą można pobrać pod tą lokacją” musi zniknąć.

    I nie „ten błąd na <a>forum mozillapl.org</a>”, tylko „ten <a>błąd na forum mozillapl.org</a>” - nazwy linków powinny, w miarę możliwości, opisywać ich zawartość, gdy są wyrwane z kontekstu.

  2. riddle 2 28 maja 2005, 14:28

    Nie byłbym taki pewny, ale może masz rację. W drugim przypadku jak chcesz zawrzeć słowo "błąd" to powinno być ten <a>błąd na forum</a> mozillapl.org”. Poza tym mam dwie sprawy:

    1) Chodzi o konteksy a nie wyrwane zdania. Wcześniej ten błąd na pewno był opisywany.
    2) *Twierdzisz* jakbyś był guru. Troszkę lżej proszę, postawa "ja wiem lepiej" bardzo mnie wkurza, oj bardzo. Lepiej coś powiedzieć pośrednio.

  3. Łukasz Grabuń 3 28 maja 2005, 15:27

    Zupełnie na marginesie i nie na temat: Opera nie wczytuje Twojego CSS; brak jest slasha na początku. Poza tym połączenie klas <code>code</code> i <code>strike</code> daje bardzo mało kontrastowy tekst w stylu graveyard.

    A artykuł Marka tyczył się nie tyle samych linków, co atrybutu (?) <code>title</code>. Którego - nota bene - w ogóle nie używasz ;->

  4. Łukasz Grabuń 4 28 maja 2005, 15:28

    Przepraszam za śmieci w komentarzu.

  5. Łukasz Grabuń 5 28 maja 2005, 15:31

    Gwoli uściślenia: Mark wyraźnie pisze o tym, że chodzi mu atrybut title w książce, do której odnośnik podałeś. Dokładnie tu: http://mimas.ceti.pl/dia/day_14.html

  6. Nerf 6 28 maja 2005, 15:51

    ad. 1
    Jeśli chodzi tylko o konteksty, to w takim razie stosowanie „kliknij tutaj” również nie powinno być wyklęte. Przecież chodzi właśnie o to, żeby nie było tak, „że użytkownik musi szukać wokoło opisu tego hiperłącza”. Poza tym AFAIK niektóre przeglądarki (np. screenreadery) robią listy linków na stronie i w tym wypadku użytkownik nie ma kontekstu dokoła, więc lepiej jak zamiast „forum mozillapl.org” przeczyta „błąd na forum mozillapl.org”. Także nie bardzo rozumiem, czemu obcinać „mozillapl.org” zostawiając „błąd na forum”. Faktem jest, że ludzie zwykle unikają długich nazw linków, co jest zapewne spowodowane jakimś intuicyjnym strachem przed rozrzutnością. Tyle że w tym wypadku nie ma to zastosowania.

    ad. 2
    Rozumiem, że chodzi głównie o to, że w miejsce „Nie” nie napisałem np. „Lepiej byłoby zamiast”. Faktycznie, może to irytować :).
    Oczywiście nie twierdzę, że jestem guru technologicznym, ale akurat w tych sprawach mam jednoznaczny pogląd i gdybym używał słów takich jak „raczej”, „chyba”, „zapewne”, sugerowałbym, że nie jestem pewien tego, co piszę. A tak nie jest. Poza tym forma oznajmująca była obecna również w samym wpisie, toteż zastosowałem się do niej ;).

  7. riddle 7 28 maja 2005, 19:24

    Okej, obywdu panów rozumiem, nie gniewam się (jak się podpasowało) i postaram się bardziej uważać. Tylko nadal nie wiem po co mi tytuły linków. Na razie poprzestaję na rozrzutnych opisach alt i longdesc obrazków. :)

    I co z tym CSSem? :/ Czyżby Opera miała problemy z ciastkami? Jeśli tak, to proszę wykasować ciacha i korzystać z umiejętności Operki do zapamiętywania stylu. :)

  8. Łukasz Grabuń 8 28 maja 2005, 19:43

    O tytułach bardzo proszę tutaj:
    http://www.useit.com/alertbox/980111.html

    Ojej, ale malutkie to textarea :-)

  9. riddle 9 28 maja 2005, 19:45

    Przyszedł specjalista i się czepia no... ;)
    ... Tak wiem, że malutkie, ale naprawdę nie mam aktualnie czasu na poprawki dal Opery :( Dodam ten backslash żeby brało CSS absolutnie z serwera, ale zważ, że teraz też jest ok. W katalogu głównym od razu jest custom/riddle ....

  10. Łukasz Grabuń 10 28 maja 2005, 20:09

    Zapomniałem dodać, że po skasowaniu ciastka w Operze wszystko jest faktycznie OK. :-P

  11. Nerf 11 29 maja 2005, 17:36

    Jako uzupełnienie moich uwag podam może link do pewnego mojego wpisu: http://nerf.jogger.pl/comment.php?eid=120332 .

  12. riddle 12 29 maja 2005, 17:40

    Może masz rację, ale widzę, że używasz kolego bardzo małej czcionki, zmieniasz kursor na linkiem a to nie jest zbyt zgodne ze standardem W3C - WAI Level 1 :)

  13. Nerf 13 29 maja 2005, 20:09

    Co do czcionki: u mnie co prawda czcionka nie jest ona bardzo mała, ale w rozdzielczości 1024x768 na monitorze 17", której to konfiguracji używam, jeden piksel jest równoważny 0,33734375mm, podczas gdy W3C podaje, że jeden piksel dla odległości od monitora równej długości ramienia powinien mieć 0,28mm, czyli na standardowych wyświetlaczach czcionka będzie aż o prawie 17% mniejsza. Zwiększyłem zatem rozmiary czcionek o 20,48% i jestem już zgodny z WAI.
    (MSPANC)

    Co do kursora: jakoś nie udało mi się nigdzie wyczytać, że jest to niezgodne z WAI.

    A link podałem raczej jako przykład tego, że może jednak nie mam racji, bo W3C też się nie stosuje do tego, co napisałem :).

  14. riddle 14 29 maja 2005, 20:11

    Okej, okej :P .... widzę, że profesjonalista :P

  15. mleczarz 15 04 października 2005, 17:12

    Results 1 - 10 of about 2,410,000,000.
    Mam nadzieję, że to nie szybkość zmian, tylko jakiś błąd powoduje tę różnicę.

  16. Patrys 16 15 października 2005, 19:12

    Nie bij, ale teraz zauważyłem odnośnie książki - co jest z tym głąbem i co on mi może powiedzieć o dostępności? ;>

  17. olaf 17 20 lutego 2006, 03:14

    Dzięki za wpis. Wykorzystam jeszcze dziś.

  18. ksi 18 26 lipca 2007, 14:36

    kurde w ogole nie wiem o co tu chodzi, chybam sie muszem wiele nauczyc jeszcze ;)

Dodaj komentarz

Do formatowania komentarzy używaj Textile (HTML nie działa). Szczególnie jeśli wklejasz większe fragmenty kodu. W razie niepewności użyj podglądu komentarza.

Wypowiedzi obraźliwe, infantylne oraz nie na temat będą moderowane – pisząc postaraj się zwiększyć wartość dyskusji.

Komentarze nie służą do wysyłania wiadomości albo informowania o błędach, itd. Chcesz coś mi napisać – skontaktuj się.