Login
blog > developpement > [Web] Tuto : Le nuage de mots clés

[Web] Tuto : Le nuage de mots clés

Posté par : Seb - Le Lundi 26 Novembre 2007 à 15:36

Parmis les nombreuses fonctionnalités qui émergent depuis des mois sur le net, celle dont j'ai envie de vous parler aujourd'hui est particulièrement représentative du nouveau web : le nuage de mots clés.

Le principe est de représenter sous la forme d'un nuage, les mots clés les plus utilisés pour accéder à vos pages, la taille de chaque mot étant pondérée par le nombre de ses occurences.


Sans rentrer dans le code à proprement parler je vais vous donner aujourd'hui les points clés pour développer votre propre système de tag cloud. A vous ensuite de l'agrémenter de le modifier à souhait.


Le plus simple moyen pour savoir quels sont les mots clés qui mènent à vos pages, et donc le contenu recherché par vos visiteurs, c'est encore d'analyser les mots qu'ils ont tapé dans google. Pour ce faire la variable php $_SERVER['HTTP_REFERER'] nous sera d'une grande aide.

Traitement de l'URL
L'url retournée si la source est google (cas le plus courant) est de la forme suivante :
http://www.google.fr/search?q=nuage+mots+cles&ie=utf-8&oe=utf-8&client=firefox-a


La partie soulignée contient la requête effecutée par le visiteur dans son moteur de recherche. Il est alors tout à fait envisageable d'extraire cette partie de l'url, pour ne conserver que les mots qui nous interessent.


Une des solutions possible et à mon sens l'utilisation des expressions régulières avec la fonction ereg() :
ereg("q=([-a-zA-Z0-9_+]*)&|$",$_SERVER['HTTP_REFERER'],$tags);


Cette chaîne devrait extraire le contenu de la chaîne contenue après "q=" et la placer dans la variable "$tags".
Il sera peut-être nécessaire de faire quelques traitements pour nettoyer la chaîne à ce point, mais ceci n'est pas le but de ce court tutoriel.


A vous ensuite de choisir de quelle façon vous souhaitez stocker cette donnée. Si vous enregistrez déjà vos propres "logs" il serait sûrement judicieux d'ajouter un champ pour stocker les mots cles, autrement un simple fichier texte peut suffire.


Formatage et stockage
Que ce soit lors de la phase d'enregistrement ou lors de la lecture il sera nécessaire de compter les occurences de chaque mot, pour définir la priorité et la taille des mots. Dans le cas d'un stockage en base de donnée une simple requête SQL fera le travail, autrement il faudra construire une boucle pour lire le fichier et incrémenter la valeur du mot clé à chaque mot trouvé. L'objectif étant à la fin de constituer une liste des mots les plus usités pour accéder à vos pages. Par exemple un fichier xml

<liste>

<mot>nuage</mot>
<occurence>6</occurence>

<mot>tag</mot>
<occurence>3</occurence>

<mot>kookyoo</mot>
<occurence>2</occurence>

...

</liste>

 

La dernière étape sera de mettre en page ces différents éléments. Là aussi plusieurs méthodes s'offre à nous, soit directement en php, soit en javascript. Selon vos affinités vous opterez pour la solution qui vous convient le mieux, mais je ne saurais que trop vous conseiller d'utiliser un fichier pré-calculé en cache (comme notre exemple xml), pour éviter de refaire les requêtes et calculs du nuage à chaque page affichée.


La mise en forme, le css
Pour le code affiché nous préfèrerons évidement l'utilisation du css pour la mise en page de nos mots clés. Voici un exemple de structure envisageable:

Code CSS
#nuage {
  font-size:10px;
  width:250px;
  height:250px;
}
#nuage .tag1 { font-size:1.2em;}
#nuage .tag2 { font-size:1.6em;}
#nuage .tag3 { font-size:2em;}


Code HTML

<div id="nuage">
<a id=nuage title="5 occurences"class=tag3>hard reboot freebox</a>&nbsp;
<a id=nuage title="3 occurences"class=tag2>telecharger theme ps3</a>&nbsp;
<a id=nuage title="3 occurences"class=tag2>psykopat</a>&nbsp;
<a id=nuage title="3 occurences"class=tag2>test need for speed prostreet</a>&nbsp;
<a id=nuage title="2 occurences"class=tag1>kookyoo</a>
</div>



Aperçu du nuage que nous essayons de générer.


Conclusion

Voilà, tout ceci n'est qu'une réflexion sur la construction d'un système de nuage de mots clés, les codes sont fournis à titre indicatifs et vous pouvez sûrement trouver des méthodes plus performantes, je ne suis qu'un amateur passionné ;) Si tel est le cas n'hésitez pas à participer dans les commentaires à l'amélioration de cet article.
J'espère que ce petit billet vous sera utile.
Maintenant c'est à vous, bon code !
 

Article suivant :
[Outil] Game Maker






Commentaires 8 commentaires

farwarx le 26 Novembre 2007 à 16:52

Je ne peux pas l'améliorer, je ne suis qu'administrateur... Mais l'idée est bien sympa. Tu en fais un pour kookyoo? Essaye de faire un beau citron avec des bonnes couleurs ^^

Seb le 26 Novembre 2007 à 17:19

lol, oui je suis entrain d'en faire un c'est pour ça que je publie ma réflexion histoire de la partager ;) pourquoi un citron ?

MfPierrot le 26 Novembre 2007 à 17:32

j'aime bien moi ce concept, ça donne de la fraicheur au site ^^ oui un citron ou un kiwi ;)

farwarx le 26 Novembre 2007 à 18:02

Ben pour la fraicheur! Un bon jus de citron! Ou un kiwi, c'est bourré de vitamines! Oubli pas ton slogan de base: Le blog des gens pas comme les autres. (je crois que c'est celui là). Bref fait nous un bon jus multi-vitaminés qui déchire comme on a l'habitude!

Seb le 26 Novembre 2007 à 18:38

ça marche on va voir ce qu'on peux faire ;)

farwarx le 27 Novembre 2007 à 13:03

Une question pour les mots clés dans Kookyoo. Quand je rédige un billet, je peux/dois en mettre combien mini/maxi ?

Seb le 27 Novembre 2007 à 15:37

Ni trop, ni pas assez ^^ En fait je dirais entre 3 et 10 grand maximum. En sachant que les premiers sont de poids plus fort que les suivants, donc pensez à les classer en conséquence.

farwarx le 27 Novembre 2007 à 20:07

Ça marche, merci!



.laisser un commentaire




Codes html interdits. Les liens sont convertis automatiquement.

Réalisation

Code & Design : Sébastien Cardona

Page générée en : 0.009315s