Domyślnie treść tekstowa powiązana z HTML za pomocą elementu "anchor" lub "anchor" jest stylizowana za pomocą podkreślenia. Często projektanci stron internetowych decydują się usunąć ten domyślny styl, usuwając podkreślenie.
Wielu projektantów nie dba o wygląd podkreślonego tekstu, szczególnie w gęstych blokach treści z dużą ilością linków. Wszystkie te podkreślone słowa mogą naprawdę złamać przepływ czytania dokumentu. Wielu twierdziło, że te podkreślają, że słowa są trudniejsze do rozróżnienia i szybkiego czytania ze względu na sposób, w jaki podkreślanie zmienia naturalne formy literowe.
Istnieją jednak zasadne korzyści dla zachowania tych podkreśleń w linkach tekstowych. Na przykład, gdy przeglądasz duże bloki tekstu, podkreślone linki połączone z odpowiednim kontrastem kolorów ułatwiają czytelnikom natychmiastowe zeskanowanie strony i sprawdzenie, gdzie znajdują się linki.
Jeśli zdecydujesz się usunąć linki z tekstu (prosty proces, który omówimy wkrótce), pamiętaj o znalezieniu sposobów na ukształtowanie tego tekstu, aby nadal odróżniać, co jest linkiem od tego, co jest zwykłym tekstem. Najczęściej jest to robione przy wspomnianym wcześniej kontraście kolorów, ale sam kolor może stanowić problem dla osób z wadami wzroku, takich jak ślepota barw. W zależności od ich konkretnej postaci ślepoty barw, kontrast może zostać całkowicie utracony, uniemożliwiając im dostrzeżenie różnicy między tekstem połączonym i niepołączonym. Dlatego podkreślony tekst jest nadal uważany za najlepszy sposób wyświetlania linków.
Jak więc wyłączyć podkreślenie, jeśli nadal chcesz to zrobić? Ponieważ jest to cecha wizualna, o którą się troszczymy, przejdziemy do części naszej strony internetowej, która obsługuje wszystkie rzeczy wizualne - CSS.
Użyj kaskadowych arkuszy stylów, aby wyłączyć podkreślenia w łączach
W większości przypadków nie chcesz wyłączyć podkreślenia tylko na jednym łączu tekstowym. Zamiast tego Twój styl projektowania prawdopodobnie wymaga usunięcia podkreśleń ze wszystkich linków. Można to zrobić, dodając style do zewnętrznego arkusza stylów.
a { dekoracja tekstowa: brak;}
To jest to! Ta prosta linia CSS wyłącza podkreślenie (które faktycznie używa właściwości CSS do "dekoracji tekstu") we wszystkich linkach. Możesz również uzyskać bardziej szczegółowe informacje o tym stylu. Na przykład, jeśli chcesz wyłączyć podkreślenie lub linki wewnątrz elementu "nav", możesz napisać: nav a { dekoracja tekstowa: brak;}
Teraz linki tekstowe na stronie będą miały domyślne podkreślenie, ale te w navie będą je usuwać. Jedną rzeczą, którą wielu projektantów stron internetowych wybiera, to przekierowanie linku z powrotem "na", gdy ktoś unosi się nad tekstem. Można to zrobić za pomocą pseudo-klasy CSS: hover, na przykład: a { dekoracja tekstowa: brak;}a: hover { dekoracja tekstowa: podkreślenie;} Zamiast wprowadzania zmian w zewnętrznym arkuszu stylów można również dodawać style bezpośrednio do samego elementu w kodzie HTML. Problem z tą metodą polega na umieszczeniu informacji o stylu wewnątrz struktury HTML, co nie jest najlepszą praktyką. Styl (CSS) i struktura (HTML) powinny być oddzielone. Jeśli chcesz, aby wszystkie linki tekstowe witryny miały usunięte podkreślenie, dodanie tych informacji o stylu do każdego linku w sposób indywidualny oznaczałoby dodanie do kodu witryny znacznej ilości dodatkowego znacznika. Rozrost strony może spowolnić czas wczytywania strony i sprawić, że ogólne zarządzanie stroną stanie się znacznie trudniejsze. Z tych powodów najlepiej jest zawsze przejść do zewnętrznego arkusza stylów dla wszystkich potrzeb stylizacji strony. Tak łatwe, jak usunięcie podkreślenia z linków tekstowych na stronie internetowej, również należy pamiętać o konsekwencjach takiego działania. Choć może rzeczywiście oczyścić wygląd strony, może to zrobić kosztem ogólnej użyteczności. Weź to pod uwagę, gdy następnym razem rozważasz zmianę właściwości "dekoracji tekstu" strony. Korzystanie z CSS wbudowanego
W zamknięciu
