La propriété CSS hidden (de même que « visibility:none ») permet de ne pas afficher le contenu qui la reçoit. C’est utile pour masquer des partie de formulaires, faire de sboutons qui vont afficher un contenu ou des images sans recharger la page, etc. Dans une optique SEO, cacher du texte optimisé par du hidden est une approche dangereuse : en cas de surdosage (et personne ne connaît la limite…), la sanction peut tomber pour suroptimisation (ce qui va vous faire reculer de quelques pages sur les expressions clés importantes).
L’heure n’est plus à l’usage de vieilles techniques largement connues de Google (et donc probablement filtrées). Si vous avez besoin de hidden pour la qualité du site perçue par vos visiteurs, utilisez cette propriété, mais limitez au maximum son usage. Trop de texte caché, c’est prendre le risque de devenir suspect.
Je l’ai testé sur un de mes sites, mais en diluant avec pas mal de texte normalement visible par ailleurs. A priori, je n’ai pas eu de sanction. Mais au risque de me répéter, mieux vaut jouer la carte de la prudence.
Les boutons « toggle ou autres « accordéons » utilisent ces propriétés pour une mise en page dynamique.
Réservez exclusivement l’usage de la propriété CSS « hidden » ou « visibility:none » à des contenus qui sont légitimes (mise en page, etc). Si vous pouviez vous en passer ce serait même mieux !
Je suis consultant indépendant en AdWords et SEO depuis plus de 10 ans. J'ai investi pour le compte de mes clients plus de 3 000 000 € de clics sur Google. Je suis auteur l'auteur du livre Trouvez des Clients avec AdWords. Bonne lecture !
[Officiel] les Exigences techniques de Google pour un site
[Test] SEO Quantum, l’outil SEO français pour des contenus (très) optimisés
Comment un vendeur de Darty m’a fait vendre 500 000 € de câbles HDMI sur mon site e-commerce !
[Infographie] 37 idées pour Avoir vos Premiers Visiteurs