Ich habe heute plötzlich ein sehr seltsames Problem entdeckt. Auf einigen Websites, die sich auf CSS, 0 . Manchmal wirkt sich das standardmäßige Erscheinungsbild eines gepunkteten Rahmens (Umrisses) möglicherweise auf das Erscheinungsbild aus, aber seine Existenz muss einen Grund haben: nämlich die Benutzerfreundlichkeit der Website zu verbessern, insbesondere um Benutzern, die die Tastaturnavigation verwenden, großen Komfort zu bieten. Während wir über Semantik und Benutzerfreundlichkeit diskutieren, tun wir immer Dinge, die ihnen zuwiderlaufen. Setzen Sie den Linkhintergrund auf Rot, wenn der Fokus ausgelöst wird usw. Natürlich können Sie bei Bedarf auch komplexere Stile entwerfen und den Fokus und den Mauszeiger auf denselben Stil setzen. Aber eines gibt es: Sie können den Fokusauslösemechanismus nicht blockieren.
1. Das gepunktete Kästchen (Umriss) erleichtert die Tastaturnavigation
Ich habe beim Lesen von Artikeln eine Angewohnheit: Ich benutze selten die Maus und verlasse mich grundsätzlich auf die Tastatur. Die am häufigsten verwendeten sind die Tabulatortaste, PageUp, PageDown, Enter und die vier Richtungstasten. Mit der Tabulatortaste können Sie zwischen verschiedenen Hyperlinks wechseln. Drücken Sie zum Aufrufen direkt die Eingabetaste (Sie können jetzt die Tabulatortaste verwenden, um den Effekt auf dieser Seite zu sehen). Wenn sich die Tab-Taste auf einen Link konzentriert, erscheint ein gepunkteter Rahmen (Umriss) um den Link herum und zeigt damit an, dass der Link im Fokus ist und nach Bestätigung aufgerufen werden kann. Natürlich mögen viele Leute sagen: „Es ist so bequem, eine Maus zu benutzen, warum sollte man dann eine Tastatur verwenden?“ Hier möchte ich einige Gründe nennen.
Man sagt, ein Kriterium für einen echten Computermeister sei, ob man alle Vorgänge ohne die Verwendung einer Maus ausführen könne. Manchmal, wenn ich einen Artikel lese, hat es keinen Einfluss auf das Lesen, wenn ich in der rechten Hand Kaffee halte und mit der linken Hand auf der Tastatur tippe.
Die besonderen Bedürfnisse besonderer Personengruppen sind nicht nur für Sie bestimmt. Sie können nicht beeinflussen, wie andere Ihre Website nutzen.
Neuer Stil bei Verwendung der Tab-Taste zum Fokussieren auf einen Link (dies kann je nach Browser unterschiedlich sein, aber jeder Browser verfügt über diese Funktion, was ihre Notwendigkeit zeigt)
2. Schlechtere Benutzererfahrung
Verwenden Sie „outline:none“ oder „outline:0“, um den äußeren gepunkteten Rahmen zu entfernen. Obwohl keine Änderungen am Link erkennbar sind, sind zumindest die Linkinformationen in der Statusleiste zu sehen. Eine noch schlechtere Benutzererfahrung ist jedoch die Verwendung des onfocus-Ereignisses von JavaScript. Wenn der Benutzer auf einen Link fokussiert, wird der Fokus sofort aufgehoben, was bedeutet, dass Sie sich nie auf diesen Hyperlink konzentrieren können. Wenn Sie also nicht die Maus verwenden, ist dies durchaus möglich 't. Besuchen Sie einen beliebigen Link auf dieser Seite. Einige Experten haben Methoden entwickelt, um mithilfe von JQuery Umrisse zu entfernen. Wenn Sie bei Google „gepunktete Linien aus Links entfernen“ verwenden, erhalten Sie Zehntausende Ergebnisse. Es scheint, dass viele Leute es brauchen und recherchieren. Allerdings verstieß er gegen den Grundsatz der Benutzerfreundlichkeit des Webs und berücksichtigte überhaupt nicht die Benutzererfahrung.
3. Alternative Optionen
Wenn Sie wirklich glauben, dass das Erscheinungsbild eines gepunkteten Rahmens das Erscheinungsbild beeinflusst, haben Sie definitiv eine bessere Wahl. Das heißt, die Pseudoklasse :focus in CSS zu verwenden. Zum Beispiel mit
a:focus {Hintergrundfarbe:#f00;
/*oder*/
a:hover, a:focus {text-decoration:underline;}
Entfernen Sie daher niemals das gepunktete Kästchen um den Hyperlink, zumindest um die Auslösung des Fokus nicht zu blockieren.