Een select element spiderbaar maken

lijst.gif

In een aantal gevallen kan het zo zijn dat je op je site gebruik maakt van een zogenaamde <select> box om naar diverse onderdelen te navigeren. Helaas zijn deze elementen oorspronkelijk alleen bedoeld voor formulieren die verstuurd kunnen worden, waardoor ze standaard geen navigeer functionaliteit gekregen hebben. Dit gebeurt dan ook altijd met Javascript wat niet te spideren is door de zoekmachines.

Om dit op te lossen heb ik in eerste instantie de volgende oplossing bedacht: plaats links om de tekst van de option heen zodat zoekmachines die kunnen gebruiken. Dat ziet er als volgt uit:

<option value="http://www.url.nl"><a href="http://www.url.nl" >Url</a></option>

Zoekmachines negeren de option en lezen de link, en browsers negeren de link en zullen keurig alleen de option laten zien. Alleen tijdens een open vragen sessie aan Matt Cutts (mannetje van Google) heb ik gevraagd of dit een mooie oplossing was. En zijn antwoord: "It could raise some flags". Met andere woorden: hij zou het niet aanraden.

Op zoek naar een andere oplossing dus, en die schoot me vandaag te binnen. Ik maak nu gebruik van een <ul> met een aantal <li>'s er in die na het laden omgezet worden naar een <select> box. Heb je geen Javascript of ben je een zoekmachine dan krijg je keurig een lijst met links te zien. Ondersteund je browser wel Javascript dan krijg je keurig een ruimtebesparende select box te zien.

Het voorbeeld is hier te bekijken, bekijk de broncode en je ziet 3 lijsten staan. Maar op je scherm worden keurig selectboxen getoond.

Click to activate social bookmarks