agence de communication lyon

Webdesign : scroller ou ne pas scroller ?

C’est la tendance des deux dernières années dans le web design : les pages longues à scroller. Avec les nouvelles technologies comme HTML5 ou CSS3, il devient possible de créer des effets bien plus avancés dans le navigateur. Mais pourquoi est-ce si intéressant ? Et comment savoir si cette tendance peut être adaptée à votre site ?

Scroller, qu’est ce que ça veut dire ?
Commençons par le début, et levons le voile sur la définition du mot scroller :
« Dans une page web, l’action de scroller consiste à faire défiler une page vers le bas de l’écran pour y voir un contenu qui est en dehors du cadre de l’écran sur lequel la page est consultée. »

D’accord, mais quel intérêt ?
Le concept est plutôt simple : éviter la perte de temps due au chargement des informations et organiser au mieux son contenu de manière claire et accessible en un seul coup de roulette ou glissement de doigt. Cela répond également a une nouvelle mode dans le webdesign : épurer les pages pour pouvoir aérer le contenu et laisser la part belle au visuel. Pour cela, difficile de se restreindre à la fenêtre utilisateur !

De cette nouvelle façon de naviguer sont nés les sites dits « One Page ». Le principe ? Une page unique pour l’ensemble des contenus du site auxquels vous accéder uniquement via le scroll de votre souris. La navigation se fait donc à la verticale et non plus à l’aide de liens menant vers de nouvelles pages. Mais pas de panique : ce genre de sites proposent en général une aide à la navigation. Vous pouvez grâce à des ancres, ou des boutons, passer assez facilement d’un bout de la page à un autre.  À l’origine cette tendance du web design s’est développée pour s’adapter à la navigation sur smartphone afin de ne pas charger un nombre important de pages.

Ce système de navigation, libéré des contraintes d’une fenêtre utilisateur trop réduite, permet aussi de créer un dynamisme intéressant pour la présentation de vos contenus. L’effet parallaxe en est le parfait exemple. Mais qu’est ce donc ? Pour résumer simplement, l’effet parallaxe permet de créer une impression de profondeur et de plans multiples sur votre écran. Du 2D on passe maintenant à des effets 3D visibles lorsque l’on fait défiler la page. Mais on vous montrera ça dans un prochain article, parce que c’est tellement chouette, qu’on a bien envie de vous présenter ça plus en détails !

Je ne connaissais pas du tout, ça ne doit pas être si répandu !

Vous êtes sûrs ? Car si vous êtes un adepte des réseaux sociaux, vous utilisez cette méthode de navigation à chaque fois que vous allez consulter votre compte : le scrolling est un des outils majeurs de la navigation de ces réseaux. Tout sur facebook par exemple est pensé en navigation verticale : votre mur, votre fil d’actualité…  Vous pourriez scroller sans fin !

Un certain nombre de sites ecommerce s’y mettent également. La raison en est simple : un gain de temps conséquent (qui n’a pas déjà pesté devant le temps de chargement de la page n°5/100 de la catégorie pull-over et vestes ?). Tout afficher sur une seule page permet de garder les gens plus longtemps sur son site, et augmente donc la probabilité que leur visite se transforme en commande !

Ok, mais du coup… pour mon site, mieux vaut scroller ou pas scroller ?
Si vous envisagez de créer un site internet, vous allez forcément être confronté à ce choix.  Alors, il faudra vous poser quelques questions :

Quel type de contenus comptez-vous mettre en majorité sur votre site ?
Si la majorité de vos contenus sont constitués de visuels, et que votre argumentaire est assez synthétique alors ce type de mise en page est parfaitement compatible ! En revanche, si vous avez besoin de mettre une grande quantité de texte, ou que vous avez un certain nombre d’informations à communiquer, mieux vaut rester sur un système de site plus traditionnel ou l’utilisateur pourra passer d’une page à l’autre pour trouver ce qu’il cherche facilement.

Et votre clientèle, de quels types de profils est-elle composée ?
Nous pouvons donner l’impression d’enfoncer des portes ouvertes mais c’est pourtant l’une des premières questions que vous devez vous poser : QUI vient sur mon site. Car évidemment, tout le monde n’a pas les mêmes habitudes de navigation, et on ne peut pas demander à une grand-mère de 70 ans de s’adapter comme pourrait le faire un actif de 30 ans qui passe 15h/24h de sa journée devant un écran. Et sans même aller jusque là, (car sauf si vous faîtes un site internet spécial tricot, vous aurez sûrement d’autres cibles que notre petite mamie), certaines personnes restent encore réfractaires à ces nouvelles méthodes de navigation. N’hésitez pas à faire un sondage parmi vos clients pour cibler un peu mieux leurs habitudes à ce sujet.

Avez-vous un bon hébergeur ?
En effet, les sites qui affichent beaucoup de médias (vidéos, photos) risquent de ralentir la première page… Il faut donc vérifier que votre hébergement supportera ces contraintes, et permettra un affichage rapide de vos contenus, dans le cas contraire, vous risqueriez de voir partir vos utilisateurs… Dommage !

Avez-vous prévu un budget référencement ?
Car qui dit site « One Page » dit aussi moins de pages à scanner pour Google. Un critère à prendre en compte mais qui ne doit en aucun cas vous dissuader de passer le cap : des solutions existent pour permettre un référencement optimisé et contourner cette difficulté. Et vous savez-vous quoi ? On peut vous aider à le faire en plus, ça tombe bien non ? 😉

Et sinon, vous n’avez pas des exemples ?

Pour le plaisir des yeux, de la souris ou des doigts (si vous avez bien suivi !), nous vous invitons à voir les deux sites ci-dessous utilisant un scroll dynamique.

– Un site qui célébre les 25 ans de la Game Boy. Cliquez ici !
– Un site pour comprendre la différence entre Flash et HTML. Cliquez ici !

Ou encore, n’hésitez pas à visiter le site de Squadra Menuiseries, réalisé par vos humbles serviteurs !

Alors, convaincu ?
A vos marques, prêt, Scrollez !

Écrit par Md:réso, agence de communication Lyon.

Share Button

Poster un commentaire :