Textinhalte, die über das Element oder "Anker" -Element mit HTML verknüpft sind, sind standardmäßig unterstrichen. Oft entfernen Webdesigner diese Standardform, indem sie die Unterstreichung entfernen.
Viele Designer interessieren sich nicht für das Aussehen unterstrichener Texte, insbesondere in dichten Inhaltsblöcken mit vielen Links. Alle diese unterstrichenen Wörter können den Lesefluss eines Dokuments wirklich unterbrechen. Viele haben argumentiert, dass diese Unterstreichungen Wörter schwieriger machen, weil sie durch das Unterstreichen der natürlichen Buchstabenformen schneller unterschieden und gelesen werden können.
Die Beibehaltung dieser Unterstreichungen bei Textlinks bietet jedoch berechtigte Vorteile. Wenn Sie beispielsweise durch große Textblöcke blättern, erleichtern unterstrichene Links und der richtige Farbkontrast dem Leser das sofortige Scannen einer Seite und das Auffinden der Links.
Wenn Sie sich entscheiden, Links aus dem Text zu entfernen (ein einfacher Vorgang, den wir in Kürze behandeln werden), sollten Sie unbedingt nach Möglichkeiten suchen, diesen Text zu formatieren, um immer noch zu unterscheiden, was ein Link von dem, was nur Text ist. Dies geschieht meistens mit dem zuvor genannten Farbkontrast, jedoch kann Farbe allein für Besucher mit Sehbehinderungen wie Farbblindheit ein Problem darstellen. Abhängig von der jeweiligen Form der Farbenblindheit kann bei ihnen der Kontrast vollständig verloren gehen, sodass sie den Unterschied zwischen verlinktem und nicht verlinktem Text nicht erkennen können. Aus diesem Grund wird der unterstrichene Text immer noch als die beste Methode zum Anzeigen von Links angesehen.
Wie schalten Sie also eine Unterstreichung ab, wenn Sie dies noch tun möchten? Da es sich um ein visuelles Merkmal handelt, mit dem wir uns beschäftigen, wenden wir uns dem Teil unserer Website zu, der sich mit allen visuellen Elementen befasst - CSS.
Verwenden Sie Cascading Style Sheets, um die Unterstreichungen von Links zu deaktivieren
In den meisten Fällen möchten Sie die Unterstreichung nicht nur für einen Textlink deaktivieren. Stattdessen müssen Sie bei Ihrem Designstil wahrscheinlich Unterstriche von allen Links entfernen. Sie würden dies tun, indem Sie Ihrem externen Stylesheet Stile hinzufügen.
ein { Textdekoration: keine;}
Das ist es! Diese einfache CSS-Zeile würde die Unterstreichung (die eigentlich die CSS-Eigenschaft für "Textdekoration" verwendet) für alle Links deaktivieren. Sie könnten mit diesem Stil auch genauer werden. Wenn Sie beispielsweise nur die Unterstreichung oder die Verknüpfungen im Element "nav" deaktivieren möchten, können Sie Folgendes schreiben: nav a { Textdekoration: keine;}
Textlinks auf der Seite würden jetzt die Standardunterstriche erhalten, aber im Nav würde sie entfernt. Viele Webdesigner entscheiden sich dafür, den Link wieder zu aktivieren, wenn jemand über den Text schwebt. Dies würde mit der: hover-CSS-Pseudoklasse wie folgt durchgeführt werden: ein { Textdekoration: keine;}a: hover { Textdekoration: Unterstrichen;} Alternativ zu Änderungen an einem externen Stylesheet können Sie die Stile auch direkt in HTML dem Element selbst hinzufügen. Das Problem bei dieser Methode besteht darin, dass Stilinformationen in Ihre HTML-Struktur eingefügt werden. Dies ist keine bewährte Methode. Stil (CSS) und Struktur (HTML) sollten getrennt bleiben. Wenn Sie möchten, dass für alle Textlinks einer Site die Unterstreichung entfernt wird, bedeutet das Hinzufügen dieser Style-Informationen zu jedem Link auf individueller Basis, dass eine beträchtliche Menge zusätzlicher Markierungen zum Code Ihrer Site hinzugefügt wird. Diese Seitenaufblähung kann die Ladezeit einer Site verlangsamen und die allgemeine Seitenverwaltung erheblich erschweren. Aus diesen Gründen ist es vorzuziehen, für alle Seitengestaltungsanforderungen immer ein externes Stylesheet zu verwenden. So einfach es ist, den Unterstrich von den Textlinks einer Webseite zu entfernen, sollten Sie auch die Konsequenzen beachten. Es kann zwar das Erscheinungsbild einer Seite bereinigen, dies jedoch auf Kosten der allgemeinen Verwendbarkeit. Berücksichtigen Sie dies, wenn Sie das nächste Mal in Erwägung ziehen, die Eigenschaften der Seite "Textdekoration" einer Seite zu ändern. Inline-CSS verwenden
Abschließend