Meilleures pratiques Slider : ce que vous devez savoir

Publié: 2018-04-09

Vous souhaitez mettre un slider ou un carrousel sur votre site web ? Avant de faire cela, il y a de nombreux facteurs à prendre en compte. Un curseur mal placé et mal configuré n'est pas simplement ignoré ; cela peut en fait nuire au référencement et ennuyer les visiteurs.

Cela ne signifie certainement pas qu'ils sont mauvais, juste que, comme avec toute autre fonctionnalité ou plugin WordPress, vous devez vous assurer de le configurer correctement. Voici quelques-unes des meilleures pratiques à suivre lors de la mise en œuvre de curseurs dans votre site Web WordPress.

Rendez votre curseur visuellement agréable

En plus de l'esthétique générale, d'autres facteurs doivent être pris en compte. La pertinence globale du curseur, son emplacement sur la page et même la séquence d'images sont tous des aspects visuels importants à prendre en compte.

Rester simple

Surtout si vous activez la lecture automatique, il est extrêmement important que les diapositives soient simples, efficaces et vont droit au but. Cela ne s'applique pas seulement au texte ; à moins que vous n'utilisiez un curseur comme galerie pour votre art ou votre photographie, utilisez des images propres et épurées.

Ne le concevez pas comme une publicité

Grâce aux publicités intrusives, de nombreuses personnes développent une « cécité des bannières » - et un curseur mal placé et mal conçu peut être sujet à ce phénomène. Évitez tous les conseils de conception qu'un annonceur suivrait, en particulier les tactiques employées par les publicités les plus ennuyeuses.

Cela signifie qu'il ne faut pas utiliser de lumières clignotantes, de couleurs plates criardes, de polices Impact et similaires, et d'autres techniques distrayantes. Même si votre carrousel vend ou fait la promotion d'un produit, il doit se fondre dans le site Web et avoir l'air naturel. Vous voudrez peut-être que les gens regardent vos curseurs, mais ces tactiques agressives provoquent le contraire.

Rendez votre slider utile et pertinent

Chaque curseur que vous placez doit avoir un objectif clair. Met-il en valeur votre photographie ? Diriger les utilisateurs vers certaines parties du site ? Expliquez de quoi parle votre site ? Essayer de promouvoir un produit ? Engager les utilisateurs ?

Et placez vos carrousels au bon endroit. Le placement d'un curseur est l'un des facteurs les plus importants pour savoir s'il sera remarqué ou oublié. Assurez-vous qu'il n'est pas enterré dans le contenu de votre page ou placé au hasard. Il doit se trouver à un endroit stratégique et visible, comme dans une barre latérale, près du haut de la page ou sous un article de blog. Même le pied de page peut être un bon endroit pour mettre un curseur.

Choisissez soigneusement votre séquence de diapositives

Ne présumez jamais qu'un visiteur restera pour voir chaque diapositive. Choisissez votre séquence très soigneusement. Les premières diapositives devraient tenter d'engager et d'intéresser l'utilisateur, mais si cela échoue, assurez-vous au moins de faire passer votre message.

Cependant, ce n'est pas une excuse pour rendre vos autres diapositives moins efficaces. Quelle que soit la diapositive sur laquelle quelqu'un clique, elles doivent toutes servir leur objectif : parler de votre entreprise, montrer de superbes photographies, etc.

Rendez votre curseur utilisable

La règle cardinale des curseurs : ils doivent être faciles à utiliser et ne pas gêner les visiteurs. Il existe de nombreuses façons de rendre un carrousel plus accessible, de l'optimisation pour un large public d'utilisateurs mobiles à l'ajustement minutieux du temps de rotation des diapositives.

Pensez à désactiver la lecture automatique

Le mouvement peut être distrayant ou gênant pour certains utilisateurs. Sur les articles de blog ou sur une barre latérale qui suit les utilisateurs sur tout le site, désactivez toujours la lecture automatique ; distraire les visiteurs pendant qu'ils essaient de lire n'est jamais une bonne idée.

Cependant, dans certains cas, vous voudrez peut-être que le carrousel soit ce à quoi tous les visiteurs prêtent attention, ou il peut être important qu'ils voient plus d'une diapositive. Lorsque vous décidez d'activer ou de désactiver la lecture automatique, tenez compte de l'emplacement, du contenu et de l'intention du curseur.

Augmenter le temps entre les rotations

Si la lecture automatique est nécessaire pour votre conception, assurez-vous que les diapositives ne passent pas trop rapidement, surtout si elles contiennent du texte. C'est frustrant lorsqu'un curseur avance avant que vous ne soyez prêt. Optimiser pour un rythme de lecture lent ; mieux vaut un carrousel lent mais bien conçu qu'un carrousel qui pousse autant de diapositives que possible en dix secondes.

Optimiser les options de navigation

Il n'y a rien de plus ennuyeux que de cliquer sur une flèche de navigation et de faire avancer le diaporama à ce moment-là, vous obligeant à sauter une diapositive. La pause en survol ou en navigation est une fonctionnalité que beaucoup attendent. Les curseurs Soliloquy ont cette fonction et elle devrait être activée sur la majorité des carrousels que vous créez. Si vous choisissez de conserver la lecture automatique, cela est nécessaire.

Pendant ce temps, les carrousels qui avancent d'eux-mêmes, sans même une bulle de navigation ou un bouton de pause, peuvent irriter de nombreux utilisateurs car ils devront attendre que tout le cycle se termine juste pour trouver cette diapositive. Assurez-vous également d'ajouter des commandes de navigation à votre curseur.

Vous devriez également envisager des contrôles de navigation extra-larges , surtout si vous avez un public mobile ou âgé considérable.

Enfin, sur les carrousels contenant de nombreuses images, envisagez d'inclure des vignettes afin que les utilisateurs puissent facilement accéder à la diapositive spécifique qu'ils souhaitent.

Évitez d'endommager le référencement

Un curseur mal configuré est un curseur qui n'est pas adapté aux moteurs de recherche. Heureusement, de nombreuses mesures qui rendent votre site Web et son carrousel SEO-friendly les rendent également plus conviviaux ! Ces pratiques sont les plus importantes à suivre.

La réactivité d'abord

Si vous utilisez un plugin slider, vous n'aurez probablement pas à vous soucier de sa réactivité. Pourtant, cette partie est cruciale. Testez pour vous assurer que votre texte et vos images s'affichent bien sur tous les appareils. Ajustez la taille des boutons, remplacez les images floues ; tout ce que vous devez faire pour un beau curseur mobile.

Assurez-vous que le balayage est également activé. Les utilisateurs mobiles s'attendront à ce que les gestes de balayage fonctionnent pour des éléments tels que les curseurs, et si ce n'est pas le cas, cela peut causer de la gêne.

Conception pour l'accessibilité

Bien que vous deviez concevoir l'intégralité de votre site Web en gardant à l'esprit l'accessibilité, les curseurs doivent également être créés de cette manière. Non seulement cela aide les personnes handicapées à se déplacer, mais cela a tendance à améliorer le référencement.

Parmi les exemples d'une bonne conception de l' accessibilité , citons l'activation des commandes du clavier , l'évitement du défilement automatique ou de l'arrêt dans certaines conditions et la vérification du contraste suffisant du texte.

Créer une excellente image de héros Slider

Une tactique innovante consiste à remplacer une «image de héros» ou une bannière sur la page de destination qui explique en quoi consiste votre site Web, par un curseur animé. Cette technique a ses avantages et ses inconvénients. Un carrousel peut être aussi efficace qu'une image de héros standard, mais il doit être mis en œuvre avec soin.

Si vous décidez de mettre un slider sur votre page d'accueil, n'oubliez pas que les nouveaux visiteurs ont une question : de quoi parle ce site Web ? Chaque diapositive, à elle seule et sans contexte, devrait répondre à cette question.

Évitez les titres H1

Pour les moteurs de recherche, H1 fait office de titre de la page. Ainsi, lorsqu'il y a plusieurs en-têtes, comme dans un curseur, cela peut confondre le moteur de recherche et réduire le référencement. Pour plus de sécurité, évitez de les utiliser dans un carrousel.

Évitez les liens de navigation Slider uniquement

Y a-t-il une page sur votre site Web accessible uniquement via un curseur ? Essayez d'éviter cela; c'est déroutant à la fois pour les utilisateurs et les moteurs de recherche. Vous pouvez utiliser les curseurs de lien comme outil de navigation, mais assurez-vous qu'il existe une autre option.

Créer des curseurs efficaces

L'une des meilleures pratiques que vous pouvez suivre une fois que vous décidez de placer un carrousel sur votre site Web consiste à envisager d'utiliser un plugin, tel que Soliloquy. Surtout si vous êtes un nouveau développeur Web, essayer de créer vous-même un slider peut se terminer par un désastre SEO. Un plugin est beaucoup plus facile à utiliser et est spécialement optimisé pour WordPress et les moteurs de recherche.

Maintenant que vous connaissez quelques astuces pour placer un curseur utile, utile et engageant sur votre site Web, comment comptez-vous l'utiliser ? Nous espérons que ce guide vous a aidé dans vos futurs efforts de conception de sites Web. Et en attendant, rejoignez-nous sur Twitter et Facebook.

Enregistrer Enregistrer