Partagez :

Partager sur facebook
Partager sur linkedin
Partager sur twitter
Partager sur email

Vous avez peut-être entendu parler du SXO, le successeur prétendu du SEO. Derrière ce gros mot, se cache en réalité le Search eXperience Optimization. Ok, mais concrètement, qu’est ce qu’on fait ??? En fait, on continue de faire ce qu’un bon référenceur a toujours fait mais avec un périmêtre plus large puisqu’il permet à la personne en charge du SXO d’exercer ses recommandations sur l’UX également pour le bien du SEO en même temps.

Je sens que vous voulez un exemple d’interaction entre l’UX et le SEO. On pourrait vous parler contenu ou même maillage, mais j’ai choisi de vous parler techos. Prenons l’exemple d’une page catégorie sur un site ecommerce. Sur cette page se trouve les blocs teasers des pages produits, et c’est sur ça que l’on va démontrer l’intérêt du SXO. « Monsieur SEO » souhaite que seul le titre h2 du produit soit clicable avec un beau href ; mais « Monsieur UX », lui, veut que tout le bloc soit clicable pour augmenter l’affordance ! Pas de soucis « Monsieur SXO » a la réponse !

sxo teaser bloc

1. Faire plaisir à « Monsieur SEO » avec un balisage nikel dans le rendu html :

<div id="produit-1" class="teaser">
<div class="teaser-img">
<img src="big/image-1-1.jpg" alt="mon super produit">
<div class="teaser-img-thumb">
<img src="thumb/image-1-1.jpg" alt="mon super produit">
<img src="thumb/image-1-2.jpg" alt="le produit de mes rêves">
<img src="thumb/image-1-3.jpg" alt="produit coloré">
</div>
</div>
<h2><a href="url-produit">Titre produit 1</a></h2>
<p>Description courte de mon produit 1</p>
</div>

Il n’y a pas un vieux ahref qui traîne autour du bloc., le html est clean et structuré, et voilà il est content !

2. Faire plaisir à « Monsieur UX » en rendant le bloc clicable avec du Jquery :

$('.teaser')
.css('cursor','pointer')
.click(function() {
window.location.href = $(this).find('a').attr('href');
});

Et voilà !

3. Attention, « Monsieur SEO » a entre temps bien entendu demandé à ce que ce JS soit externalisé (dans un fichier séparé) et contextualisé (c’est à dire chargé uniquement sur les pages qui en ont besoin)

4. « Monsieur UX » en profite pour remarquer que le bouton ajouter au panier n’est pas présent. Oui car « Monsieur SEO » ne souhaite pas créer du bruit éditorial sur chaque bloc teaser. Autant le rajouter en JS alors ! Un truc du genre :

$('.teaser').append('<button id="btn-'+$(this).attr('id')+'"></button>');

Merci le SXO !
Ceci est un exemple simple qui, je l’espère, vous permet de vous projeter vers le potentiel technique de cette interaction entre le SEO et l’UX.

Partagez :

Partager sur facebook
Partager sur linkedin
Partager sur twitter
Partager sur email
Sylvain Garin

Sylvain Garin

Inscrivez-vous à notre newsletter !

C’est l’occasion pour vous de recevoir régulièrement un concentré d’infos qualitatives sur les dernières tendances du digital, ainsi que les nouveautés de l’agence.

Encore plus d'actualités SEO :

Non classé

SEO en période de confinement : notre plan d’action

Ça y’est la France est de nouveau confinée. Un confinement certes allégé, mais qui modifie forcément les habitudes des utilisateurs. C’est pourquoi La Revanche des Sites vous propose quelques « best practices » à mettre en place dans vos stratégies web marketing.

Non classé

Nouveau logo, nouvelles ambitions

Comme vous le savez peut-être, la revanche des sites a récemment rejoint le Groupe Qwamplify pour réaffirmer son expertise et sa présence nationale au côté

Boostez votre trafic web grâce au Coaching SEO !

Grâce à l’utilisation de l’email, du téléphone et de sessions de partage d’écran, nous pouvons vous fournir rapidement et efficacement l’accompagnement dont vous avez besoin !