V dnešní době stále více uživatelů dává přednost používání klávesnice k procházení webových stránek. Ne všichni vývojáři však tuto vlastnost berou v úvahu a vytvářejí weby, které nejsou zdaleka pohodlné pro použití bez myši. V tomto článku se podíváme na to, jak správně spravovat karty z klávesnice a učinit navigaci na webu co nejpohodlnější pro všechny uživatele.
Klávesnice navigace - je to způsob, jak procházet prvky webové stránky pomocí klávesy " Tab " a některých dalších kláves. S ní může uživatel rychle přejít na položky, které ho zajímají na stránce, a vyhnout se tak nutnosti používat myš. Klávesnice je zvláště důležitá pro lidi se zdravotním postižením, kteří nemohou používat myš nebo mají potíže s motorikou.
Je důležité si uvědomit, že každý prvek na webové stránce může být "zaostřitelný". To znamená, že může získat zaostření klávesnice a být k dispozici pro navigaci pomocí kláves "Tab" a "Shift+Tab".
Chcete-li vytvořit pohodlnou navigaci klávesnice, musíte správně označit kód stránky a přiřadit každému prvku správné pořadí zaostření. To lze provést pomocí atributů tabindex a explicitního označení zaostřovací sekvence. Je také třeba vzít v úvahu, že chování prvků na stránce se může v různých prohlížečích lišit, takže je důležité zkontrolovat navigaci na různých platformách a webových prohlížečích.
Jak spravovat karty z klávesnice
1. Pomocí klávesy " Tab " se přesunete na další interaktivní prvek. Chcete-li se vrátit k předchozí položce, můžete použít kombinaci kláves "Shift + Tab".
2. Označení zaměření. Chcete-li uživatelům pomoci určit, na které položce se nachází zaostření klávesnice, můžete použít vizuální označení, jako je změna barvy, rámečku nebo pozadí položky.
3. Nastavení správného pořadí. Ujistěte se, že jsou interaktivní prvky na stránce uspořádány ve správném pořadí, abyste sledovali přirozený tok čtení. Například tlačítko Odeslat by mělo být umístěno za všemi poli pro vyplnění formuláře.
4. K aktivaci interaktivních prvků použijte klávesu "Enter". Když je zaostření na odkazu nebo tlačítku, stisknutí klávesy "Enter" by mělo simulovat stisknutí levého tlačítka myši.
5. Poskytování informací o stavu prvků. Některé prvky, jako jsou rozevírací seznamy nebo rádiové knoflíky, mohou mít několik stavů. Ujistěte se, že uživatel získá dostatek informací pro správnou interakci s prvkem pomocí klávesnice.
6. Pomocí klávesy " Esc " zavřete vyskakovací okna. Pokud má stránka vyskakovací okna nebo vyskakovací prvky, uživatel by je měl být schopen zavřít stisknutím klávesy "Esc".
7. Kontrola dostupnosti. Zkontrolujte, zda je celá funkce stránky k dispozici pomocí klávesnice. Pohybujte se všemi interaktivními prvky z klávesnice a ujistěte se, že nic nechybí.
| Klávesa | Popis |
|---|---|
| Tab | Přesun na další položku |
| Shift + Tab | Přesun na předchozí položku |
| Enter | Aktivace interaktivního prvku |
| Esc | Uzavření vyskakovacích oken nebo prvků |
Základní principy navigace
Při používání klávesnice ke správě karet je třeba dodržovat několik základních navigačních zásad:
- Pohodlí a dostupnost. Web musí být navržen tak, aby uživatel mohl snadno najít a procházet mezi různými kartami. K tomu je důležité správně určit sekvenci tabulace a zajistit jasné zaostření prvků.
- Správné použití sémantických značek. Správné značení sémantickými značkami, jako jsou , a
- , pomáhá vytvořit logickou strukturu navigace, což usnadňuje její použití z klávesnice.
- Přehlednost a přehlednost. Je důležité poskytnout uživateli informace o aktuální aktivní kartě a jejím stavu. To lze provést pomocí vizuálních indikátorů, jako je podsvícení nebo změna barvy pozadí.
- Konzistence. Všechny karty, přepínací tlačítka a další ovládací prvky musí být implementovány s podobnými styly a chováním, aby uživatel mohl snadno pochopit, jak je používat. To zahrnuje použití obecného barevného schématu, velikosti písem a chování ostření při přepínání mezi kartami.
- Zaměření na důležitost. Důležité navigační prvky, jako je logo, hlavní nabídka nebo vyhledávání, by měly být z klávesnice dostupné kdykoli. To pomáhá uživatelům procházet web a rychle najít požadované informace.
Klávesové příkazy a jejich účel
| Klávesa | Jmenování |
|---|---|
| Tab | Přejděte na další položku na Stránce (včetně odkazů, tlačítek, formulářů atd.) |
| Shift + Tab | Přejít na předchozí položku na stránce |
| Ctrl + Tab | Přejít na další kartu v otevřeném okně prohlížeče |
| Ctrl + Shift + Tab | Přejít na předchozí kartu v otevřeném okně prohlížeče |
| Ctrl + T | Otevřít novou kartu v prohlížeči |
| Ctrl + W | Zavřít aktuální kartu v prohlížeči |
| Ctrl + Shift + T | Obnovit poslední zavřenou kartu v prohlížeči |
| Ctrl + L | Přejít na adresní řádek v prohlížeči |
| Ctrl + Enter | Přidat "www" a". com " do textu v adresním řádku a otevřít web |
| Ctrl + Shift + Delete | Otevřít okno Vymazat data prohlížeče |
Pomocí těchto klávesových příkazů budete moci efektivně a pohodlně spravovat karty a navigaci v prohlížeči, aniž byste museli používat myš. To může výrazně zvýšit vaši produktivitu při práci s webovými stránkami a usnadnit navigaci na webových stránkách.
Praktické tipy pro lepší navigaci
Zlepšení navigace na webu má řadu výhod, jako je pohodlnější přístup k informacím a větší spokojenost uživatelů. Zde je několik praktických tipů, které vám pomohou usnadnit navigaci:
1. Podpora klávesnice navigace: Ujistěte se, že váš web má podporu navigace z klávesnice. To umožňuje uživatelům procházet webovou stránku bez použití myši a přístup k důležitým částem vašeho webu bude výrazně zjednodušen.
2. Srozumitelné a informativní odkazy: Použijte popisné texty pro odkazy, aby uživatelé po kliknutí na odkaz jasně pochopili, kam budou přecházet. Nepoužívejte obecné fráze jako "Klikněte zde", ale raději použijte konkrétní slova a fráze, které uživatelům pomohou určit účel odkazu.
3. Organizace karet: Rozdělte informace na svém webu na více karet, aby uživatelé mohli rychle přepínat mezi různými oddíly. Ujistěte se, že oblasti s podobnými tématy jsou seskupeny na jedné kartě, aby uživatelé mohli snadno najít potřebné informace.
4. Zaměřte se na hlavní části: Umístěte nejdůležitější části svého webu na začátek navigační nabídky nebo je zviditelněte. To uživatelům umožní rychle najít nejdůležitější informace na vašem webu.
5. Použití nápovědy: Poskytněte informace o funkčnosti každého odkazu nebo tlačítka, aby uživatelé po kliknutí na položku snadno pochopili, které informace budou otevřeny. Pomocí atributů jako" title "a" aria-label " poskytněte uživateli další kontextové informace.
Dodržováním těchto praktických tipů budete moci výrazně zlepšit navigaci na vašem webu a zajistit pohodlnější přístup k informacím pro vaše uživatele.