U bent hier:

1. Handleiding
2. Ontwikkeling
3. Links en navigatie
4. Client-side scripts

Client-side scripts als uitbreiding op een link

Als een link een scriptfunctie uitvoert die naar een URL leidt, maak deze URL dan ook benaderbaar voor bezoekers zonder scriptondersteuning. Vaak treft men links aan die scripts aanspreken in de volgende vormen, bijvoorbeeld om een venster te openen met een bepaalde pagina.

Zoek-spiders en browsers die client-side scripts niet ondersteunen, verwachten een URL in het href attribuut. Dergelijke links leiden tot ontoegankelijkheid. Er is echter een eenvoudig alternatief beschikbaar.

Nu komt er wel een URL voor in het href attribuut. Zoek-spiders en browsers die geen client-side scripts ondersteunen, volgen deze URL en negeren de scriptregel die ze niet begrijpen. Browsers die wel client-side scripts ondersteunen, voeren de functie uit en openen de URL in een nieuw venster. Nog eenvoudiger in gebruik is om de functie onder te brengen in een externe scriptbestand en vervolgens aan te roepen met een class of id attribuut: <a href="http://domein.nl/pagina" class="helptekst">. Deze oplossing is ” vooral voor redacteuren ” niet alleen het meest eenvoudig in gebruik, maar ook semantisch gezien beter en verdient dus de voorkeur.[r5]

Lees ook over de richtlijnen voor Links en nieuwe vensters.

Nog een voorbeeld: een uitklapmenu

Deze uitbreiding van de functionaliteit van links is ideaal voor een uitklapmenu waarvan de hoofdlink nergens naartoe hoeft te leiden, maar juist bij een muisklik moet uitklappen in een submenu.

Bij ondersteuning voor scripts zal het volgen van de link worden geannuleerd. In plaats daarvan wordt de functie uitgevoerd die het submenu opent. Als scripts echter niet worden ondersteund, volgt de browser gewoon de URL in het href attribuut.

Als deze URL een van de locaties is waarnaar in het submenu wordt verwezen en als op deze locatie het submenu uitgeklapt te vinden is, is er een zeer toegankelijk navigatiemenu gecreëerd.

Client-side scripts voor het produceren van een link

Als een link nergens naartoe leidt, maar een functie uitvoert zoals het schalen van de lettergrootte of het toepassen van een bepaalde stylesheet, heeft dit voor bezoekers zonder JavaScript weinig te bieden. Deze bezoekers hoeven dan ook niet met een onwerkzame link te worden geconfronteerd. Dit kan worden bereikt door gebruik te maken van een constructie als de volgende.

<a href="/vergroten.htm" onclick="vergroten();return false;">vergroot</a>

Als het bestand vergroten.htm de volgende tekst bevat, “Uw browser lijkt geen scripts te ondersteunen. Lees meer over <a href="/schalen.html">het zelf aanpassen van de lettergrootte in uw browser</a>”, heeft de link ook nut voor bezoekers zonder ondersteuning voor scripts. Het “return false;" in bovenstaand voorbeeld zorgt ervoor dat bij het klikken op de link “vergroten.htm“ niet wordt geladen.

Als ondersteuning voor scripts een voorwaarde is om de pagina te kunnen gebruiken, moet de webontwikkelaar een ander alternatief bieden om de toegang te de informatie te borgen, bijvoorbeeld door: client-side scripts te implementeren als aanvulling op server-side functies.

Client-side scripts als aanvulling op server-side functies

Als scripts niet ondersteund worden, kan een link met scriptfunctionaliteit terugvallen op functies die op de webserver worden uitgevoerd. Als dit kritische functionaliteit betreft (dat wil zeggen, de bruikbaarheid van de website is er van afhankelijk), is dit zelfs een noodzaak.

Men kan andersom redeneren: hoe kan client-side script een al aanwezige server-side functie verbeteren? Bijvoorbeeld, een link voor het veranderen van de stylesheet:

Als scripts niet ondersteund worden, resulteert het volgen van de link in een pagina die laadt met een alternatieve stylesheet. In dit voorbeeld is een PHP-functie op de server hiervoor verantwoordelijk. De pagina wordt bij het volgen van de link ververst voordat het resultaat zichtbaar is.

Als ondersteuning voor client-side scripts wel aanwezig is, voert het script de functie wisselStylesheet uit die onmiddellijk de pagina omschakelt naar een alternatieve style sheet, zonder dat de pagina ververst hoeft te worden vanaf de server.

Deze vorm van scriptfunctionaliteit tref je vaak aan bij het versturen van formulieren. Een functie controleert het formulier op geldigheid alvorens het te versturen. Als scripts niet ondersteund worden, wordt het formulier verstuurd en doet een server-side-functie het zware werk. Deze methode ontlast de server. Bovendien krijgen bezoekers met ondersteuning voor scripts een snelle respons als ze een formulier foutief invullen. Het formulier blijft toegankelijk.