Het doel van HTML Placeholder-koppelingen

click fraud protection

Tot HTML5 is vrijgegeven, de tag heeft er een nodig attribuut: href. Maar HTML5 maakt zelfs dat attribuut optioneel. Wanneer u de tag schrijft zonder attributen, wordt dit een tijdelijke aanduiding-link genoemd.

Een tijdelijke aanduiding-link ziet er als volgt uit:

Vorige

Tijdelijke koppelingen gebruiken tijdens ontwikkeling

Bijna elke webdesigner heeft wel eens tijdelijke links gemaakt het ontwerpen en bouwen van een website. Vóór HTML5 schreef een programmeur het volgende als tijdelijke aanduiding:

verbind tekst

Het probleem met het gebruik van a hashtag (#) als tijdelijke aanduiding-link is dat de link klikbaar is, en dit kan verwarring veroorzaken bij uw klanten. En als een ontwikkelaar vergeet ze bij te werken met de juiste URL's, tonen die links gewoon dezelfde pagina als de gebruiker als erop wordt geklikt.

In plaats daarvan moet u tags gaan gebruiken zonder attributen. U kunt deze stijlen zodat ze eruitzien als elke andere link op uw pagina, maar ze zijn niet klikbaar omdat het slechts tijdelijke aanduidingen zijn.

instagram viewer

Tijdelijke aanduiding-links gebruiken op live sites

Placeholder-links hebben niet alleen een plaats in webdesign design ontwikkeling. Een plaats waar een tijdelijke aanduiding-link kan schitteren, is in navigatie-elementen. In veel gevallen hebben websitenavigatielijsten een manier om aan te geven op welke pagina u zich bevindt. Dit worden vaak "u bent hier"-indicatoren genoemd.

De meeste sites vertrouwen op id-kenmerken op het element dat de markering "u bent hier" nodig heeft, maar sommige gebruiken ook het class-attribuut. Welk attribuut je ook gebruikt, je moet veel extra werk doen aan elke pagina waarop de navigatie staat, het toevoegen en verwijderen van het attribuut van de juiste elementen.

Met een tijdelijke aanduiding-link kunt u uw navigatie schrijven zoals u dat wilt, en vervolgens eenvoudig het href-kenmerk van de betreffende link verwijderen wanneer u de navigatie aan een pagina toevoegt. Voor ontwikkeling is een snelle tip om te helpen de hele navigatielijst als een codefragment in uw editor op te slaan, dus het is slechts een snelle kopie en plak. U kunt de href dan eenvoudig verwijderen. U kunt ook uw contentmanagementsysteem (CMS) hetzelfde laten doen.

Styling Placeholder Links

Tijdelijke aanduiding-links zijn gemakkelijk te stylen en anders te stylen dan de andere links op uw webpagina. Zorg ervoor dat u zowel de a-tag als de a: link-tag opmaakt. Bijvoorbeeld:

een {
kleur rood;
lettergewicht: vet;
tekstdecoratie: geen;
}
een link {
kleur blauw;
lettergewicht: normaal;
tekstdecoratie: onderstrepen;
}

Dit CSS zal plaatsaanduidingslinks vet en rood maken, zonder onderstreping. Normale links hebben een normaal gewicht, zijn blauw en zijn onderstreept.

Vergeet niet om elke te resetten stijlen u wilt niet worden overgenomen van de a-tag. Het lettertypegewicht is bijvoorbeeld vetgedrukt voor de tijdelijke aanduiding-koppelingen, dus voor standaardkoppelingen moet u dit instellen op:

lettergewicht: normaal;

Hetzelfde geldt voor de tekst-decoratie. Door het te verwijderen met de a selector, zou het zijn verwijderd voor de a: link selector als we het niet terug hadden gezet.

instagram story viewer