Som standard er tekstinnhold som er koblet til HTML ved hjelp av elementet eller "ankerelementet" utformet med en understreke. Ofte velger webdesignere å fjerne denne standard styling ved å fjerne understreken.
Mange designere bryr seg ikke om utseendet på understreket tekst, spesielt i tette blokker med innhold med mange lenker. Alle disse understrekkede ordene kan virkelig ødelegge lesestrømmen i et dokument. Mange har hevdet at de som understreker, faktisk gjør ord vanskeligere å skille og lese raskt på grunn av måten som understreker, endrer de naturlige brevformene.
Det er imidlertid legitime fordeler å beholde disse understrekkene på tekstkoblinger. For eksempel, når du bla gjennom store tekstblokker, understreket koblinger kombinert med riktig fargekontrast gjør det enkelt for leserne å umiddelbart skanne en side og se hvor koblingene er.
Hvis du bestemmer deg for å fjerne koblinger fra teksten (en enkel prosess som vi vil dekke kort tid), må du sørge for å finne måter å stile den teksten for å fortsatt skille mellom hva som er en kobling fra det som er vanlig tekst. Dette gjøres oftest med den ovennevnte fargekontrasten, men farge alene kan utgjøre et problem for besøkende med synshemming som fargeblindhet. Avhengig av deres spesielle form for fargeblindhet, kan kontrast være helt tapt på dem, slik at de ikke ser forskjellen mellom koblet og ikke-koblet tekst. Derfor er den understrekte teksten fortsatt ansett som den beste måten å vise linker på.
Så hvordan slår du av en understreke hvis du fortsatt vil gjøre det? Siden dette er en visuell egenskap vi er opptatt av, vil vi gå til den delen av nettstedet vårt som håndterer alle ting visuelt - CSS.
Bruk Cascading Style Sheets for å slå av understreken på koblinger
I de fleste tilfeller ønsker du ikke å slå en understreke av på bare en tekstlink. I stedet krever designstilen din sannsynligvis at du fjerner understreker fra alle koblinger. Du ville gjøre dette ved å legge til stiler til ditt eksterne stilark.
a { tekst-dekorasjon: ingen;}
Det er det! Den ene enkle linjen med CSS ville slå av understreken (som faktisk bruker CSS-egenskapen til "tekst-dekorasjon") på alle koblinger. Du kan også bli mer spesifikk med denne stilen. For eksempel, hvis du bare ønsket å slå av underskriften eller koblingene inni "nav" -elementet, kan du skrive: nav a { tekst-dekorasjon: ingen;}
Nå vil tekstkoblinger på siden få standard understreket, men de i naven ville ha den fjernet. En ting mange webdesignere velger å gjøre er å slå koblingen tilbake "på" når noen svinger over teksten. Dette ville bli gjort ved hjelp av: hover CSS pseudo-klassen, slik: a { tekst-dekorasjon: ingen;}a: svever { text-decoration: underline;} Som et alternativ til å gjøre endringer i et eksternt stilark, kan du også legge stilene direkte til selve elementet i HTML. Problemet med denne metoden er at den plasserer stilinformasjon i HTML-strukturen, noe som ikke er en god praksis. Stil (CSS) og struktur (HTML) skal holdes skilt. Hvis du vil at alle tekstlinks på et nettsted skal ha underskriften fjernet, vil legge til denne stilinformasjonen til hver lenke på individuell basis bety at en del ekstra markup blir lagt til nettstedets kode. Denne oppblåsingen kan redusere belastningstiden for en side og gjøre overordnet sidestyring mye mer utfordrende. Av disse grunner er det å foretrekke å alltid vende seg til et eksternt stilark for alle sidestilbehov. Så enkelt som det er å fjerne underskriften fra en nettside tekstkoblinger, bør du også være oppmerksom på konsekvensene av å gjøre det. Selv om det faktisk kan rydde opp utseendet på en side, kan det gjøre det på bekostning av total brukbarhet. Ta hensyn til dette neste gang du vurderer å endre en sides "tekst-dekorasjon" -egenskaper. Bruke Inline CSS
I Avslutning