Maison  >  Article  >  interface Web  >  Tutoriel HTML : Créer une super connexion

Tutoriel HTML : Créer une super connexion

黄舟
黄舟original
2016-12-26 15:22:331627parcourir

navigation par tabulation

Les utilisateurs qui n'utilisent pas ou ne peuvent pas utiliser de périphérique de pointage peuvent utiliser la touche de raccourci de tabulation pour ouvrir la connexion, et ils doivent également disposer d'un ordre de tabulation. Bien que le HTML soit linéaire, l'attribut tabindex vous permet de définir l'ordre de ses touches de raccourci, et ces onglets logiques doivent automatiquement se mettre à leur place.

Touches de raccourci

Les touches de raccourci permettent une navigation plus facile via des touches spécifiques du clavier (le focus est obtenu lorsque la touche Alt ou la touche Ctrl est maintenue enfoncée). Pour ceux qui ne disposent pas de périphérique de pointage, c'est plus rapide et plus pratique que d'utiliser la touche de tabulation pour se connecter.

Il n'est pas nécessaire de définir des touches de raccourci pour chaque connexion, mais c'est une bonne idée de les définir pour les principales connexions de navigation.

Certaines pages


REMARQUE

Le problème avec les touches de raccourci est que l'utilisateur n'a souvent aucun moyen de savoir où elles se trouvent et quelles sont exactement les clés (à moins de regarder le code source). Bien que JAWS, un lecteur d'écran capable de lire les raccourcis à haute voix, pour en tirer le meilleur parti, vous devez toujours rendre les raccourcis plus simples.
Vous pouvez utiliser des techniques de liaison telles que « ignorer la navigation » (détaillées ci-dessous) ou choisir une page distincte pour illustrer ces fonctionnalités liées à la convivialité de votre site, y compris les touches de raccourci. Une méthode de plus en plus populaire consiste à souligner une lettre qui correspond à la touche de raccourci, similaire à la méthode utilisée dans les menus des programmes Windows.


Titre du lien

C'est une bonne idée d'ajouter l'attribut title au lien. Cela donnera à l'utilisateur une description du lien vers lequel il pointe. peut améliorer la navigation.

Si cette connexion exécute Javascript, il est également utile d'expliquer aux utilisateurs qui n'utilisent pas la fonctionnalité Javascript ce qui se passera (ou ne se passera pas).


Pop-ups

En parlant de pop-ups Javascript, si vous souhaitez insister pour les utiliser, ou si de nombreuses personnes (vos utilisateurs) vous disent de les utiliser, vous pouvez utiliser onkeypress et onclick pour rendre la page plus facile à utiliser. De plus, une fenêtre pop-up qui renvoie false est fonctionnellement définie, incluant un lien avec un attribut href pointant vers une page normale. Pour un utilisateur qui n'utilise pas la fonction Javascript, cette page peut être chargée de manière normale.

Par exemple :


...
Monstre


Connexion adjacente

Les liens doivent être séparés par au moins un espace pour les rendre lisibles aux lecteurs d'écran.
Cela peut également être fait avec des caractères, entre des connexions (telles que des barres verticales |── connexion | connexion), ou des connexions environnantes (telles que des crochets []── [connexion] [connexion]). C'est aussi une bonne idée de placer les connexions dans des listes. L'affichage peut ensuite être stylisé avec CSS, même dans des listes parallèles (en utilisant display: in-line).

Ignorer la navigation

Vous devez donner aux utilisateurs utilisant des lecteurs d'écran la possibilité d'ignorer la navigation et d'accéder directement au contenu. En effet, en supposant que votre connexion soit établie (comme elle devrait l'être), les utilisateurs n'ont pas besoin de parcourir les mêmes informations sur chaque page, surtout s'il y en a beaucoup. Vous pouvez configurer un lien qui ignore la navigation et accède directement au contenu.

ressemble à ceci :



Le titre


Passer la navigation










Évidemment, vous n'êtes pas obligé de l'afficher dans le navigateur visuel, vous pouvez donc le masquer à l'aide de CSS.

Remarque

Bien qu'il ne s'agisse que d'une petite astuce CSS, il s'agit d'un médicament spécial pour "sauter la navigation". Cela implique des méthodes pour masquer les connexions.
La solution la plus courante est probablement d'utiliser display: none, mais certains navigateurs voient mais ne comprennent pas ce lien, et le lien "ignorer la navigation" doit être affiché.
Cependant, il n'est pas nécessaire de l'afficher - il n'y a aucune raison de l'afficher aux utilisateurs importants. Ainsi, au lieu de vous en tenir aux styles qui incluent display: none, vous pourriez aussi bien définir la largeur et la hauteur de l'élément à zéro (width: 0; height: 0; overflow: Hidden;), ce qui a le même effet visuel mais est plus facile à afficher à l'écran. lecteurs à comprendre.

Ce qui précède est le tutoriel HTML : établir une super connexion. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois (www.php.cn) !