The English, American or U.S. (United States) Flag De Nederlandse Vlag, de vlag van Nederland

HTML Elementen - <a>

Inhoud:

Beschrijving - de tag <a>:

A is de afkorting van anchor, wat anker betekend.

De inhoud van een <a>-tag is de tekst waar de gebruiker op kan klikken. Dit zou bijvoorbeeld een omschrijving van de bestemming kunnen zijn.

Wanneer het href-attribuut is aangegeven, is de <a>-tag een hyperlink (een link, waar je op door kunt klikken). Als je dan op de link klikt, gaat de browser naar de locatie die is opgegeven door het href-attribuut. De locatie kan een relatieve (interne) locatie zijn, of een verwijzing naar een bepaalde plek op dezelfde of op een andere pagina. Ook kan de locatie een absolute locatie zijn, je kunt zelfs het protocol aangeven. Zie ook de beschrijving bij het href-attribuut, en de voorbeelden.

Je kunt ook een name- of idattribuut meegeven. Dan wordt de tag een bestemming, waarnaar andere links kunnen verwijzen (met #naam).

Naar boven...
Informatie:
HTML 4.0 DTD: strict, transitional, frameset
Beëindiging: (Sluittag) verplicht
Inhoud:

Inline Elementen met uitzondering van a:

abbr, acronym, applet, b, basefont, bdo, big, blink, br, button, cite, code, dfn, em, embed, font, i, iframe, img, input, kbd, label, map, nobr, object, q, s, samp, script, select, small, span, strike, strong, sub, sup, textarea, tt, u, var, wbr
Mag zijn opgenomen in:

Elementen op blokniveau met uitzondering van dir, dl, menu, ol, table, ul:

address, blockquote, center, div, fieldset, form, hr, hx, isindex, marquee, multicol, noframes, noembed, noscript, p, pre

Inline Elementen met uitzondering van a, button, map, script, select, textarea:

abbr, acronym, applet, b, basefont, bdo, big, blink, br, cite, code, dfn, em, embed, font, i, iframe, img, input, kbd, label, nobr, object, q, s, samp, small, span, strike, strong, sub, sup, tt, u, var, wbr

Andere Elementen:

caption, dd, del, dt, ins, legend, li, td, th
Mag niet zijn opgenomen in: De andere elementen
Vereiste attributen: (geen)
Inline Element: Ja
Element op blokniveau: Nee
Naar boven...

Ondersteuning:

HTML: 2.0
Internet Explorer: 1.0
Netscape: 1.0
Mozilla: 1.0
Firefox: 1.0
Opera: 2.1
Naar boven...

De attributen van <a>:

Attribuut Ondersteuning Beschrijving
Algemene Attributen:
accesskey
HTML: 4.0
Internet Explorer: 4.0
Netscape: 6.0
Mozilla: 1.0
Firefox: 1.0
Opera: 7.0

Met een accesskey kun je een sneltoets toewijzen aan een element. Op die manier hoeft de gebruiker er niet op te klikken, maar kan hij ook gewoon de sneltoets indrukken. Wanneer de sneltoets wordt ingedrukt, krijgt het element de focus (wordt hij geactiveerd, dat zie je aan het stippelrandje eromheen), en voert de browser de actie uit die zou gebeuren als erop geklikt wordt. Bij een hyperlink gaat de browser dus naar de bestemming van de link.

Je kunt als sneltoets 1 karakter (letter, cijfer of een ander teken) opgeven. De sneltoets is niet hoofdlettergevoelig (Alt + A is hetzelfde als Alt + a). Op een Windows-computer wordt de sneltoets geactiveerd door Alt + het opgegeven karakter, op een Macintosh wordt de sneltoets geactiveerd door Ctrl + het aangegeven karakter. Vanaf Firefox 2.0 moet ook Shift ingedrukt worden (bijv. Alt + A wordt dan dus Alt + Shift + A). Dit is om verwarring met de sneltoetsen van de browsermenu's te voorkomen. Bij Opera gaat het nog anders: daar moet eerst Shift + Escape ingedrukt worden, pas daarna zal Opera de accesskey-sneltoets herkennen. Omdat je aan een element niet kunt zien dat er een sneltoets aanzit, is het aan te raden om de gebruiker daar in de tekst op de sneltoets te wijzen.

Wanneer bijvoorbeeld accesskey="x" is opgegeven, zal de sneltoets geactiveerd kunnen worden met Alt + X.

class
HTML: 4.0
Internet Explorer: 3.0
Netscape: 4.0
Mozilla: 1.0
Firefox: 1.0
Opera: 3.5

Met het class-attribuut kun je elementen groeperen in verschillende groepen (classes = klassen). Dat is handig, want dan kun je bijvoorbeeld met CSS per groep aangeven hoe de elementen eruit moeten zien.

Je kunt meerdere groepen opgeven, door ze te scheiden met een spatie. Bijvoorbeeld: class="groep1 groep2 groep3". In dat voorbeeld zal het element ingedeeld zijn in 3 groepen: groep1, groep2 en groep3. Je moet er dan wel rekening mee houden dat meerdere groepen niet worden ondersteund door Internet Explorer 4 en lager en Netscape 4.

Een class-name (groepsnaam) is hoofdlettergevoelig (alleen Internet Explorer houdt zich daar niet aan, bij Internet Explorer zijn classnamen hoofdletterongevoelig). Dat betekend dat groep1, Groep1 en GROEP1 drie verschillende groepen zijn.

De meeste browsers ondersteunen alleen classnamen waar alleen letters (zowel A t/m Z als a t/m z), cijfers (0 t/m 9) en verbindingsstreepjes (-) in voorkomen.

dir
HTML: 4.0
Internet Explorer: 5.0
Netscape: 6.0
Mozilla: 1.0
Firefox: 1.0
Opera: 7.20

Met het dir-attribuut geef je de tekstrichting aan. Je kunt kiezen uit ltr (left to right, van links naar rechts), of rtl (right to left, van rechts naar links). Standaard (waneer hij niet is opgegeven) is hij ltr. Het dir-attribuut kan bijvoorbeeld handig zijn als woorden uit een taal die in een andere richting worden geschreven (bijvoorbeeld Arabisch) van de standaardtaal van het document.

id
HTML: 4.0
Internet Explorer: 3.0
Netscape: 4.0
Mozilla: 1.0
Firefox: 1.0
Opera: 3.5

Door het id-attribuut kun je elementen identificeren. Een id is dus uniek. Dat betekend dat je geen 2 elementen kunt hebben die hetzelfde id hebben, anders is het geen identificatiekenmerk meer. Een id mag ook niet hetzelfde zijn als een name-attribuut bij een <a>-tag, behalve wanneer het name-attribuut en het id-attribuut gebruikt worden voor hetzelfde element, dan moet het name-attribuut en het id-attribuut juist hetzelfde zijn.

Je kunt id's gebruiken in combinatie met CSS Stylesheets. In CSS is een id te gebruiken als selector. Je kunt dan een element met een bepaald id een bepaalde style geven.

In scripts is een id ook te gebruiken als identificatiemiddel. In Javascript bijvoorbeeld, is een element met als id 'Pietje' bijvoorbeeld als volgt op te vragen: document.getElementById('Pietje').

Een id is hoofdlettergevoelig (maar bij Internet Explorer niet, daar is een id hoofdletterongevoelig). Dat wil zeggen dat id1, Id1 en ID1 drie verschillende id's zijn.

Een id moet altijd beginnen met een letter (A t/m Z, of a t/m z). Na de eerste letter mag je in een id letters (A t/m Z, of a t/m z), cijfers (0 t/m 9), verbindingsstreepjes (-), underscores (_), dubbele punten (:) en punten (.) stoppen. Het is echter aan te raden om geen underscores (_), dubbele punten (:) en punten (.) in een id te stoppen, aangezien veel browsers die niet ondersteunen.

lang
HTML: 4.0
Internet Explorer: 4.0
Netscape: 6.1
Mozilla: 1.0
Firefox: 1.0
Opera: -

Met het lang-attribuut kun je aangeven in welke taal (lang = language = taal) een tekst is geschreven. Browsers gebruiken het bij bijvoorbeeld het afbreken van woorden, de weergave van letters, het kiezen wat voor soort aanhalingstekens er moeten zijn, en bijvoorbeeld of er een komma of een punt bij getallen moet worden geschreven. Ook gebruiken zoekmachines het, om te bepalen in welke taal de inhoud is geschreven. Tekst-naar-spraak programma's gebruiken het ook, om te bepalen hoe de tekst uitgesproken moet worden.

Het lang-attribuut is altijd van de vorm lang="taal". Daarbij is 'taal' de taal waarin het document geschreven is. 'Taal' is de afkorting van de taal, bijvoorbeeld nl voor Nederlands, en voor Engels, en-US voor Amerikaans Engels, fr voor Frans, de voor Duits, it voor Italiaans, es voor Spaans, tr voor Turks en ar voor Arabisch.

style
HTML: 4.0
Internet Explorer: 3.0
Netscape: 4.0
Mozilla: 1.0
Firefox: 1.0
Opera: 3.5

Met het style-attribuut kun je inline CSS toevoegen aan een element. Inline CSS van het style-attribuut gaan boven CSS uit een externe stylesheet.

tabindex
HTML: 4.0
Internet Explorer: 4.0
Netscape: 6.0
Mozilla: 1.0
Firefox: 1.0
Opera: 7.0

Met het tabindex-attribuut kun je aangeven in welke volgorde de attributen geactiveerd moeten worden. Als je op tab drukt, wordt het volgende element geactiveerd. Die volgorde is standaard de volgorde waarin de elementen in de HTML-code voorkomen, maar kan gewijzigd worden met het tabindex-attribuut. De waarde moet een integer (geheel getal) zijn, en mag zowel positief als negatief zijn.

Als tabindex positief is, zal de volgorde waarin elementen geactiveerd worden veranderd worden. Dan zullen elementen met een lage tabindex eerder geactiveerd worden dan elementen met een hoge tabindex.

Ale tabindex negatief is, zal het element niet meedoen in de tab-volgorde.

target
HTML: 4.0
Internet Explorer: 3.0
Netscape: 2.0
Mozilla: 1.0
Firefox: 1.0
Opera: 2.1

Met het target-attribuut kan aangegeven worden wat het doel (target = doel) is van het element. Bij hyperlinks bijvoorbeeld, kan met het target-attribuut worden aangegeven in welke venster of frame de link moet worden geopend. Hetzelfde geldt voor forms.

Een target-attribuut is altijd van de vorm target="waarde". Daarbij kan waarde een naam zijn. Je kunt een naam aan een frame of iframe koppelen door het name-attribuut van een frame of iframe. Een naam moet altijd beginnen met een letter (A t/m Z of a t/m z). Als de naam begint met een ander karakter, zal de browser het target-attribuut negeren. Als de naam niet bestaat, wordt het geopend in een nieuw venster.

Er zijn een paar voorgedefinieerde framenamen. Die beginnen allemaal met een underscore (_):

  • _top: Hij zal in het hele (top = bovenste) venster geopend worden
  • _self: Hij zal in het venster / frame geladen worden waarin de link is aangeklikt
  • _parent: Hij zal in het venster die direct boven (parent = ouders) het venster / frame waarin de link is aangeklikt worden geladen. Dat wil zeggen dat de link bijvoorbeeld in de hele frameset wordt geladen. Als er geen parent is, zal hij hetzelfde werken als _self.
  • _blank: De URI zal worden geladen in een nieuw venster.

Officieel is de naam hoofdletterongevoelig, maar veel browsers zijn nog steeds hoofdlettergevoelig met de namen. Het is dus aan te raden om de naam exact hetzelfde op te geven bij name als bij target.

title
HTML: 2.0
Internet Explorer: 4.0
Netscape: 6.0
Mozilla: 1.0
Firefox: 1.0
Opera: 3.0

Met title (titel) kun je extra informatie (een titel) geven aan een element. De meeste browsers weergeven dit als een tooltip (schermtip) boven de tekst. Als je bijvoorbeeld over deze tekst heen gaat met de muis, zul je waarschijnlijk een tooltip krijgen met 'Dit is een title-attribuut' daarin.. Zo kun je bijvoorbeeld een tekst een schermtip geven: <span title="Schermtip">Tekst</span>. Dit is vooral handig zijn bij hyperlinks (bijvoorbeeld om de gebruiker informatie te geven waar hij naartoe gaat), en voor uitleg van afkortingen.

Je kunt een stylesheet een naam geven door het title-attribuut toe te voegen aan een style-element. Dit geldt ook voor link-elementen.

Veel oudere browsers ondersteunden het title-attribuut wel, maar lieten hem niet zien. Internet Explorer 4.0 en hoger, Mozilla, Netscape 6.0 en hoger en Opera 5.0 en hoger laten hem wel als schermtip zien.

charset
HTML: 4.0
Internet Explorer: -
Netscape: -
Mozilla: -
Firefox: -
Opera: -

Met charset kun je aangeven met welke karaktercodering (character set) de URI is aangegeven, zodat de browser de URI naar de juiste karaktercodering kan omzetten.

coords
HTML: 4.0
Internet Explorer: -
Netscape: 6.1
Mozilla: 1.0
Firefox: 1.0
Opera: 7.0

Het coords-attribuut moet gebruikt worden in combinatie met het shape-attribuut. Met het shape-attribuut wordt aangegeven welke vorm de link heeft, en met het coords-attribuut worden dan de coördinaten opgegeven (coords = coordinates = coördinaten). Hier een paar voorbeelden van mogelijke waarden:

  • shape="rect": een rechthoek.
    Het coords-attribuut moet dan als volgt zijn: coords="Xlinks,Yboven,Xrechts,Yonder"

  • shape="circle": een cirkel
    Het coords-attribuut moet dan als volgt zijn: coords="Xmiddelpunt,Ymiddelpunt,R(straal)"

  • shape="poly": een veelhoek
    Het coords-attribuut moet dan als volgt zijn: coords="X1,Y1,X2,Y2,X3,Y3,X...,Y...,..."

  • shape="default": het hele gebied (standaardwaarde). Daarbij wordt de hele afbeelding gebruikt als gebied waar je op kunt klikken, behalve apart gedefinieerde gebieden.

X is de horizontale positie, gemeten vanaf de linkerzijkant in pixels. Helemaal links is X 0.
Y is de verticale positie, gementen vanaf de bovenkant in pixels. Helemaal bovenaan is Y 0.
Linksbovenin is X dus 0, en Y ook.

Helemaal rechts is X de breedte van de afbeelding, in pixels. Helemaal onderin is Y de hoogte van de afbeelding, in pixels. Als de afbeelding wordt vergroot / verkleind, worden de coordinaten automatisch meevergroot / verkleind. De coordinaten kunnen worden gevonden met een tekenprogramma, zoals Paint, Photoshop of Paint Shop Pro. Als meerdere gebieden elkaar overlappen, zal het gebied dat het eerste was opgegeven gebruikt worden.

href
HTML: 3.2
Internet Explorer: 1.0
Netscape: 1.0
Mozilla: 1.0
Firefox: 1.0
Opera: 2.1

Met het href-attribuut geef je aan waar de hyperlink naartoe moet gaan als de gebruiker op de link klikt. Je kunt verschillende waardes opgeven voor href, maar ze zijn bijna altijd van de vorm protocol://bestemming. Verder verschilt de vorm per protocol. Voorbeelden van bekende protocollen:

  • http (of https):
    HTTP is afkorting van HyperText Transfer Protocol. Bijna alle bestanden en websites gaan via het HTTP-protocol. Je kunt het HTTP-protocol gebruiken voor bijna alle soorten bestanden, zoals gewone html- of php-webpagina's, xml-bestanden, plaatjes (.jpg, .gif of .png), geluidsbestanden (.mp3, .wma, .wav, mid), filmpjes (.avi, .mp4), gecomprimeerde bestanden (.zip, .rar, .7z) en binaire executables (.exe).

    Een URL die het HTTP-protocol gebruikt, heeft meestal de volgende opbouw: http://host/path.
    Bij host vul je het adres van de host (server) in, en eventueel ook de poort. host ziet er als volgt hij: adres:poort, maar de poort mag ook weggelaten worden. Standaard is de poort 80. Het adres kan een ip (Internet Protocol)-adres (81.4.97.193) zijn, of een (domein)naam die gekoppeld is aan een ip-adres, bijvoorbeeld www.simondevries.com.
    Voor path vul je welk bestand je zoekt, en in welke map die staat.
    Als er geen speciaal bestand gezocht wordt, kun je path gewoon weglaten. De URL wordt dan: http://host.

    Bevind het bestand zich op de lokale server (dezelfde server als het document waar de link in staat), kan http://host weggelaten worden. De URL wordt dan: path

    Als er markeringen zijn in het doeldocument (aangegeven door <a name="markering">), kun je naar die plek verwijzen door #markering direct achter de URL te plaatsen.


  • mailto: Met mailto kun je een link naar een emailadres maken. Dan krijgt de gebruiker een scherm waarin hij een email kan schrijven naar het aangegeven emailadres.

    Het werkt zo: mailto:emailadres, maar veel emailprogramma's ondersteunen ook extra parameters, waarmee het onderwerp, cc en de inhoud aangegeven kunnen worden:
    mailto:emailadres?subject=onderwerp
    &cc=cc_emailadressen&body=berichtinhoud
    . Voor onderwerp vul je dan een onderwerp in, voor cc_emailadressen vul je in wat er bij cc moet komen te staan, en bij berichtinhoud vul je in wat er standaard al geschreven moet zijn in het bericht.


  • ftp:
    FTP is de afkorting van File Transfer Protocol. Met het ftp-protocol kun je verbinding maken met een ftp-server.

    Het werkt ongeveer hetzelfde als het http-protocol:
    ftp://host/path.
    Als er ook een gebruikersnaam en een wachtwoord nodig is, kun je dat als volgt meegeven:
    ftp://gebruiker:wachtwoord@host/path
    Die gebruikersnaam en dat wachtwoord is echter voor iedereen zichtbaar!

  • telnet
  • skype:
    Je kunt ook een hyperlink maken met een skype-adres:
    skype:gebruiker. Als de gebruiker dan op de link klikt, zal Skype opgestart worden, en zal de opgegeven gebruiker gebeld worden.

hreflang
HTML: 4.0
Internet Explorer: -
Netscape: -
Mozilla: -
Firefox: -
Opera: -

Met het hreflang-attribuut kun je aangeven in welke taal het bestand van de bestemming is geschreven. Hij is van de vorm:
hreflang="taal".

'Taal' is de afkorting van de taal, bijvoorbeeld nl voor Nederlands, en voor Engels, en-US voor Amerikaans Engels, fr voor Frans, de voor Duits, it voor Italiaans, es voor Spaans, tr voor Turks en ar voor Arabisch.

name
HTML: 3.2
Internet Explorer: 1.0
Netscape: 1.0
Mozilla: 1.0
Firefox: 1.0
Opera: 2.1

Het name-attribuut is precies hetzelfde als het id-attribuut, alleen is het id-attribuut wat nieuwer, en is het name-attribuut verouderd. Toch ondersteunen nog lang niet alle browsers het id-attribuut, dus daarom is het verstandig om ze beide te gebruiken. Voor een beschrijving van het name-attribuut, zie het id-attribuut.

rel
HTML: 2.0
Internet Explorer: -
Netscape: -
Mozilla: -
Firefox: -
Opera: -

Met het rel-attribuut kun je aangeven wat voor relatie het huidige document met de bestemming heeft. Je kunt kiezen uit:

  • alternate
  • designates
  • stylesheet
  • start
  • next
  • prev
  • contents
  • index
  • glossary
  • copyright
  • chapter
  • section
  • subsection
  • appendix
  • help
  • bookmark

rev
HTML: 2.0
Internet Explorer: -
Netscape: -
Mozilla: -
Firefox: -
Opera: -

Met het rev-attribuut kun je aangeven wat voor relatie de bestemming met het huidige document heeft. Je kunt, net zoals bij rel, kiezen uit:

  • alternate
  • designates
  • stylesheet
  • start
  • next
  • prev
  • contents
  • index
  • glossary
  • copyright
  • chapter
  • section
  • subsection
  • appendix
  • help
  • bookmark

shape
HTML: 4.0
Internet Explorer: -
Netscape: 6.1
Mozilla: 1.0
Firefox: 1.0
Opera: 7.0

Zie het coords-attribuut

type
HTML: 4.0
Internet Explorer: -
Netscape: 7.2
Mozilla: 1.6
Firefox: 1.0
Opera: -

Met het type-attribuut kun je aangeven wat het MIME (Internet Media)-type is van de media waarnaar verwezen wordt. Voor HTML gebruik je bijvoorbeeld text/html, voor XML text/xml en voor gewone tekstbestanden text/plain.

Naar boven...

Voorbeelden:

Voorbeeld: Resultaat:
<!-- Anker voor plek -->
<a name="plek">Plek</a>
<!-- Interne link naar 'plek' -->
<a href="#plek">Ga naar 'plek'</a>
<!-- Link naar de voorbeelden van Doctypes -->
<a href="!doctype.php#voorbeelden">
    Ga naar de voorbeelden van doctypes
</a>
<!-- Interne link -->
<a href="index.php">
    Ga naar de lijst van elementen
</a>
<!-- Externe link -->
<a href="http://www.google.com/">
    Ga naar www.google.com
</a>
<!-- Link via https-protocol -->
<a href="https://www.google.com/accounts/ServiceLogin">
    Ga naar de inlog-pagina van gmail
</a>
<!-- Link naar ftp-site -->
<a href="ftp://ftp.microsoft.com/">
    Ga naar ftp.microsoft.com
</a>
<!-- Link naar telnet-site -->
<a href="telnet://towel.blinkenlights.nl">
    Ga naar towel.blinkenlights.nl via telnet
</a>
<!-- Email Link -->
<a href="mailto:info@simondevries.com">
    Stuur mij een email!
</a>
Naar boven...

Bronnen:


Was deze informatie nuttig? Zo ja, overweeg dan een linkje op uw website te plaatsen:
Bedankt!