Un menu déroulant indexable.

[HawkEye]

Dans bien des cas, un menu déroulant (<select>) reste la plus évidente des méthodes de navigation. Le problème majeur étant que ce type de navigation ne réalise pas de liens, voici une très intéressante façon de contourner le problème 8)

A voir sur Pink-SEO.com

 

[kanon90]

A l'époque où je cherchais une solution pour contourner le problème, on m'a conseillé de passer par du css, et le résultat n'est pas mal non plus !

 

[Madrileño]

Merci HawkEye et Marie.

 

[gwaradenn]

Merci, j'avais raté ça.

 

[laurentg25]

Merci pour l'info HawkEye !

 

[jnj]

Pas mal du tout. effectivement, d'externaliser le javascript dans un fichier externe est une précaution élémentaire pour simplifier la maintenance.

perso, je préfère laisser le widget que le client a envie d'avoir et doubler le tout par un script PHP qui pose les liens en bas de page en liste ou en nuage. Autre avantage du script php, il permet de faire du PR scuplting sans avoir à se trimballer les trous des rel=nofollow qui désormais pompe du PageRank

 

[julienringard]

Pas mal néanmoins je préfère le CSS

 

[lesarbres]

pour éviter l'ouverture dans une nouvelles fenêtre : écrire
function ToUrl(m){window.location.assign(m);}
et à la fin du js :
else{bsel.setAttribute("onchange", "if(this.value != \'\'){window.location.assign(this.value)};");}

où "window.location.assign" remplace "window.open"

en revanche, n'étant pas doué en javascript je sèche sur un point :
j'aimerais mettre un style du genre :
<li><a href="index.php" style="background-color:...">
j'ai imaginé qqchose du genre :
blistvalue2 = blia[1];

et plus loin :
bopt.setAttribute("style", blistvalue2);

mais je ne sais pas finir l code correctement.

autre petit plus: afficher dans le menu déroulant la page en cours et non pas le premier de la liste (je l'ai fait en php mais en js, ne sais pas)

si qn a une idée, ce serait bien.

 

[pichonnat]

Un coup d'œil sur http://sebastien.pichonnat.ch/developpement/menu-deroulant-pour-site-web

C'est un menu déroulant qui utilise Mootools, son avantage est d'être basé sur les balise HTML UL et LI:

<ul id="nav">
  <li><a href="#" >Link 1</a></li>
  <li><a href="#" >Link 2</a>
  <ul>
    <li><a href="#" >Link3</a></li>
    <li><a href="#" >Link4</a></li>
  </ul>
  </li>
  <li><a href="#" >Link 5</a></li>
</ul>

Il peut se passer du Javascript et reste très réactif au moteur de recherche et reste complètement personnalisable avec les CSS ;-)

 

[lepadre]

Au réfractaires du javascript, rien n'empêche d'utiliser php et select comme ceci :

<form method="post" action="index.php" class="lemenuform" >
<select name="accesrapide">
<option value="pagedestination.php"><a href="pagedestination.php">Page destination</a></option>
</select>
<input  type="submit" value="valider" />
</form>

Et en en-tête de ma page index.php je positionne une redirection PHP de type header qui redirige moteurs et visiteurs sur l'URL choisie.

<?php
if (Isset ($_POST['accesrapide']) AND ($_POST['accesrapide'] != NULL)) 
	{
	$VARIABLE = $_POST['accesrapide'];
	header("Location: $VARIABLE");
	}
?>

Pas d'usage de javascript et personnalisation de liste via CSS.

 

[skyll]

Au réfractaires du javascript, rien n'empêche d'utiliser php et select comme ceci :

<form method="post" action="index.php" class="lemenuform" >
<select name="accesrapide">
<option value="pagedestination.php"><a href="pagedestination.php">Page destination</a></option>
</select>
<input  type="submit" value="valider" />
</form>

Et en en-tête de ma page index.php je positionne une redirection PHP de type header qui redirige moteurs et visiteurs sur l'URL choisie.

<?php
if (Isset ($_POST['accesrapide']) AND ($_POST['accesrapide'] != NULL)) 
	{
	$VARIABLE = $_POST['accesrapide'];
	header("Location: $VARIABLE");
	}
?>

Pas d'usage de javascript et personnalisation de liste via CSS.

non indexable dans ce cas là, ce qui n'est pas forcément le but recherché

 

[lepadre]

Au réfractaires du javascript, rien n'empêche d'utiliser php et select comme ceci :

<form method="post" action="index.php" class="lemenuform" >
<select name="accesrapide">
<option value="pagedestination.php"><a href="pagedestination.php">Page destination</a></option>
</select>
<input  type="submit" value="valider" />
</form>

Et en en-tête de ma page index.php je positionne une redirection PHP de type header qui redirige moteurs et visiteurs sur l'URL choisie.

<?php
if (Isset ($_POST['accesrapide']) AND ($_POST['accesrapide'] != NULL)) 
	{
	$VARIABLE = $_POST['accesrapide'];
	header("Location: $VARIABLE");
	}
?>

Pas d'usage de javascript et personnalisation de liste via CSS.

non indexable dans ce cas là, ce qui n'est pas forcément le but recherché

Au contraire, fortement indexable puisque la liste de liens est en html brut et la redirection est transparente pour google. La variable transposée n'est rien d'autre que l'url de destination. Avec le navigateur lynx ou en visionnant le cache google en version texte, Google voit les liens comme si ils étaient en dur.

 

[skyll]

Bon.. à tester alors ;-)
même si google à accès aux formulaires... je sais pas si il vas réellement interpreter le lien présent dans la valeur comme un lien....

 

[UsagiYojimbo]

Je suis du même avis que skyll. Un menu basé sur un select html c'est quand même pas le top. Et vu les possibilités du CSS, le plus logique est quand même d'utiliser du CSS et une structuration à base de ul li

 

[cedric_g]

C'est marrant parce que moi je recherche un script (si possible JQuery) me permettant de... ne pas "montrer" les liens à Google

Cas pratique : un menu déroulant avec +200 liens dans un header de page, et qui fait donc passer le contenu bien loin dans le code (boutique en ligne avec de multiples catégories, visibles par ailleurs je tiens à le préciser)

Autre solution envisagée : jouer comme un tordu avec les CSS pour faire passer le header... après le contenu dans le code (mais bon, quid de la compatibilité cross browser...)

 

[cybervince]

Je passe également par du CSS et je pense que le résultat est plutôt correct, les liens étant bien interprêtés par Google.
Exemple ici: http://www.web-ig.com/formation/

Faudrait juste que je me trouve quelque chose qui soit plus pratique pour dérouler/enrouler les "menus". Enfin j'avoue ne pas trop m'être cassé la tête avec ca.

 

[WebRankInfo]

Je passe également par du CSS et je pense que le résultat est plutôt correct, les liens étant bien interprêtés par Google.
Exemple ici: http://www.web-ig.com/formation/

Faudrait juste que je me trouve quelque chose qui soit plus pratique pour dérouler/enrouler les "menus". Enfin j'avoue ne pas trop m'être cassé la tête avec ca.

au niveau design, ton menu et tes encadrés me semblent largement inspirés de la version précédente de WRI... mais c'est une autre histoire :roll:

 

[skyll]

Faudrait juste que je me trouve quelque chose qui soit plus pratique pour dérouler/enrouler les "menus". Enfin j'avoue ne pas trop m'être cassé la tête avec ca.

faudrais commencer par vérifier l'affichage sous IE,
ca bug un peu côté droit

 

[Sebda]

C'est soulant parfois le CSS... Si on l'optimise pour Firefox y'a beaucoup de chance que ça plante pour IE...

On es jamais sur que ça fonctionne avec tous les navigateurs :s

 

[eda]

Bonjour à tous, j'utilise ce script sur mon site mais je cherche désespérément à imposer un width à mon select, si quelqu'un a une idée, merci d'avance

 

[cedric_g]

Je passe également par du CSS et je pense que le résultat est plutôt correct, les liens étant bien interprêtés par Google.
Exemple ici: http://www.web-ig.com/formation/

Faudrait juste que je me trouve quelque chose qui soit plus pratique pour dérouler/enrouler les "menus". Enfin j'avoue ne pas trop m'être cassé la tête avec ca.

au niveau design, ton menu et tes encadrés me semblent largement inspirés de la version précédente de WRI... mais c'est une autre histoire :roll:

C'est le moins que l'on puisse dire !

 

[Mitsu]

C'est vrai que quand on c'est que l'on peu maintenant simulé un menu déroulant qui à la gueule qu'on veux sans même avoir recours à du javascript en jouant simplement avec les propriété de css, je pense que c'est bien plus intéressant que d'essayer de rendre indexable un menu déroulant type select.

 

[Jerome38190]

Bien pratique ce petit script ... et facile a mettre en place avec ca, merci

 

[Lindy]

Je remonte le sujet étant donné les mises à jour importantes de l'algo de Google depuis les dernières réponses.

Est-ce que vous pensez que l'AJAX (et plus particulièrement la solution de Pink-SEO) est toujours une bonne solution pour aider à référencer un menu select ? Pas trop de risques avec Penguin et le cloaking ? L'inconvénient aussi, c'est que ça ne fonctionne pas sur IE6 et IE7 (enfin du coup on applique pas l'AJAX sur ces navigateurs et on garde l'apparence de base).

Sinon y'a la solution de mettre le menu en dur dans une balise <noscript> juste après le select. Ça permet d'avoir un bon rendu même sur IE6 et IE7. Peut être plus "propre" pour Google. Mais la transmission du jus doit être un peu moins bonne dans un <noscript>, non ?

 

[spout]

@Lindy: une autre technique: http://www.redemption.se/other-means-of-selection/

 

[Lindy]

C'est parfait spout, merci beaucoup !

 

[Marie-Aude]

Babillage ressorti des abîmes par un flood

 

[Napoleon3]

Pas mal néanmoins je préfère le CSS

J'ai un faible aussi pour cette méthode qui est claire.