Hvis du aktivt arbejder på at optimere din hjemmeside til søgemaskiner , har du sandsynligvis brugt Google Lighthouse -værktøjet, der giver indsigt i, hvordan du kan forbedre dine websiders ydeevne. Her er en af de almindelige fejl, som Lighthouse fremhæver, at 'links ikke har et tydeligt navn'.
Denne fejl er fremhævet under 'SEO-afsnittet' i revisionsrapporten og vedrører forbedring af brugeroplevelsen på dit websted.
I denne artikel vil vi se på, hvordan man retter denne Google Lighthouse-fejl. Men inden da er her en kort beskrivelse af Google Lighthouse-værktøjet.
TL;DR: Hurtig løsning på utydelige linketiketter
- Google Lighthouse markerer links, der mangler meningsfuld tekst, hvilket kan skade tilgængeligheden og brugeroplevelsen.
- Erstat vage sætninger som "klik her" med klar, beskrivende linktekst, der forklarer destinationen.
- Tilføj relevant alt-tekst til klikbare billeder, så hjælpeteknologier kan forstå deres formål.
- Brug attributter som aria-label til ikoner, knapper eller dynamiske elementer for at gøre dem tilgængelige og nemme at fortolke.
Hvad er Google Lighthouse?
Som open source-software Lighthouse et gratis Google-værktøj, der hjælper med at revidere websider og giver nyttige forslag til, hvordan man kan forbedre dem.
De fem parametre, som Google Lighthouse-værktøjet bruger til at evaluere et websted, er ydeevne, tilgængelighed, SEO, bedste praksis og progressiv webapp (PWA).
Baseret på disse parametre giver den forslag til at forbedre webstedets samlede ydeevne. Lad os kort se på hver af disse parametre.
Præstation
Lighthouses performance audit måler et websteds sidehastighed . Den måler, hvor hurtigt webstedet indlæses, og hvor godt det er optimeret for brugerne. Performancescoren er opdelt i tre kategorier: 0-49, 50-89 og 90-100.
En score mellem 90-100 indikerer, at hjemmesiden er godt optimeret. Alt under 90 betyder, at hjemmesiden skal forbedres. Lighthouse fremhæver problemerne og giver forslag til at forbedre hjemmesidens ydeevne .
Tilgængelighed
Denne parameter måler, hvor tilgængelig en hjemmeside er for personer, der bruger hjælpeteknologier. Når links mangler et tydeligt navn, knapper ikke er godt beskrevet, eller billeder ikke indeholder alternativ tekst (alternativ tekst), kan det gøre det vanskeligt for personer med begrænset eller intet syn at få adgang til en hjemmeside.
I tilgængelighedsrevisionsrapporten giver Lighthouse hjemmesiden en score ud af 100. Igen indikerer en højere score bedre tilgængelighed. Værktøjet giver også forslag til forbedring af tilgængeligheden.
Læs : WordPress tilgængelighedsoverholdelse med WCAG
Søgemaskineoptimering
Fra et SEO-perspektiv analyserer dette værktøj et websteds tekniske SEO. Selvom det ikke tilbyder en omfattende SEO-revisionsrapport, fremhæver det kritiske fejl, der skal rettes.
Nogle af de ting, den analyserer, er:
- Gyldige strukturerede data
- Links med beskrivende tekst
- Gyldig robots.txt
- Websideresponsivitet og indekserbarhed.
- Metatags – titel og beskrivelse
- Billeder og alt-tekst til billeder
- Crawlbarhed af interne links
Bedste praksis-tjek
Denne parameter analyserer de webudviklingsstandarder, der bruges til at bygge et websted eller en webside. Revisionsrapporten om bedste praksis giver en score ud af 100 og fremhæver problemer, der skal rettes.
Værktøjet hjælper med at afgøre, om websiderne er:
- Fri for browserfejl og forældede frameworks og API'er
- Indlæser ressourcer fra sikre servere med HTTPS
- Brug af det korrekte billedformat til billeder
- Sikker mod cross-site scripting (XSS) angreb
- Sikker mod sårbarheder i JavaScript-biblioteker.
Hvis du vil bygge en hjemmeside, der overholder bedste praksis uden fejl, så kontakt et førende WordPress- udviklingsfirma.
Læs : Almindelige tekniske SEO-problemer og bedste praksis
Progressiv webapp (PWA)
Den endelige Google Lighthouse-revisionsrapport hjælper med at validere webapplikationen. Den kontrollerer, om webappen er hurtig og pålidelig, og om den tilbyder en optimal brugeroplevelse.
Værktøjet kontrollerer, om webappen er nem at installere på tværs af flere enheder, og om den tilbyder offline-funktionalitet og push-notifikationer. Det kontrollerer også, om de progressive webapps er optimeret og konfigureret, og om den omdirigerer al HTTP-trafik til HTTPS.
Denne revisionsrapport tildeler et PWA-badge baseret på, hvor godt webappen klarer sig på tværs af forskellige faktorer. Google Lighthouse giver også nyttige forslag til at forbedre webapplikationens ydeevne.
Tid til at tackle og rette de vanskelige SEO-fejl!
Tag med os på en vild rejse mod SEO-succes, lad os transformere din hjemmesides ydeevne med vores ekspertise!
Hvad betyder 'Links har ikke et tydeligt navn'?
Selvom 'links har ikke et tydeligt navn' er ret selvforklarende, er her et eksempel, der vil give lidt kontekst.
Eksempel 1
<h3>Vil du tjekke din hjemmesides hastighed?</h3><li> <a href="https://seahawkmedia.com/tools/website-speed-test/">Klik her</a></li>Eksempel 2
<h3>Vil du tjekke din hjemmesides hastighed?</h3><li> <a href="https://seahawkmedia.com/tools/website-speed-test/">Brug vores gratis værktøj til at tjekke din hjemmesides hastighed</a></li>Hvilket af de to eksempler ville markere fejlen "links har ikke et tydeligt navn"?
Hvis du sagde eksempel 1, har du fuldstændig ret!
Kort sagt, Google angiver, at du skal bruge beskrivende eller hyper-eksplicit tekst til alle links og knapper på dit websted. Teksten skal tydeligt angive for brugeren, hvad der vil ske, hvis de klikker på den. For eksempel angiver eksempel 2 tydeligt: "Brug dette gratis værktøj til at tjekke dit websteds hastighed."
Google handler om at forbedre brugeroplevelsen. Så ved at holde teksten i dine links/knapper/billeder beskrivende, overholder du Googles retningslinjer, hvilket kan hjælpe med at forbedre din hjemmesides præstation i søgeresultaterne.
Sådan rettes fejlen 'Links har ikke et tydeligt navn'?
Hvis din linktest fejler i Google Lighthouse, vil den vise følgende fejlmeddelelse under 'SEO-sektionen'
Kilde til billede : https://developer.chrome.com/en/docs/lighthouse/seo/link-text/
For at undgå denne fejl bør du følge de bedste fremgangsmåder for linktekster fra Lighthouse, såsom:
- Hold dig til emnet for websiden eller blogindlægget, når du skriver linkteksten. Undgå linktekst, der ikke er relateret til sidens indhold.
- Sørg for, at linktekstbeskrivelsen er kort og præcis. Hold dig til korte sætninger.
- Undgå at bruge sidens URL som linkbeskrivelse.
- Sørg for, at dine interne links har en beskrivende tekst. Dette vil gøre navigationen nem for brugere og søgemaskinerobotter.
Andre tips til at rette fejlen "links har ikke et tydeligt navn" er:
Tilføj beskrivende navn til teksthyperlinks
Som nævnt i ovenstående eksempel, anses hyperlinket tekst som 'klik her' eller 'læs mere' ikke af Google for at være tilstrækkeligt beskrivende, da det ikke specificerer formålet for brugerne.
En bruger skal kunne afgøre linkets formål alene ud fra teksten, som beskrevet nedenfor. Dette forbedrer brugeroplevelsen og reducerer afvisningsprocenten .
<h3>Vil du tjekke din hjemmesides hastighed?</h3><li> <a href="https://seahawkmedia.com/tools/website-speed-test/">Brug vores gratis værktøj til at tjekke din hjemmesides hastighed</a></li>Google Lighthouse-værktøjet viser websider med fejlen "links har ikke et tydeligt navn". Alt du skal gøre for at rette denne fejl er at tilføje en kort og beskrivende tekst i HTML- taggene.
Tilføj ALT-tekst til hyperlinkede billeder
For hyperlinkede billeder skal du tilføje en alt-attribut, der forklarer linkets formål. Da billeder ikke har tekst på skærmen (som teksthyperlinks), beskriver en alt-tekst for billeder, hvad der vil ske, eller hvilken side brugeren lander på, når de klikker på billedet.
For eksempel er alt-attributten i billedet nedenfor indstillet til "W3Schools.com". Så når en bruger holder musen over billedet, ved de præcis, hvor de lander, når de klikker på billedet.
Billedkilde : https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_image_link
Hold billedets alt-tekst enkel og præcis. Du behøver ikke at beskrive billedet; angiv blot dets formål for at rette fejlen "links har ikke et tydeligt navn" for billeder.
Tilføj et tydeligt navn til links med komplekst indhold
For komplekse og dynamiske elementer eller ikke-tekstuelt indhold skal du tilføje aria-label-attributten til linket. Dette vil gøre linket mere tilgængeligt, især for brugere af hjælpemidler.
Eksempel : En lukknap (X) i en pop op-boks
<div id="box">Dette er en pop op-boks. <button aria-label="Close" onclick="document.getElementById('box').style.display='none';" class="close-button">X</button></div>I ovenstående eksempel vises en pop op-boks (en div), når du klikker på linket. Elementet 'luk' er en knap med kun bogstavet 'X'.
Her giver aria-label="close" et tydeligt navn til knappen (X).
Afsluttende tanker
Det er ret simpelt at rette fejlen "links har ikke et tydeligt navn". Google Lighthouse fremhæver denne fejl i sin SEO-revisionsrapport.
Når du har identificeret de websider, der ikke har et tydeligt navn i linket, kan du rette problemet ved at tilføje beskrivende tekst i HTML-tagget. For hyperlinkede billeder skal du tilføje en alt-tekst til billeder. Du kan derimod bruge aria-label-attributten til dynamiske elementer, ikoner og ikke-tekstuelt indhold.
, men kan også føre til en dårlig brugeroplevelse. De kan også forhindre webcrawlere i at indeksere dit websted præcist, hvilket påvirker dit websteds rangering.
For at forbedre brugeroplevelsen og dit websteds ydeevne, skal du straks identificere og afhjælpe almindelige SEO-problemer. Eller hvis du har brug for hjælp, kan du altid kontakte en udbyder af administrerede SEO-tjenester .
Ofte stillede spørgsmål om fejlen 'Links har ikke et tydeligt navn'
Hvad betyder det, når en forbindelse ikke kan ses?
Det betyder, at linket ikke indeholder klar eller meningsfuld tekst. Når linktekst og alternative beskrivelser mangler eller er vage, kan hjælpeteknologier ikke bestemme deres formål. Tilføjelse af tilgængelige navne i koden hjælper med at skabe links, der er synlige, og forbedrer navigationsoplevelsen for skærmlæserbrugere.
Hvordan kan jeg løse problemer med uklar linktekst på en hjemmeside?
Brug beskrivende ord i ankerteksten i stedet for generiske sætninger. Sørg for, at alle links vises med meningsfuld kontekst. En simpel kodeløsning er at opdatere linkteksten eller tilføje aria-etiketattributter, så hvert element har unikke og fokuserbare, tilgængelige navne
Hvorfor er alternativ tekst til billeder vigtig for links?
Hvis et billede fungerer som et klikbart link, skal det indeholde alternativ tekst. Denne alternative tekst definerer linkets formål for skærmlæsere og sikrer, at det forbliver tilgængeligt, selvom det visuelle element er skjult på grund af ændringer i stil eller layout.
Hvordan forbedrer tilgængelige navne navigationen?
Tilgængelige navne hjælper brugerne med at forstå, hvor et link fører hen. Når links er synlige, unikke og fokuserbare, forbedrer det navigationsoplevelsen for skærmlæserbrugere og gør sidestrukturen nemmere at følge.
Hvordan kan udviklere løse dette problem i koden?
Udviklere kan opdatere HTML-kodestykket ved at tilføje beskrivende linktekst, arie-etiketter eller alternative attributter. En lille ændring af en kodelinje i temaet kan løse problemet og forbedre tilgængeligheden.
