Comment créer des visuels pour son site internet avec Canva ?

Webmarketing et SEO

Je pense que vous n’avez pas envie que votre site ressemble à celui de votre principal concurrent?
Au contraire, vous voulez une vraie présence, un site internet qui marque chaque visiteur qui y passera.
Pour que le contenu de chaque page représente à 100% qui vous êtes. Et pour ça, pas besoin d’être un mix d’artiste et de geek. Il existe une solution plus facile que tout ce que vous pouvez imaginer.
Créer des visuels pour son site internet avec Canva.
Des éléments graphiques sur mesure pour illustrer vos contenus écrits.

 

Si vous travaillez avec un.e graphiste pour créer des visuels pour votre site internet,

il ou elle s’occupera de vous créer des visuels pour les intégrer au site.

Vous pourriez avoir des icônes aux couleurs de votre marque, des illustrations, des patterns pour habiller les fonds blancs, des bannières, etc.
Mais si vous créez votre site internet vous-même, vous trouvez peut être que tout ça manque de personnalisation.
Des fonds blancs, des colonnes, des images… Vous êtes plus fun que ça non?

Sauf que, je comprends bien :

  • Vous êtes bridée par la technique, les supers effets en CSS c’est un peu trop extrême pour vous
  • Vous n’avez pas Photoshop
  • De toute façon, vous n’avez pas envie de passer la moitié de votre budget dans Photoshop et ses amis
  • Et en toute honnêteté, vous ne comprenez absolument rien au fonctionnement de Photoshop et je vous comprends 🤦‍♀️ (mais comment sectionner le bon calque au secours!!!)

Heureusement, même les plus novices ont un outil miracle pour leur permettre de créer de jolis visuels pour leur site internet : Canva.

Et le mieux dans cette affaire : c’est gratuit!
La version payante vous permettra de faire encore plus de miracles, mais pour un début, ce sera déjà pas mal. Trop beau pour être vrai? Même pas.

Pour commencer, regardons comment créer 4 visuels pour votre site internet avec Canva.

 

maquette page d'accueil site internet Canva

Créer des icônes personnalisées pour votre site web avec Canva

Canva vous permettra d’abord de créer des icônes pour votre site web et d’autres petites illustrations comme des pictogrammes.

Par exemple, vous pourrez les utiliser quand vous laissez le choix entre 3 options à vos clients, comme vos 3 types d’offres.

Illustrer ça par 3 pictogrammes assortis sera beaucoup plus harmonieux et plus simple à comprendre.

Les pictogrammes permettent de comprendre instantanément de quoi on parle, du moins si les illustrations sont claires. (N’oubliez pas de quand même mettre le titre en dessous, au cas où quelqu’un ne comprenne pas ou ne voie pas les images.)

Comment créer des icônes pour son site internet avec Canva?

  • Commencez par créer un nouveau design carré sur Canva, de petite taille (200px par exemple).
  • Dans la bibliothèque d’éléments proposés par Canva, choisissez les icônes dont vous avez besoin.
    Vous pouvez taper des mots clés dans la petite barre de recherche pour trouver l’icône idéale : « enveloppe », « téléphone », « docteur », etc.
    D’ailleurs vous aurez de meilleures chances en tapant les recherches en anglais.
  • Ensuite, vérifiez que vous avez bien un petit nuancier de couleurs qui s’affiche en haut à gauche.

  • Celui ci vous permettra de modifier chaque couleur de l’icône pour y mettre votre propre palette.
  • Si vous n’avez pas de compte Canva Pro, vous n’aurez pas la possibilité de télécharger le visuel en .PNG avec un fond transparent.
    Dans ce cas, choisissez la couleur de fond de la même couleurs hexadécimale (avec le signe #) que le fond de votre page.

Note : Pensez bien à la taille des images. Inutile de faire des icônes très grandes, elles risqueraient d’alourdir inutilement la page et de ralentir le site. Pour un pictogramme (qui occuperait pas exemple une colonne sur 3), 200 à 300px sont largement suffisant (moins de 100px pour de petites icônes type « réseaux sociaux »).

Créer un entête d’e-mail pour sa boutique en ligne avec Canva

À l’aide de Canva, vous pouvez personnaliser les e-mails que vous envoyez à vos abonnés, mais aussi aux clients de votre boutique en ligne.

Cet article pourrait vous intéresser : « Comment garder les clients plus longtemps sur votre boutique en ligne? »

Lorsque quelqu’un passe une commande, il reçoit un e-mail automatique de confirmation, mais aussi d’autres messages selon les réglages que vous aurez choisi (« Paiement accepté », « Commande en cours », etc.).

Mais les e-mail par défaut sont souvent un peu moches…

Ceux de Woocommerce ont par exemple une vilaine bannière d’entête violette (qui est la couleur officielle de WooCommerce (et la couleur officielle des tramways dijonnais 😏✌️)).

Vos clients seraient bien plus rassurés s’ils recevaient un vrai e-mail aux couleurs de la marque. Ils auraient beaucoup moins l’impression que la boutique a été crée il y a 5 minutes !

Pensez donc à créer des entêtes aux couleurs de votre entreprise avec Canva, surtout si vous avez un univers singulier. Vos clients apprécieront que votre univers se prolonge jusque dans les mails transactionnels habituellement ennuyeux.

En plus, ça ne pourrait pas être plus facile : Canva vous propose directement de faire ça.
Rendez vous sur la page d’accueil de Canva, et parcourez la liste des designs.

Vous allez y trouver « entête de mail ». (vous pouvez aussi le chercher avec la petite barre de recherche).

Comment créer une entête d’e-mail avec Canva?

  • Ouvrez ce design, choisissez un modèle si vous voulez, ou faites un design personnalisé.
    C’est assez simple, il vous suffit de choisir une image dans la bibliothèque d’éléments ou de télécharger l’une des vôtres. Ensuite, glissez là jusqu’aux bords du cadre pour qu’elle s’applique automatiquement à tout votre design.
    Vous pouvez baisser son opacité si vous voulez la rendre plus discrète, ou simplement choisir une simple couleur de fond.
  • Choisissez ensuite une police proche de celles de votre site, et inscrivez au milieu le nom de la boutique, en blanc si la photo de fond est sombre, et inversement. Et c’est tout!
  • Ajouter éventuellement votre logo, mais pas plus, au risque de surcharger la bannière.

N’ajoutez pas non plus de texte (par exemple « votre commande chez… »).
Il faut que cette bannière reste neutre pour pouvoir être affichée sur TOUS les modèles d’e-mails de la boutique.

Créer des visuels et des mockups avec Canva

Si vous vendez des produits virtuels (comme des formations en ligne) ou des prestations en rapport avec le numérique (social media management, coachings en ligne, etc.), vous pourriez les montrer à vos clients dans des mockups.

Ces maquettes représentent un écran (d’ordinateur, de smartphone, etc.) avec vos produit affiché à l’écran. Sans que vous n’ayez à prendre vote propre téléphone en photo ✌️

Réaliser un mockup sur Photoshop demande un peu de compétences, mais avec Canva, c’est automatique.

Canva vous propose des cadres dynamiques.
Écoutez bien, c’est presque magique… Vous n’avez qu’à y glisser-déposer l’image à afficher à l’intérieur de l’écran, et elle s’ajuste automatiquement !
Vous n’avez rien à faire… C’est d’une honteuse simplicité!

Comment faire une maquette d’écran d’ordinateur avec Canva? (ou de smartphone, ou de tablette)

  • Rendez vous dans la bibliothèque d’éléments de Canva

  • Dans la rubrique « cadres », et cherche le modèle qui vous plait : un ordinateur, un iPhone, une tablette, etc.
    Vous pouvez aussi faire une recherche.
    Attention à bien choisir un modèle d’écran qui a un fond « paysage », vert et bleu!
    Ça signifie qu’il est dynamique, et qu’il ajustera automatiquement l’image à l’intérieur.

  • Mettez tout ça dans votre document, ajoutez des éléments autour si vous le souhaitez, ou des textes pour décrire votre produit.
  • Réglez la couleur de fond pour qu’elle soit la même que celle de votre site.
  • Choisissez ensuite l’image à mettre à l’intérieur de l’écran. Faites simplement une capture d’écran de la page que vous souhaitez montrer, soit de votre ordinateur, soit de votre téléphone.
    Gardez à peu près la même largeur pour que tout soit visible  sur la maquette.
    Par exemple, si vous avez un grand écran d’ordinateur de bureau, et que vous faites une maquette de MacBook, réduisez votre fenêtre avant de faire la capture d’écran car les petits ordinateurs portables sont beaucoup moins larges.
  • Importez cette capture d’écran dans Canva, et faites la glisser dans le document.

  • Double cliquez sur l’image si vous souhaitez affiner son alignement grâce aux 4 points qui s’affchent dans els angles, et c’est bon!
  • Ajoutez des textes ou des éléments graphiques, et votre mockup est prêt.

Vous n’avez plus qu’à télécharger cette image et à la compresser avant de l’ajouter sur votre site. Et vos futurs clients peuvent maintenant visualiser à quoi ressemble votre produit, même virtuel.
C’est très rassurant pour eux lors du processus d’achat!

maquette page d'accueil site internet Canva

Customiser les images de son site internet avec Canva

Créez des effets de superposition pour habiller les images

Si vous trouvez que certaines images de votre site sont un peu « nues » et ont l’air perdues au milieu des pages, vous pouvez les customiser et les habiller aux couleurs de votre marque.

  • Importez votre image dans votre espace Canva, dans un document qui fait à peu près la même taille.
    Voyez quel espace vous voulez laisser à gauche et à droite pour les décors.
  • Rendez vous ensuite dans la bibliothèque Canva et choisissez les éléments qui vous plaisent et qui correspondent à votre univers.
    Conseil : pour des formes abstraites qui peuvent aller avec tous les styles, tapez « abstract » dans le moteur de recherche des éléments.
    Conseil n°2 : ne choisissez pas d’éléments animés, sinon votre document sera une vidéo qui risquerait de ralentir le chargement des pages.
  • Ajoutez les éléments au document, et jouez avec les différents plans : vous pouvez les mettre sur l’image ou en dessous, en cliquant sur « Position », en haut à droite.

  • La plupart des éléments peuvent être modifiés : ajoutez donc les couleurs de votre propre palette.

Vous pouvez également mettre l’image dans un cadre

pour donner du relief ou changer sa forme.
Toujours dans éléments, choisissez la section « cadres » et parcourez les modèles.
Grâce à ça, votre image banale pourra devenir ronde, en forme d’arche, ou avec des effets.

La seule chose que vous ne pouvez pas customiser est la couleur de fond, sinon vous aurez un grand rectangle de couleur autour de la photo sur le site…

Donc choisissez bien une couleur de fond similaire au fond de votre page.

Facile à utiliser et gratuit, Canva est vraiment une aubaine pour tous ceux qui créent leur site eux même et qui aimeraient le personnaliser plus en profondeur.

Créer des visuels pour votre site internet avec Canva va vous permettre d’avoir une image beaucoup plus professionnelle.
D’ailleurs, tous mes templates de sites internet sont  fournis avec des modèles de visuels Canva, à personnaliser avec un compte gratuit. Ce qui permet aux personnes qui créent leur site elles-même et ne possèdent pas d’outils comme Photoshop de créer de jolis visuels assortis à leur marque sur toutes les pages du site.
Toutes les illustrations de cet article sont incluses dans le template Johanna.

Épinglez cet article sur Pinterest pour le retrouver plus tard.

Personnalisez entièrement votre site web : apprenez comment créer des visuels originaux pour votre site internet avec Canva? Icones, bannières, décors, créez gratuitement une identité visuelle sur-mesure pour votre boutique en ligne.  . Par Andrea Studio, création de sites internet pour photographes et entrepreneuses créatives, templates et thèmes WordPress.
Comment créer des visuels originaux pour son site internet avec Canva?
Comment créer des visuels originaux pour son site internet avec Canva?
a propos - creation de site internet à dijon

Hello !

Je suis Morgane,

Je crée des sites web audacieux pour les entrepreneures créatives.

ebook créer son site web 1

E-books offerts

4 ressources gratuites
à télécharger

exemple site internet hypnotherapeute

Améliorer son site

en une journée

ebooks offerts

Mes meilleurs conseils pour votre site web

Lequel pourrait vous aider?

ebook créer son site web 1

30 étapes

Créer son site internet soi-même

ebook créer son site web 1

18 conseils

Créer un portfolio de photographe

ebook créer son site web 1

10 astuces

Améliorer son site internet rapidement

Réservez

Une journée VIP

Une journée complète pour travailler sur votre site WordPress

crééer site internet soi même coach

avant de partir

Avez-vous pensé à lire ces articles?

Utiliser les modèles Divi pour créer un site web plus vite

Utiliser les modèles Divi pour créer un site web plus vite

L’un des grands avantages de Divi, c’est son incroyable catalogue de modèles de sites web. Lorsque Divi est installé sur votre site internet Wordpress, vous avez un accès direct à plus de 2000 modèles de pages. Et ces templates Divi sont tous gratuits, sans aucun...