Les visuels de votre site sont très importants pour avoir un rendu attractif, design, et professionnel !
Dans cet article, vous trouverez le détail des formats adaptés aux différents types de visuels.
Les bannières
Une bannière est un emplacement dans lequel vous pouvez intégrer une image et du texte. Vous pouvez les faire apparaître en haut de chaque page de votre site internet.
Elles sont très importantes car elles sont la première chose que voit le visiteur lorsqu'il arrive sur les différentes pages de votre site !
Exemple d'une bannière avec une image, des titres et un bouton de prise de rendez-vous
À noter : pour choisir d'afficher ou non la bannière d'une page, rendez-vous dans l'onglet "Configuration" qui se trouve en haut à gauche de la colonne latérale.
Dupliquer une bannière (pour les clients en confirmé uniquement)
Si le design d'une bannière vous plaît et que vous souhaitez l'intégrer sur une autre page, il est possible de faire cette modification en deux clics, pour cela :
Passer votre souris sur la bannière
Cliquer sur l'onglet "copier la bannière d'une autre page"
Dans la fenêtre qui s'ouvre :
sélectionner la page source : pour sélectionner la bannière de la page que vous souhaitez copier.
Cocher "Copier et remplacer l'arrière-plan" : si vous souhaitez récupérer l'arrière-plan de la bannière de la page sélectionnée.
Cocher "Copier et remplacer la hauteur" : si vous souhaitez avoir une bannière possédant une hauteur identique que celle présente sur la page à copier.
Cocher "Copier et remplacer le contenu" : si vous souhaitez avoir un contenu identique que celui présent sur la bannière de la page à copier.
Puis cliquer sur valider.
Taille et dimension
Taille : 6 mo* maximum
Dimension en largeur : 1920px maximum
La hauteur est modulable en tirant sur la ligne orange sous votre diaporama
À noter : privilégiez un format paysage pour ne pas rogner votre photo.
Conseils : nous vous conseillons de ne pas mettre de conteneurs ainsi que de vidéos dans vos bannières, car cela peut rendre le rendu de votre site moins optimal.
De plus, les vidéos ne seront pas lues sur téléphone. Google déconseille fortement les vidéos qui tournent seules sans l’accord du visiteur en mobile. Il faut donc définir une image par défaut pour prendre la place en mobile !
Vous souhaitez savoir comment modifier une bannière ?
Les diaporamas
Un diaporama d'images vous permet de pouvoir faire défiler plusieurs images au même endroit.
Cela dynamise votre page en un clin d'œil !
Exemple d'un diaporama d'images
Taille et dimension
Taille : 6mo* maximum
Dimension en largeur : 1920px maximum
La hauteur est modulable en tirant sur la ligne orange sous votre diaporama
Vous souhaitez savoir comment modifier un diaporama ?
Les images
Les images sont très importantes pour votre site, pour le référencement naturel (SEO) mais également pour l'expérience utilisateur !
“Une image vaut mille mots”, dit l’adage.
Exemple d'une image positionnée sur la gauche d'un contenu texte
Taille et dimension
Taille : 6mo* maximum
Dimension : entre 300-1200px
200 pixels de large suffisent pour une petite photo
300 pixels de large suffisent pour une photo moyenne
1.024 pixels de large sont la norme pour le format maximum
À noter : conservez toujours le rapport hauteur/largeur d’origine de la photo. La hauteur se mettra automatiquement à l’échelle.
Vous souhaitez savoir comment modifier une image ?
*La taille des fichiers ne doit pas dépasser 6 mo. Cela permet d'éviter que votre site soit trop lourd, ce qui déplait à Google.
Vous pouvez faire appel à des logiciels pour compresser les fichiers images sans diminuer leur qualité :
ImageOptim et JPEGmini pour MacOS ;
PNGGauntlet pour Windows ;
Ou encore jpeg-optimizer et Compressor en open source en ligne.
Le résultat ? Des images optimisées pour les moteurs de recherche photo et une page qui charge plus vite !