Jean ROCHARD
Je partage ma passion de Wordpress dans des articles techniques sur les plugins, thèmes, nouveautés geek et optimisation SEO "on-site".
Jean ROCHARD

@jean_rochard

Chez Terre Digitale, on mange du Wordpress dès le petit-dej'.
Petit guide pour mettre en place les Facebook Instant Articles à partir de vos posts Wordpress : https://t.co/lSbzdM6z9j - 7 mois ago

Comment illustrer son site … sans être graphiste ? Cet article peut paraître étonnant lorsque l’on propose de la communication en ligne ; mais l‘autonomie de nos clients est une des valeurs fortes  de Bene Facere. Pour des questions de budget, il n’est pas toujours possible de passer par un graphiste professionnel pour ajouter des bandeaux, éditer ses photos et illustrer son site Internet.

Je vais donc donner ici quelques pistes pour cela et ainsi, par exemple, facilement mettre en valeur vos articles sur votre blog. Pas question de maîtriser des outils complexes comme PhotoShop, Gimp ou Paint.Net ; il en existe de très bons, en ligne, gratuits, performants et faciles à utiliser. L’un d’eux se nomme PicMonkey.

Mettre en ligne des photos

Un des points importants que je montre aux clients pendant une formation est le redimensionnement de leurs photos pour les mettre en ligne. En effet, une photo prise par un appareil photo numérique a des dimensions bien supérieures que celles permises par les écrans. La mettre en ligne « telle quelle » ne ferait qu’alourdir le site et le temps de chargement de la page (même si les CMS comme wordpress se chargent de plus en plus de gérer automatiquement ce genre de choses).

Par exemple, un client me fournit une photo au format 3872 px x 2592 px et pesant plus de 5 mo. Pour être mise en ligne, cette photo sera ramenée à une largeur de 500 px (correspondant à la largeur affichable sur sa page web), la proportion de hauteur sera conservée et elle pèsera au final environ 100 ko.

Redimensionner et croper ses photos avec picmonkey

Pour réaliser ce redimensionnement, je vous propose d’utiliser l’outil PicMonkey, offrant de nombreuses fonctionnalités gratuites et d’autres payantes pour une utilisation avancée. Cet outil est 100% en ligne et ne vous demande aucune installation sur votre ordinateur.

Les fonctionnalités crop et resize sont accessibles dans le menu « Basic Edits ». Il suffit alors de saisir la largeur voulue et de sélectionner graphiquement la partie de l’image que l’on souhaite « cadrer ».

crop_picmonkey

Exemple de « crop / resize » avec picmonkey

Le but de cet article n’est pas de vous faire un tutoriel détaillé de picmonkey mais juste de vous le présenter. Vous trouverez de nombreux tutos en ligne. PicMonkey vous propose même sa sélection de tutoriels (en anglais). Pour des articles en français, une recherche sur google vous donnera de nombreuses vidéos youtube et autres screencasts de démonstration.

 Réaliser ses propres bandeaux et illustrations

Au delà de l’édition de photos, vous pouvez aussi réaliser des bandeaux pour votre site. De nombreux effets sont à votre disposition gratuitement (coins arrondis, ombrés…), des fonds, des textures, des polices…

Un bandeau picmonkey

Un bandeau picmonkey

Maintenant, à vous les articles de blogs mis en valeur et illustrés avec picmonkey !