Syftet med HTML-platshållarlänkar

click fraud protection

Fram tills HTML5 släpptes har taggen krävt en attribut: href. Men HTML5 gör även det attributet frivilligt. När du skriver taggen utan attribut kallas det en platshållarlänk.

En platshållarlänk ser ut så här:

Tidigare

Använda platshållarlänkar under utveckling

Nästan varje webbdesigner har skapat platshållarlänkar vid ett tillfälle utforma och bygga en webbplats. Innan HTML5 skulle en programmerare skriva följande som platshållare:

länktext

Problemet med att använda en hashtag (#) som en platshållarlänk är att länken är klickbar, och detta kan orsaka förvirring för dina kunder. Och om en utvecklare glömmer att uppdatera dem med rätt webbadresser, kommer dessa länkar helt enkelt att visa samma sida som användaren är på om man klickar på.

Istället bör du börja använda taggar utan attribut. Du kan utforma dessa så att de ser ut som alla andra länkar på din sida, men de kan inte klickas eftersom de bara är platshållare.

Använda platshållarlänkar på direktsidor

Platshållarlänkar har en plats i webbdesign för mer än bara

instagram viewer
utveckling. En plats som en platshållarlänk kan lysa är i navigationselement. I många fall har webbplatsnavigationslistor något sätt att ange vilken sida du befinner dig på. Dessa kallas ofta ”du är här” -indikatorer.

De flesta webbplatser är beroende av id-attribut på elementet som behöver markeringen "du är här", men vissa använder också klassattributet. Oavsett vilket attribut du använder måste du dock göra mycket extra arbete för varje sida som har navigeringen och lägga till och ta bort attributet från rätt element.

Med en platshållarlänk kan du skriva din navigering hur du vill och sedan ta bort href-attributet från lämplig länk när du lägger till navigeringen på en sida. För utveckling är ett snabbt tips att hjälpa till att lagra hela navigeringslistan som ett kodavsnitt i din redigerare, så det är bara en snabb kopieringspasta. Du kan sedan helt enkelt ta bort href. Du kan också få ditt innehållshanteringssystem (CMS) att göra samma sak.

Styling Placeholder länkar

Platshållarlänkar är lätta att utforma och utforma annorlunda än de andra länkarna på din webbsida. Se bara till att utforma både taggen och länktaggen. Till exempel:

en {
färgen röd;
font-vikt: fet;
text-dekoration: ingen;
}
en länk {
färgen blå;
font-vikt: normal;
text-dekoration: understrykning;
}

Detta CSS kommer att göra platshållarlänkar djärva och röda, utan understrykning. Vanliga länkar kommer dock att ha normal vikt, blå och understrukna.

Kom ihåg att återställa alla stilar du vill inte överföras från en tagg. Till exempel är teckensnittets vikt inställd på fetstil för platshållarlänkarna, så för standardlänkar måste du ställa in den på:

font-vikt: normal;

Detsamma gäller med text-dekoration. Genom att ta bort den med a-väljaren skulle den ha tagits bort för a: länkväljaren om vi inte satte tillbaka den.

instagram story viewer