Som standard er det tekstindhold, der er linket til HTML ved hjælp af eller "anker" -elementet er stylet med en understregning. Ofte vælger webdesignere at fjerne denne standard styling ved at fjerne understregningen.
Årsager til og imod understregningen
Mange designere er ligeglade med udseendet af den understregede tekst, især ikke i tætte indholdsblokke med mange links. Alle disse understregede ord kan virkelig bryde læsestrømmen i et dokument. Mange har hævdet, at disse understregninger faktisk gør ord sværere at skelne mellem og læse hurtigt på grund af den måde, at understregning ændrer de naturlige bogstavformer.
Der er dog legitime fordele ved at bevare disse understregninger på tekstlink. For eksempel, når du gennemsøger store tekstblokke, gør understregede links kombineret med korrekt farvekontrast det let for læsere at straks scanne en side og se, hvor linkene er.
Hvis du beslutter dig for at fjerne links fra teksten (en simpel proces, som vi snart vil dække), skal du sørge for at finde måder til at style den tekst for stadig at skelne mellem, hvad der er et link, og hvad der er almindelig tekst. Dette gøres oftest med
farvekontrast, men farve alene kan udgøre et problem for besøgende med synshandicap som farveblindhed. Afhængigt af deres særlige form for farveblindhed kan kontrast gå helt tabt på dem, hvilket forhindrer dem i at se forskellen mellem sammenkædet og ikke-sammenkædet tekst. Derfor betragtes den understregede tekst stadig som den bedste måde at vise links på.Så hvordan deaktiverer du en understregning, hvis du stadig vil gøre det? Da dette er et visuelt kendetegn, vi er interesseret i, vil vi henvende os til den del af vores hjemmeside, der håndterer alt det visuelle - CSS.
Brug Cascading Style Sheets til at deaktivere understregninger på links
I de fleste tilfælde ønsker du ikke at slå en understregning fra på kun et tekstlink. I stedet kræver din designstil sandsynligvis, at du fjerner understregninger fra alle links. Du ville gøre dette ved at tilføje stilarter til din eksternt stilark.
en {
tekst-dekoration: ingen;
}
Det er det! Den ene enkle linje af CSS ville deaktivere understregningen (som faktisk bruger CSS-egenskaben til "tekstdekoration") på alle links.
Du kan også blive mere specifik med denne stil. For eksempel, hvis du kun ville slukke for understregningen eller linkene inde i "nav" -elementet, kunne du skrive:
nav a {
tekst-dekoration: ingen;
}
Nu vil tekstlink på siden få standardunderstreget, men dem i navet vil have det fjernet.
En ting, mange webdesignere vælger at gøre, er at slå linket til igen, når nogen svæver over teksten. Dette gøres ved hjælp af: hover CSS pseudoklasse, sådan her:
en {
tekst-dekoration: ingen;
}
a: svæv {
tekst-dekoration: understreg;
}
Brug af Inline CSS
Som et alternativ til at foretage ændringer i et eksternt stilark kan du også tilføje typografierne direkte til selve elementet i HTML.
Problemet med denne metode er, at den placerer stiloplysninger i din HTML-struktur, hvilket ikke er en bedste praksis. Style (CSS) og struktur (HTML) skal holdes adskilt.
Hvis du vil have, at alle websteds tekstlinks skal have fjernet understregningen ved at tilføje denne stilinformation til hvert link på individuel basis vil betyde, at der føjes en hel del ekstra markering til dit websteds kode. Denne sideopblødning kan bremse et websteds indlæsningstid og gøre den samlede sidestyring meget mere udfordrende. Af disse grunde foretrækkes det altid at henvende sig til et eksternt typografiark til alle sidestylingsbehov.
Afslutning
Så let som det er at fjerne understregningen fra en websides tekstlinks, skal du også være opmærksom på konsekvenserne af at gøre det. Selvom det måske rent faktisk rydder op på en side, kan det ske på bekostning af den samlede brugervenlighed. Tag dette i betragtning, næste gang du overvejer at ændre en sides egenskaber for "tekstdekoration".