Heim >Web-Frontend >HTML-Tutorial >HTML-Tutorial: Erstellen einer Superverbindung

HTML-Tutorial: Erstellen einer Superverbindung

黄舟
黄舟Original
2016-12-26 15:22:331661Durchsuche

Tab-Browsing

Benutzer, die keine Zeigegeräte verwenden oder verwenden können, können die Tab-Taste zum Öffnen der Verbindung verwenden und müssen außerdem über eine logische Verbindung verfügen Tab-Reihenfolge. Obwohl HTML linear ist, können Sie mit dem tabindex-Attribut die Reihenfolge seiner Tastenkombinationen definieren, und diese logischen Tabs sollten automatisch an ihre Positionen fallen.

Tastenkombinationen

Tastenkombinationen ermöglichen eine einfachere Navigation über bestimmte Tasten auf der Tastatur (um den Fokus zu erhalten, wenn Sie die Alt- oder Strg-Taste gedrückt halten). Für diejenigen, die kein Zeigegerät haben, ist dies schneller und bequemer als die Verwendung der Tabulatortaste zum Herstellen einer Verbindung.

Es ist nicht notwendig, für jede Verbindung Tastenkombinationen festzulegen, aber es ist eine gute Idee, sie für die Hauptnavigationsverbindungen festzulegen.

Einige Seite


HINWEIS

Das Problem mit Tastenkombinationen besteht darin, dass der Benutzer oft keine Möglichkeit dazu hat Sie wissen, wo sie sich befinden und was genau die Schlüssel sind (es sei denn, Sie schauen sich den Quellcode an). Obwohl JAWS ein Screenreader ist, der Verknüpfungen vorlesen kann, müssen Sie die Verknüpfungen noch einfacher gestalten, um das Beste daraus zu machen.
Sie können Verknüpfungstechniken wie „Navigation überspringen“ (siehe unten) verwenden oder eine separate Seite auswählen, um diese benutzerfreundlichen Funktionen Ihrer Website, einschließlich Tastenkombinationen, zu veranschaulichen. Eine immer beliebter werdende Methode besteht darin, einen Buchstaben zu unterstreichen, der der Tastenkombination entspricht, ähnlich der Methode in Windows-Programmmenüs.


Titel des Links

Es ist eine gute Idee, dem Link ein Titelattribut hinzuzufügen. Dadurch erhält der Benutzer eine Beschreibung des Links, auf den er verweist kann die Navigation verbessern.

Es ist auch hilfreich, Benutzern, die kein Javascript verwenden, zu erklären, was passieren wird (oder nicht), wenn die Verbindung über Javascript läuft.


Pop-ups

Apropos Javascript-Pop-ups: Wenn Sie darauf bestehen möchten, sie zu verwenden, oder wenn viele Leute (Ihre Benutzer) Ihnen sagen, dass Sie sie verwenden sollen, Sie können onkeypress und onclick verwenden, um die Nutzung der Seite zu vereinfachen. Darüber hinaus ist ein Popup-Fenster funktional definiert, das einen Link mit einem href-Attribut zurückgibt, der auf eine normale Seite verweist. Für einen Benutzer, der die Javascript-Funktion nicht verwendet, kann diese Seite auf normale Weise geladen werden.

Zum Beispiel:


...
Monster


Angrenzende Verbindung

Links sollten müssen durch mindestens ein Leerzeichen getrennt sein, um sie für Screenreader lesbar zu machen.
Dies kann auch mit Zeichen, zwischen Verbindungen (z. B. vertikale Balken |── Verbindung | Verbindung) oder umgebenden Verbindungen (z. B. eckige Klammern [] ── [Verbindung] [Verbindung]) erfolgen. Es ist auch eine gute Idee, Verbindungen in Listen einzufügen. Die Anzeige kann dann mit CSS gestaltet werden, auch in parallelen Listen (mittels display:in-line).

Navigation überspringen

Sie sollten Benutzern, die Screenreader verwenden, die Möglichkeit geben, die Navigation zu überspringen und direkt zum Inhalt zu gelangen. Dies liegt daran, dass Benutzer, vorausgesetzt Ihre Verbindung ist fest (wie es sein sollte), nicht auf jeder Seite die gleichen Informationen durchgehen müssen, insbesondere wenn es viele davon gibt. Sie können einen Link einrichten, der die Navigation überspringt und direkt zum Inhalt springt.

sieht so aus:



Die Überschrift


Navigation überspringen










Natürlich müssen Sie es nicht im visuellen Browser anzeigen, Sie können es also mit CSS ausblenden.

Hinweis

Obwohl dies nur ein kleiner CSS-Trick ist, handelt es sich dabei um eine spezielle Medizin gegen das „Überspringen der Navigation“. Dabei handelt es sich um Methoden zum Verstecken von Zusammenhängen.
Die häufigste Lösung ist wahrscheinlich die Verwendung von display:none, aber einige Browser sehen diesen Link, verstehen ihn aber nicht und der Link „Navigation überspringen“ muss angezeigt werden.
Es besteht jedoch keine Notwendigkeit, es anzuzeigen – es gibt keinen Grund, es prominenten Benutzern anzuzeigen. Anstatt also bei Stilen zu bleiben, die display: none enthalten, können Sie die Breite und Höhe des Elements genauso gut auf Null setzen (width: 0; height: 0; overflow: versteckt;), was den gleichen visuellen Effekt hat, aber für den Bildschirm einfacher ist Leser zu verstehen.

Das Obige ist das HTML-Tutorial: Herstellen einer Superverbindung. Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website (www.php.cn)!