Tutoriel : Retailler des visuels pour son site internet

Par définition, un site administrable est un site Internet que l’on peut gérer soi-même via une interface d’administration. Cette offre a été longuement étudiée par notre équipe pour que vous puissiez modifier/ajouter du contenu. Vous pourrez aussi faire vivre votre site internet après sa livraison.

Pensé pour être accessible à tous, vous pourrez ajouter des liens, du texte, des vidéos ou encore des images. Cependant, il est parfois plus compliqué lorsqu’il s’agit d’ajouter ou modifier des visuels. En effet, lors de la création de votre site, nos web designers ont utilisé des logiciels professionnels de retouche photo.

Nous avons conscience que vous n’avez pas l’habitude d’utiliser de tels logiciels. C’est pourquoi nous vous proposons un petit Tutoriel simple et efficace pour que vous soyez à même d’ajouter des visuels aux dimensions idéales pour votre site !

I.  RÉCUPÉRER LA TAILLE D’UNE IMAGE

Vous avez décidé de modifier une image de votre site. Vous souhaitez donc connaître les dimensions de l’ancienne image pour que la nouvelle s’adapte parfaitement. Pour cela, nous vous conseillons d’utiliser le navigateur “Google Chrome” et d’y installer l’extension “Image info” .

Lorsque vous avez installé l’extension sur votre navigateur, vous pourrez voir qu’un petit icône la représentant c’est installé. Il est placé à côté de votre barre de recherche.

En cliquant sur cette icône, vous verrez qu’un petit carré rouge apparaît, cela signifie que l’extension est désactivée. Appuyez dessus pour la réactiver.

Une fois votre extension prête à l’emploi, rendez-vous sur votre site. Placez votre souris sur l’image que vous souhaitez modifier. Vous verrez alors qu’un petit bloc gris indiquant la taille de votre image s’affiche en haut à gauche de votre page. 

Vous connaissez maintenant la taille à laquelle redimensionner votre nouvelle image !

Néanmoins, si la taille ne s’affiche pas c’est que l’image a été ajoutée dans le code d’une manière plus complexe. TAO / SENSE vous transmet alors les dimensions des images à la livraison de votre site.

II.  RETAILLER VOTRE IMAGE AUX BONNES DIMENSIONS

Une fois que vous connaissez la taille à laquelle retailler votre image, nous vous invitons à vous rendre sur le site “www.fotor.com“. C’est un logiciel de retouche photo en ligne et gratuit !

Lorsque vous arrivez sur le site, appuyez sur « Dimension personnalisée » et entrez la taille à laquelle vous devez redimensionner votre image.

Vous allez ensuite être redirigé sur une nouvelle page où s’affiche un bloc blanc de la dimension que vous avez indiqué précédemment. Cliquez ensuite sur « + Importer »,  sélectionnez l’image dans vos fichiers et cliquez sur « Ouvrir ».

Votre image s’affiche maintenant en dessous du bouton « Importer ». Cliquez sur celle-ci et déplacez la sur le bloc blanc tout en maintenant votre clic.

Placez maintenant votre image en haut à gauche du bloc blanc et dirigez votre souris en bas à droite de votre image pour l’étirez. Lors de l’étirement de l’image, restez appuyé sur la touche MAJ (Shift) pour que l’image ne se déforme pas et garde son ratio.

Étirez l’image jusqu’à l’extrémité droite du bloc blanc afin qu’on ne puisse plus le voir. Vous pouvez maintenant centrer celle-ci comme vous le désirez en la déplaçant avec votre souris.

Attention : Si le visuel que vous voulez modifier est un logo (pour par exemple l’ajouter à la liste des partenaires de votre site), prenez pour modèle les autres logos qui sont sur le site. S’ils ne sont pas étirés sur toute la largeur du bloc, agrandissez ou diminuez leurs tailles et placez le simplement au centre du bloc blanc. 

Une fois le résultat attendu, cliquez sur le bouton « SAUVEGARDER » qui se trouve en haut de la page. Lors de l’enregistrement vous pouvez choisir l’option JPG ou PNG. Si votre image est un logo (comme sur l’image ci-dessus) il faudra enregistrer votre fichier en PNG pour que le fond de votre image soit transparent.

Vous n’avez plus qu’à ajouter votre nouvelle image sur votre site !