Design de blog : ressources graphiques pour nuls en design !


Dans la vie, il y a les gens dotés d’un vrai sens graphique… et les autres ! Pour ma part, je n’ai pas hérité de ce talent qui consiste à bien savoir associer les couleurs, trouver de jolis motifs pour faire un fond d’écran créatif et original pour son blog. Alors j’ai décidé de partager avec vous quelques sources qui m’ont déjà aidée au fil de mon parcours sur le web pour trouver des associations de couleurs ou de jolis motifs pour créer ou personnaliser son design !

Si ce type d’article vous plaît, j’aurai bien d’autres sites à vous faire découvrir car le web ne manque pas de sources de qualité !

1. Subtle Patterns

Subtle Patterns vous permet de télécharger des tas de motifs modernes à utiliser comme fond ou à intégrer à une créa graphique. On y trouve plusieurs centaines de possibilités, depuis des formes très géométriques jusqu’à des textures, en passant par de petits dessins. Comme l’indique le nom du site, ça reste “subtil”.

Le bonus, c’est que si vous utilisez Photoshop, il existe un plugin Subtle Patterns qui vous permet de chercher et utiliser des motifs sur le site directement depuis le logiciel.

Subtle Patterns : motifs à télécharger

2. Colour Lovers

Colour Lovers est une vraie mine d’idées en matière de design. Il propose d’une part des palettes de couleurs qui vous aideront à bien associer les teintes mais aussi une multitude de motifs, des plus sobres aux plus décalés ! Avec presque 5 millions de motifs disponibles, impossible de ne pas trouver une idée, la difficulté consiste plutôt à choisir parmi toutes ces possibilités !

Le gros bonus, c’est que pour chaque motif on vous donne les couleurs principales qui le constituent. Une aide précieuse pour créer un vrai univers visuel à partir du motif (en choisissant par exemple la couleur des liens de son site en accord avec le motif de fond).

Colour Lovers : motifs et palettes de couleurs

3. Adobe Color

Vous ne savez pas associer les couleurs ? Adobe le fait pour vous, sur le site Adobe Color. Il suffit de choisir quel type de palette vous voulez créer (camaïeu, couleurs complémentaires, etc) puis de tourner la roue. Le site vous donnera automatiquement une liste de couleurs assorties. Ici par exemple, j’ai fait le test avec un camaïeu de verts :

Adobe Color : palettes de couleurs

4. Icon Finder

On a toujours besoin de p’tites icônes sur soi. Non, ce n’est pas une fable de La Fontaine 2.0 mais presque. Sur Icon Finder, vous trouverez littéralement des milliers et des milliers d’icônes. Certaines sont payantes mais il y a aussi énormément de choix en gratuit : des icônes de réseaux sociaux, des icônes réalistes sur tout un tas de sujets (fêtes, plage, nourriture, high-tech, etc).

Icônes gratuites

5. Colour Code

Colour Code ressemble à Adobe Color mais offre un mode de navigation un peu différent. Le principe est simple : dans la colonne de gauche, vous choisissez un type de palette de couleurs : un camaïeu, un camaïeu intégrant du gris foncé ou du gris clair, des couleurs complémentaires, etc. Ensuite, vous n’avez plus qu’à promener votre souris dans la zone de droite pour obtenir des milliers d’associations de couleurs… et plus vous descendez, plus les couleurs sont claires !

C’est un outil très intuitif et facile à utiliser. Voilà par exemple une palette de couleurs acidulées pour l’été !

Palette de couleurs Color Code

6. Canva

Canva est un site très connu mais il est tellement facile à utiliser que je ne pouvais pas l’exclure de ma sélection. Il faut juste créer un compte gratuit et ensuite, vous pouvez créer des compositions graphiques en faisant un simple glisser-déposer.

A gauche, on vous donne le choix entre une vaste sélection de lignes, de cadres, de photos, d’icônes, d’illustrations… Vous pouvez aussi choisir des mises en page prédéfinies, ajouter du texte avec de jolies typos, importer vos propres visuels, appliquer des filtres sur les photos… Bref, c’est un outil qui a été pensé pour les nuls en graphisme !

Le site de graphisme Canva

7. Piktochart

J’ai testé beaucoup d’outils pour faire des infographies, c’est encore un format que je n’utilise pas trop sur le blog mais je sais qu’il est très populaire. Une infographie peut être un bon moyen de présenter d’une manière très visuelle les résultats d’une étude, son portrait sur la page “A propos” de son blog, ses derniers achats ou son dernier voyage… Moyennant un peu de créativité, chacun peut y trouver son compte.

Même en ayant testé plein d’outils, je finis toujours par revenir au même : Piktochart. Il est très facile à utiliser, très intuitif, on peut soit créer une infographie en partant de rien, soit exploiter l’un des templates déjà prêts (il y a du choix en gratuit comme en payant). Vous pouvez soit récupérer votre infographie sous forme d’image, soit la partager depuis le site de Piktochart, auquel cas le texte est sélectionnable.

Piktocharts, outil de création d'infographies

Il y aurait beaucoup d’autres outils à citer mais ces 7 là sont ceux qui me servent régulièrement sur le blog ou sur mes autres sites !

Et vous, quels sont vos ressources préférées en matière de design ?
Thèmes : Design 

Poster un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

39 commentaires sur “Design de blog : ressources graphiques pour nuls en design !

  • Charlie

    Avant tout, merci d’avoir eu l’idée de créer ce blog : c’est vraiment une mine d’or pour les blogueurs et les non-blogueurs.
    J’ajouterai que Canva est de loin le meilleur outil pour créer des contenus sympas pour les nuls. Je l’utilise autant dans ma vie pro que perso

    Répondre à Charlie
    • Marlène

      Je trouve ça très pratique aussi, c’est pensé pour les gens qui n’ont pas un sens graphique très développé ^^

      Répondre à Marlène
  • Lisa

    Bonjour,

    Merci pour cet article, les sites sont super !
    Pour le fond de mon blog je veux utiliser une image du premier site, et avec mes template je peux le changer que dans le code html, sauf que quand je le change avec l’url de l’image, ça ne change pas…
    Voici le code html :
    body {
    background:url(‘http://img11.hostingpics.net/pics/634779seamlesspapertexture.png’);
    margin: 0;
    color: $textcolor;
    font: x-small Tahoma;
    font-size/* */:/**/small;
    font-size: /**/small;
    text-align: left;
    }

    Est-ce que vous avez une idée ?
    Merci, bonne journée :)

    Répondre à Lisa
    • Marlène

      Bonjour Lisa, je suis passée sur le blog et il y a une erreur de code, le lien actuel est fait en HTML et pas en CSS (tu n’utilises pas le bon langage informatique). Je vois ça au niveau de la ligne background :
      url('<a target="_blank" href="http://www.hostingpics.net" title="Hebergeur d'image"><img src="http://img11.hostingpics.net/pics/634779seamlesspapertexture.png" border="0" alt="Hebergeur d'image" /></a>')

      Et il faudrait ça :
      url('http://img11.hostingpics.net/pics/634779seamlesspapertexture.png')

      Répondre à Marlène
    • Lisa

      Ça fonctionne, merci beaucoup :)

      Répondre à Lisa
  • Azranail

    J’avoue que je suis pas fan de divers motif, je suis plutôt sobre. Mon site l’est trop je pense. J’avoue que je me lance et que je ne m’y connais pas vraiment.
    Les touches de couleurs sont dans les articles grâce aux photos et aux mots mis en évidence…
    Pour le reste, j’avoue que je suis pas très douée -_-‘
    Merci beaucoup, c’est grâce à vous que j’ai réussi à le faire donc il est pas si mal ^^

    Répondre à Azranail
    • Marlène

      La sobriété est à la mode ! Concernant les motifs, ils ne servent pas forcément dans le design du site lui-même, ils peuvent servir de fond dans des infographies par exemple :)

      Répondre à Marlène
  • Manue

    Je ne connaissais que iconfinder dans tous les sites que tu cites. Canva à l’air pas mal, je pense que je vais le tester :) Merci pour ces découvertes !

    Répondre à Manue
    • Marlène

      Canva est très sympa parce qu’on arrive facilement à faire de jolis visuels dessus sans passer des heures à se creuser la tête pour comprendre comment ça fonctionne !

      Répondre à Marlène
  • Emilie

    Je découvre toutes ces applications surement bien utiles, merci !

    Répondre à Emilie
    • Marlène

      Colour Lovers est vraiment plein d’idées, j’avoue qu’il me donne même envie de piquer des idées pour de la déco parfois (motifs pour des coussins, etc) !

      Répondre à Marlène
  • elo

    Encore un super article pour nous aider, j’adore et merci !!!
    Ce mois ci je vais me pencher sérieusement sur mon blog, et tous tes articles vont beaucoup m’aider !!!

    Répondre à elo
  • Letizia

    Canva est vraiment sympa mais je ne l’ai encore jamais utilisé. Je vais souvent chercher mon inspiration sur Pinterest et ensuite je refais les images toute seule. Je note pour Piktochart, c’est sympa les infographies, j’en utilise pas du tout sur mon blog. Sinon je travaille aussi sur Lightroom et je ne pourrais plus m’en séparer. J’utilise Photoshop, Illustrator et la palette Adobe au travail mais je ne peux les utiliser de façon personnelle que si je prends mon ordinateur du travail à la maison. Lightroom c’est surtout parce que c’est facile, instinctif et très pratique pour retoucher les photos. Je l’utilise pour ranger et taguer mes images pour les retrouver plus vite et surtout, il ne change pas l’image de base, c’est juste des masques. J’adore! Après c’est clair que pour faire des logos, pour mettre des textes sur des images et faire du “graphisme” ce n’est pas le bon programme.

    Répondre à Letizia
    • Marlène

      En fait j’ai l’impression que ce côté tagging/rangement est vraiment le gros point fort de Lightroom. Sur Photoshop je pense que tu peux aussi ne pas changer l’image de base (il suffit de faire les modifs sur un calque d’arrière-plan dupliqué, comme ça tu gardes l’image non modifiée en arrière-plan). A moins que tu ne parles d’autre chose :)

      Ce qui est bien depuis qu’Adobe est passé au cloud c’est que les prix sont devenus vraiment abordables !

      Répondre à Marlène
    • Letizia

      Alors… Lol :) Pour une fois que je peux t’expliquer quelque chose, je vais essayer de m’appliquer!

      Lightroom est conçu pour importer, classer, trier, annoter ou géolocaliser ces images. On peut également faire des retouches (très rapides et très instinctives). Il permet également de lire les images RAW que les photographes aiment tant et d’ensuite les importer au format de son choix. Tu peux également l’utiliser pour imprimer des albums photos, préparer des planches contact ou créer des pages hmtl pour publier tes images sur le web.
      Lightroom n’a pas la fonction de calque qui est si cher à Photoshop. Toutes les retouches que tu apporteras à ton image seront en fait un fichier joint, tu peux revenir à ton image de base en un clic et le gros avantage c’est que si tu as fait des supers réglages à tes photos “vacances à la plage”, tu peux les généralisés à toutes ta collection en un tour de main.

      Après nous sommes d’accord qu’Adobe a très bien fait son travail et qu’il a rendu ses logiciels complétement complémentaires et que ça ne servirait à rien que Lightroom puisse faire la même chose que Photoshop :) Je trouve que Lightroom est plutôt basé sur la retouche et le classement (c’est utile de retrouver toutes tes photos grâce à un mot clé) alors que Photoshop c’est vraiment du travail et de la création mais il faut également savoir s’en servir. A chacun de trouver la voix qu’il préfère :)

      Répondre à Letizia
    • Marlène

      Merci de tes explications, je vois mieux la différence ! En fait ce sont pour la plupart des choses que je fais déjà avec Toshop : ouvrir les RAW grâce à Camera Raw, garder l’image de base comme calque d’arrière-plan, idem pour le côté automatisation des modifs pour les appliquer à plusieurs photos. Mais comme c’est une appli dédiée je suppose que c’est bien plus simple et direct. Il faudra vraiment que je le teste ! Merci encore pour les précisions :)

      Répondre à Marlène
  • Bernieshoot

    Pour les photos j’utilise photoshop,et pour le design du blog j’ai pris as it un de ceux fournis par la plateforme hébergeant mon blog.

    Répondre à Bernieshoot
    • Marlène

      C’est top quand on arrive à trouver un design “prêt à l’emploi” qui correspond à ce qu’on recherche, ça évite bien des pertes de temps :)

      Répondre à Marlène
    • Bernieshoot

      Disons que je n’ai pas les compétences pour faire évoluer le design et ce n’est pas mon principal centre d’intérêt. j’ai trouvé un compromis avec un design assez minimaliste qui laisse la place au contenu ce que j’essaye de privilégier

      Répondre à Bernieshoot
    • Marlène

      J’ai lu un article récemment, sans me souvenir où je l’ai vu, d’un blogueur professionnel qui disait justement que selon lui, perdre du temps sur le design était inutile. Il incitait à adopter un thème simple et efficace en disant que par expérience, tant que le contenu est très pertinent, ça suffit, le design n’est qu’un “bonus”.

      Répondre à Marlène
  • Sarah, Les Jolis Mondes

    Merci pour toutes ces astuces :) J’utilise déjà Canva (ainsi que Fotor pour les montages photo) et Piktochart mais je ne connais pas les autres outils, je vais les tester. Bonne journée !

    Répondre à Sarah,
    • Marlène

      Ah je ne connais pas Fotor, je vais aller voir ce que c’est !

      Répondre à Marlène
  • Jülide

    ton article est une vraie mine, je note notamment pour le numéro 2!

    Répondre à Jülide
    • Marlène

      On trouve des trésors sur ce site et pas seulement pour le web ! On avait trouvé un joli motif dessus avec des amis et on l’avait ensuite fait imprimer sur le fond d’un plateau en bois pour faire un plateau personnalisé original et moins “kitsch” qu’un plateau avec une photo.

      Répondre à Marlène
  • Planète-Beauté

    Merci pour tous ces liens, je crois que je ne connaissais pas un seul de ces sites ! Ils sont hyper inspirants, ça donne tout un tas d’idées qu’il ne reste plus qu’à mettre en pratique?

    Répondre à Planète-Beauté
  • AU303

    Merci pour ces liens ! J’en souffle un autre que j’ai utilisé pour refaire la nav de mon blog, un générateur d’icones : Iconion http://iconion.com/fr/

    Répondre à AU303
    • Marlène

      Oh ça a l’air sympa ! Apparemment ce logiciel intègre Font Awesome (c’est la police d’icônes que j’utilise pour le blog !), j’ai d’ailleurs prévu de faire un tutoriel pour montrer comment l’installer sur un blog :)

      Répondre à Marlène
  • AnnLauLau

    Super ! Merci pour ces tuyaus, je ne connaissais pas certains de ces sites et j’ai très envie de les découvrir !

    Répondre à AnnLauLau
  • Cécilia Autour de Cia

    Ah ah, je suis une grande fan de Piktochart. je n’attends qu’une chose pouvoir me payer la version payante :)

    Répondre à Cécilia
    • Marlène

      Il faudrait que plusieurs blogueu(r/se)s te commandent des infographies personnalisées pour que tu atteignes le montant de l’abonnement annuel ! C’est vrai que c’est un super outil et tu trouves toujours de bonnes idées pour t’en servir en plus :)

      Répondre à Marlène
  • Pazzapa

    En infographie, j’ai opté pour Visme que j’adore. N’ayant sens du beau et de l’association des couleurs, je vais souvent sur Colour Lovers qui propose vraiment une multitude de possibilités…sinon, je travaille beaucoup sur Photoshop en attendant d’avoir lightroom pour travailler mes photos…

    Répondre à Pazzapa
    • Marlène

      Je suis #TeamPhotoshop aussi. C’est marrant mais je n’ai jamais vu l’intérêt d’avoir Lightroom (le côté tagging et classement des photos ne m’intéressant pas vraiment). Avec Photoshop on a déjà tellement de possibilités : réglage des niveaux, travail sur la colorimétrie, retouche, il y a tous les filtres aussi… Si tu repasses par là, je suis curieuse de savoir ce que Lightroom apporte de plus que Photoshop et pourquoi tu as envie de l’avoir :)

      Répondre à Marlène
  • Camille

    Colour Lovers est super, je ne connaissais pas ! Je vais souvent sur Brusheezy & Deviant Art pour les brushes Photoshop.

    Répondre à Camille
    • Marlène

      Ah Photoshop c’est aussi un vaste sujet :) Je vais souvent sur Brusheezy, MyPhotoshopBrushes.com et BrushLovers…

      Répondre à Marlène
  • Marion

    Merci pour tous ces sites, ça peut être très pratique :)
    Il y a aussi Deviantart. On peut y trouver pleins de jolies choses !

    Répondre à Marion
    • Marlène

      C’est bien vrai et va savoir pourquoi, je n’y pense jamais ! Merci pour la piqûre de rappel :)

      Répondre à Marlène
Si vous aimez les articles du site, n'hésitez pas à faire vos achats sur Amazon.fr via ce lien ; il me permettra de toucher une commission grâce au programme Partenaires Amazon EU.