Nawigacja przy użyciu klawiatury w nowoczesnych przeglądarkach

W poprzednim wpisie pisałem o problemach z tabindex i Safari. Problem polegał na tym, że Safari ignorowało tabindex i po wciśnięciu klawisza tabulacji kursor przeskakiwał do formularza wyszukiwania.

Po krótkim przeglądzie opcji tej przeglądarki trafiłem na ciekawy ficzer.

zrzut ekranu przedstawiający okno zaawansowanych opcji przeglądarki Safari

zrzut ekranu przedstawiający okno zaawansowanych opcji przeglądarki Safari z zaznaczoną opcją podświetlania wszystkich elementów na stronie

Safari pozwala by to użytkownik zdecydował co stanie się po wciśnięciu klawisza tabulacji. Dostępne są dwie opcje. W pierwszej opcji naciskając klawisz tabulacji będziemy przeskakiwać po linkach, kontrolkach, polach formularza w kolejności w jakiej zaprojektował to autor strony przy użyciu tabindex, jeśli tego nie zrobił to w kolejności wystąpień linków w kodzie.

Nie oszukujmy się, przerażająca większość projektantów strona internetowych nie ma pojęcia o projektowaniu stron bez użycia tabel (table) a co dopiero o projektowaniu użytecznego interfejsu strony www. A jeśli już spróbują napisać coś w miarę bez użycia tabel to powstaje divowy koszmar… (np. chip.pl). Na pytanie o tabindex pewnie by odpowiedzieli: Nowa nazwa Visty?

Z związku z powyższym dla większości witryn najlepsza będzie druga opcja. W opcji tej po naciśnięciu klawisza tabulacji przeglądarka ignoruje zaprojektowaną przez webmastera kolejność nawigacji i przechodzi do pierwszej napotkanej kontrolki, pola tekstowego itp. (checkbox, input, textarea) pomijając linki (a).

Niezależnie od tego, którą opcje wybierzemy, można szybko przełączyć się do drugiej przytrzymując klawisz option i wciskając klawisz tabulacji.

Prawda że przydatne? Postanowiłem sprawdzić czy inne przeglądarki maja podobne udogodnienia. By było trudniej, sprawdzałem na stronie zawierającej ramki, ponieważ nadal w sieci można spotkać strony używające właśnie takiej konstrukcji, nawet gdy jest to niepotrzebne…

Sprawdziłem w helpach przeglądarek jakie skróty oferują i odwiedziłem wcześniej przygotowaną stronę testową.

Firefox 1.5.0.6 Tiger

  1. zaznaczył ramkę menu
  2. link 1
  3. search 1
  4. link 2
  5. zaznaczył ramkę content
  6. link 3
  7. search 2
  8. link 4
  9. przechodzi do URL

Opera 9.01 Tiger

  1. search 2 (nie wychodzi z zawartości strony, łapie pętle)

Opera po za możliwością nawigacji przy użyciu klawisza tabulacji, po wciśnięciu klawisza shift umożliwia nawigację za pomocą strzałek. Umożliwia to dotarcie do wszystkich linków, zarówno w ramce menu jak i content.

Safari 2.0.4 (419.3) Tiger

Z wyłączoną opcją zaznaczania wszystkich elementów na stronie, kolejność była następująca:

  1. search 1
  2. search 2
  3. przechodzi do URL

Z włączoną opcją zaznaczania wszystkich elementów na stronie:

  1. link 1
  2. search 1
  3. link 2
  4. link 3
  5. search 2
  6. link 4
  7. przechodzi do URL

Konqueror 3.5.3 Gentoo

  1. zaznaczył ramkę menu
  2. link 1
  3. search 1
  4. link 2
  5. zaznaczył ramkę content
  6. link 3
  7. search 2
  8. link 4
  9. search 2
  10. link 4
  11. zaznaczył ramkę content
  12. link 3
  13. search 2
  14. link 4
  15. przechodzi do ramki menu i powtarza wszystko od nowa

Podsumowanie

Zarówno Safari jak i Opera podczas nawigacji, tylko przy użyciu klawiatury, dają użytkownikowi możliwość pomijania wszystkich linków na stronie i przeskoczenia do formularza. Jest to bardzo przydatne kiedy potrzebujemy szybko dostać się np. do pola wyszukiwarki na odwiedzanej stronie.

Moim faworytem jest rozwiązanie z Safari, jest proste i intuicyjne. Jednakże sposób w jaki nawigacja przy pomocy shifta i strzałek została rozwiązana w Operze jest godna uwagi zwłaszcza, że konkurencja nie oferuje takich możliwości.

Co gorsza Konqueror skacze po linkach w tylko sobie znanej kolejności, a przeglądarka Camino nie pozwala zaznaczyć nic innego po za elementami formularzy.

Chyba, że są jakieś skróty klawiaturowe o których nie wiem, ani w pomocy przeglądarki ani na stronie nie znalazłem nic interesującego.

  • Friday, 11 August 2006
  • 3,084 views