Le choix de l’outil : Mailchimp

Après avoir connu plusieurs outils de newsletter, j’ai vraiment eu une révélation en découvrant l’ergonomie et la simplicité de WordPress. Mailchimp est un outil professionnel qui intègre à la fois la création de la liste de diffusion, la conception graphique de l’interface et la diffusion de la lettre d’information.

Vous pensiez qu’une newsletter nécessitait un effort de rédaction au rythme de vos publications ?
Découvrez en fin d’article un moyen d’automatiser son envoi sans intervention de votre part

• Création de votre compte et paramétrage de mailchimp
• Création ou importation de votre liste
• Choix et personnalisation d’un template existant d’après vos besoins
• Assistance au premier envoi

Consultez nous pour Formation à l’utilisation de Mailchimp ou la création d’un template original…+ d’information et contact

Les 8 secrets d’une bonne newsletter ?

Savez-vous qu’il existe un moyen d’automatiser la création de votre newsletter ?

Mailchimp offre en effet une possibilité de greffer directement l’envoi de lettre d’information avec le flux RSS de votre site WordPress.
Il suffit d’adjoindre une petite modification pour que le flux embarque également l’image à la une de votre page ou article…
Et le tour est joué ! Vous pouvez ainsi systématiser l’envoi sans effort :
c’est le cas de ma propre newsletter accouplée à mon flux RSS

J’ai même été confronté très récemment au cas d’une cliente qui a vu son site piraté et fermé temporairement à la navigation par Google. La sécurité de votre site vous concerne donc aujourd’hui ! Même si votre site n’a pas énormément d’influence et de trafic, il est important que vous le sécurisiez sans tarder. Je ne suis vraiment pas là pour vous affoler…Juste pour vous donner quelques clefs pour améliorer la protection de votre plate-forme Web.

Archivez, Archivez, Archivez (niv. facile)

Prenez soin de votre Site WordPress (niv. facile)

Voici une liste de conseils de bon sens qui vous aideront à optimiser la santé de votre site. Les suivre est un premier pas dans la sécurisation de vos données :

<?php 
// Silence is golden.?>

Sécurisez votre installation en quelques clics (niv. intermédiaire)

Prendre toutes les précautions nécessaire à la protection de votre site, c’est bien. Mais ne pas exposer vos données sensibles aux grand soleil, c’est encore mieux. Voici en quelques clics quelques précautions à appliquer rapidement :

→ Protégez votre fichier wp-config.php grâce à ce code ajouté en bas de votre fichier .htaccess (note, si ce fichier n’existe pas encore dans votre configuration, vous pouvez l’ajouter à la main en le nommant ‘.htaccess’ (sans les apostrophes) .

<Files wp-config.php> 
order allow,deny
deny from all  
</Files>

→ Protégez votre propre fichier .htaccess grâce à ce code ajouté en bas de ce même fichier

<Files .htaccess> 
order allow,deny
deny from all  
</Files>

remove_action("wp_head", "wp_generator");

Des plugins à votre secours (niv.intermédiaire)

Ajouter des clefs de sécurité secrètes dans le fichier wp-config.php (niv. intermédiaire)

Si vous avez déjà installé par votre propre moyen un site WordPress, vous devriez avoir bien remarqué des codes particulier dans votre fichier wp-config.php (lequel contient les configurations nécessaires pour WordPress fonctionne convenablement). Cette section du fichier de configuration sont des clés d’authentification SALT qui crée un cookie d’identification lequel protège votre installation.

Si ces codes ne sont pas présent dans votre fichier wp-config.php, vous pouvez les régénérer grâce au lien suivant :
https://api.wordpress.org/secret-key/1.1/salt/

Notez que tout changement de ces clefs de salage aura pour effet d’invalider tous les cookies de votre site et forcera donc chaque utilisateur à se reconnecter sur votre blog.

Supprimer le compte ‘admin’ par défaut (niv. intermédiaire)

Par facilité ou par défaut (sur certains hébergeurs comme OVH) l’identifiant admin est souvent créé pour identifier l’espace d’administration. La popularisation de cet identifiant le rend par nature très sensible : le pirate potentiel n’a plus qu’à se concentrer sur votre mot de passe pour percer votre accès.

Si vous disposez d’un tel compte, créer un autre compte alternatif avec les mêmes droits d’administrateur, puis supprimer le compte dont l’identifiant est admin. Cette manœuvre peut se mener même en cours de vie du blog : un système de bascule des anciens articles et pages est automatiquement proposé

Masquer les erreurs de connexion (niv. expert)

Voilà typiquement un comportement de WordPress très ‘user-friendly‘ qui peut s’avérer ‘hacker-friendly‘ lorsqu’il se retourne contre vous. En effet, lors d’une erreur de saisie de votre mot de passe ou de votre login, WordPress vous guide gentiment et indique ce qui ne convient pas. Il s’agit donc de gommer cette fonctionnalité pour ne pas donner d’indice supplémentaire aux méchants pirates qui en veulent à vos données.
Pour cela, nous allons ajouter cette ligne de code à notre fichier function.php de notre thème

add_filter('login_errors',create_function('$a', "return null;"));

Avec bien d’autres experts du web, je pense que la sécurisation d’un mot de passe deviendra dans les années à venir, un point crucial à savoir gérer. Votre compte email, votre site WordPress, facebook et toute la nuée de réseaux sociaux, les boutiques marchandes sur lesquelles vous avez vos habitudes sont tenues par vos mot de passe : pas besoin d’être très imaginatif pour imaginer ce qu’un pirate du web ferait de toutes ces ressources s’il découvre votre précieux sésame car il n’est pas assez sécurisé.

Une recette à toute épreuve

Si votre mot de passe ressemble au prénom de votre fille accolé à sa date de naissance, à votre animal préféré, à votre sport quotidien, ou pire, ou 5 premières lettres de l’alphabet, pense que vous devriez vraiment reconsidérer le choix de cette clef numérique.

Voici une recette astucieuse adaptée de celle Eric Griffith-PC Mag. Elle est particulièrement ingénieuse, car elle permet de générer un mot de passe complexe ET mémorisable.

Adaptez votre mot de passe à vos différents accès

Vous avez maintenant un chouette mot de passe, mais il serait malvenu de l’utiliser uniformément pour TOUT vos accès. Voici un truc astucieux pour faire varier ce mot de passe tout en le gardant humainement mémorisable.

Il suffit de rajouter un suffixe selon sont emploi :

• Xua3^s3l!se11ahC|FACE pour facebook,
• Xua3^s3l!se11ahC|FNAC pour votre boutique de disque préférée
• Xua3^s3l!se11ahC|MAIL pour votre compte email.

Des sites pour vous aider

Voici quelques outils qui viendront palier votre éventuel manque d’imagination ou de mémoire. Je recommande dashlane qui me semble agréable à utiliser, et qui a surtout synchronisé l’ensemble des mots des passe Firefox, alors que je n’y suis toujours pas arrivé avec son concurrent 1password

…Bon et bien maintenant je m’en vais changer tous mes mots de passe maintenant que vous les connaissez ;p

Un widget, qu’est-ce que c’est ?

Widget est une mot valise formé à partir de Windows et Gadget. Les widgets augmentent l’interactivité et accroissent les fonctionnalités de votre site en ajoutant dans la barre latérale de nouvelles possibilités telles l’affichage de catégories, de nuages de mots clefs, d’un champ de recherche, etc. Vous trouverez de nombreux widgets présents sur mon blog dans la barre latérale sur le coté droit de cet article.

Paramétrer

1Dans votre espace d’administration, vous pouvez accéder à l’ajout de widget en allant sur Apparence>Widget

(Vous trouverez des milliers de widgets compatibles WordPress sur http://wordpress.org/extend/plugins/)

Activer

2Pour activer un widget, il vous suffit de faire glisser le widget de votre choix dans la barre latérale. Une fois en place, WordPress met à jour automatiquement le thème.
Pour retirer le Widget, cliquez sur Supprimer ou faite le glisser sur le coté gauche avec les autres widgets

Organiser

3Pour ré-organiser les widgets en place dans la zone de barre latérale, il vous suffit de cliquez dessus et de les faire glisser à l’endroit choisi.
Certains widgets demandent à ce que vous enregistriez la personnalisation choisie : cliquez sur Enregistrer pour valider vos modifications

9 Ateliers Pratiques pour vos widgets textes

1 | Ajoutez du texte

C’est bien évidemment la destination première de ce widget.
Il existe néanmoins un paramétrage qui n’est pas forcément compréhensible au premier abord, celui de la case à cocher Créer automatiquement les paragraphes.
En effet, le widget qui se comporte comme un émulateur du langage HTML ne reproduit pas naturellement les sauts de ligne que vous voudriez ajouter (en cela, il se comporte comme dans un vrai éditeur html). Il faut donc utiliser certains codes html (que je détaille ci-dessous) pour reproduire cette mise en forme…A moins que vous ne cochiez la case de création des paragraphes. WordPress ajoutera alors pour vous les espaces nécessaires.
→ Vous pouvez copier ce code pour un exemple d’intégration de Texte dans le widget texte

<p>Voici la mise en forme nécessaire pour créer des blocs textes</p>
<p>La balise "p" <br> permet de créer des paragraphes<br>
La balise "br" <br>permet de retourner à la ligne<br>
La balise "hr"<br>permet d'ajouter un soulignement </p>
<p>&nbsp;</p>
<p>La balise "&nbsp;" permet d'ajouter un espace vide</p>

Notez qu’il existe d’autres mises en formes, telle le gras, l’italique, le souligné, mais que celles-ci sont directement accessibles avec votre éditeur WordPress (voir la méthode de l’éditeur dans la vidéo Atelier de synthèse un peu plus bas). Je ne les détaille donc pas ici.

2 | Multiples images dans un widget

Cela nécessite que vous connaissiez un tant soit peu un éditeur d’image comme Photoshop ou Gimp (ce dernier est gratuit). Vous pourrez trouvez de précieux conseils sur le maniement de Gimp en consultant le tutoriel sur le redimensionnement d’image que j’ai préalablement édité. Considérons que vous avez maîtrisé ces bases.
Nous allons mettre en place ce qui pourrait être un menu à plusieurs entrées, composé uniquement d’images. Vous remarquerez dans le code l’utilisation de positionnement flottant qui va permettre de mettre les images les unes à côté des autres.
→ Vous pouvez copier ce code pour un exemple d’intégration d’image dans le widget texte. Ce code intègre un lien sous chaque image, lien que vous pourrez modifier facilement.

<a href="http://www.1and1.fr/?affiliate_id=168303" target="_blank">
<img src="http://adimg.uimserv.net/1und1/Werbemittel_FR/wh_an_100x120.gif" style="border: 0 none;"/></a>
<a href="http://themeforest.net?ref=Ikyo" target="_blank">
<img src="http://envato.s3.amazonaws.com/referrer_adverts/tf_125x125_v5.gif" 
width="100" height="100" style="border: 0 none; float: right ;"/></a>

3 | Ajoutez une vidéo

Tous les grands diffuseurs de vidéo (Youtube, Viméo, Daily motion) offrent la possibilité d’incorporer une vidéo dans un site Web. Il est une fois de plus nécessaire de bien connaître la dimension de votre sidebar (ou barre latérale) pour que votre vidéo s’inclue parfaitement (voir le chapitre firebug). Une fois cette formalité validée, il est très facile de recopier le code que vous fourni automatiquement le diffuseur et de l’intégrer dans un widget texte.

• Sur Vimeo par exemple, il vous suffit d’appuyer sur le bouton « share » placé en haut à gauche de la vidéo, puis sur « Customize embed options » pour disposer de plus de paramétrages
• Sur Youtube, il suffit de cliquer sur partager, puis intégrer pour obtenir les paramètres d’intégrations.

→ Vous pouvez copier ce code pour un exemple d’intégration d’une vidéo dans le widget texte

<iframe src="http://player.vimeo.com/video/30681330?title=1&amp;byline=1&amp;portrait=1"
width="244" height="137" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe> <p>
<a href="http://vimeo.com/30681330">Archivez votre site WordPress avec Filezilla</a> from 
<a href="http://vimeo.com/user6039993">Fabrice COURT</a> on <a href="http://vimeo.com">Vimeo</a>.
</p> <p>Tuto de formation vid&eacute;o pour apprendre &agrave; utiliser Filezilla dans l&#039;optique de faire son archive WordPress</p>

4 | Ajoutez une bouton de paiement Paypal

Il est très aisé d’ajouter  un bouton d’achat relié à votre compte Paypal.
Cela peut vous permettre de vendre sporadiquement quelques articles (attention, cela ne saurait remplacer une vraie boutique marchande en ligne).
Il vous suffit pour cela de disposer d’un compte Paypal et de vous référer à leur site pour créer un bouton ad hoc. Notez que cette même technique vous permet également de créer un bouton de don ou un chèque cadeau.
Pour ce faire :

• Connectez-vous sur Paypal
• Puis dans l’encart « Fonctions principales » (colonne de droite), cliquer sur le bouton Acheter→ Vous pouvez copier ce code pour un exemple d’intégration d’un bouton Paypal dans le widget texte

<p align="center"><strong>Avez-vous déjà rêvé de mieux maîtriser votre site WordPress ?</strong><br>
N'hésitez pas à opter pour une formation à votre rythme et à votre domicile</p>
<div align="center">
<!--Rajoutez ici le code que le site Paypal crée pour vous-->
</div>

5 | Ajoutez des mises en formes CSS

Si le cœur vous en dit ou qu’un courage suffisant vous anime, vous pouvez également ajouter quelques mises en forme avec du langage CSS (Cascading Style Sheets). Ce langage est utilisé pour définir la mise en forme de votre site, comme par exemple la couleur du fond de votre page ou le type de police employé. On utilise un fichier séparé du contenu (que l’on nomme souvent « style.css ») pour définir l’aspect, la présentation de votre blog.

Même si c’est un peu moins élégant de procéder ainsi (il faudrait en effet mieux passer par une feuille de style externe, mais ce serait trop long à décrire), on peut également ajouter des mises en forme « en ligne », c’est-à-dire directement au coeur de votre paragraphe. Voici un court exemple de ce que vous pourriez faire :

 <div style="padding:12px;background-color:#cadbab;border:2px solid #476117;">Votre contenu texte</div>

Quelques éclaircissement sur le bon usage de ces règles

• Notez que l’appel des règles est précédé de la balise style, puis du signe égal et d’un jeu d’apostrophe ; chaque règle CSS est séparée par un « ; »
• Vous pouvez à loisir supprimer ou rajouter des éléments placés entre les points-virgule.
• Padding exprime la marge intérieure entre le texte et la bordure de votre bloc (cette marge est de 12px)
• Background color défini la couleur de fond de votre bloc texte. Vous pouvez aisément choisir votre couleur avec un logiciel type Photoshop ou une extension comme Colorzilla
• Border exprime la bordure. Elle est libellée ainsi Taille-type de bordure – Couleur. On aurait pu ainsi mettre  1px dashed #94122C

6 | Créer un effet rollover avec une seule image et du CSS

Encore un peu plus loin dans l’appel de vos compétences, je présente ici une solution aux plus avancés d’entre vous. Il s’agit de créer un effet rollover (soit une image dont l’état se modifie -forme, couleur, texte- lorsqu’elle est survolée par le curseur de la souris) uniquement avec du CSS. J’utilisais auparavant une technique à base de javascript avec un code long comme l’avant-bras (si vous disposez de Dreamweaver et que vous créer cette fonctionnalité en mode visuel, vous me comprendrez).

Il existe une solution plus simple à base d’un peu de code CSS et d’une seule image. La difficulté de l’exercice tient juste de l’implémentation dans votre feuille de style, et de la personnalisation de ce bout de code CSS.
Ce premier bout de code est à personnaliser selon votre besoin et à ajouter dans le fichier style.css de votre thème :

a.imagerollover{background: url("http://www.votrenomdedomaine/le-chemin-de-votre-image.jpg") no-repeat scroll 0 0 transparent;width:244px; height:120px; display:block}
a.imagerollover:hover {background-position: 0px -120px}

puis ajouter ce bout de code dans votre widget texte

<a title="un titre significatif pour votre lien" href="http://www.votrenomdedomaine/le-chemin-de-votre-lien.html" class="imagerollover"></a>

Ceci donne en définitive le résultat suivant (Passez votre souris sur l’image pour faire apparaître le rollover)

Pour réussir votre intégration, soyez bien conscient des principes suivant :

• La classe (ici ‘imagerollover’) doit bien-être reportée dans le code du widget pour pouvoir agir
• Ne manquez pas de bien paramétrer la taille de votre image dans ‘width:???px; height:???px;’ pour que le cadrage s’effectue convenablement
• Régler la valeur de background-position à la moitié de votre image totale (ici 240/2=120px)

7 | Une case déroulante

Cet atelier a été sollicité par une des commentatrices de ce blog : comment créer une case avec un ascendeur latéral ? Là aussi, il existe plusieurs façons de l’envisager, mais le plus simple est encore d’ajouter un bout de CSS au milieu d’un tableau. La balise ‘table’ va créer ce tableau, et la propriété ‘overflow’ va autoriser le dépassements de blocs (la qualité ‘auto’ ajoute une barre de défilement horizontale ou verticale si besoin ; on peut la remplacer par ‘overflow:scroll’ pour ajouter ascenseur dans tous les cas).

<table>
<tr>
<td  height="150">
<div style="overflow: auto; width: 100%; height: 100%">
<p>Quanta autem vis amicitiae sit
Ex hoc intellegi maxime potest, quod ex infinita societate generis humani, 
quam conciliavit ipsa natura, ita contracta res est et adducta in angustum 
ut omnis caritas aut inter duos aut inter paucos iungeretur.</p>
<p>
Ultima Syriarum est Palaestina per intervalla magna protenta, cultis abundans
terris et nitidis et civitates habens quasdam egregias, nullam nulli cedentem 
sed sibi vicissim velut ad perpendiculum aemulas: Caesaream, quam ad honorem  
Octaviani principis exaedificavit Herodes, et Eleutheropolim et Neapolim 
itidemque Ascalonem Gazam aevo superiore exstructas.</p>
</div>
</td> </tr> </table>

8 | De l’utilisation de Firebug

Les vidéos présentes sur ce tutoriel ont été enregistrées en HD.
Ne manquez pas de sélectionner la plus grande qualité (720HD)
en cliquant sur le petit engrenage présent dans la barre de réglage de la vidéo,
ce pour obtenir la meilleure définition.

Vous pouvez également afficher la vidéo plein écran pour bénéficier de plus de clarté
(sortez de ce mode en appuyant sur la touche ESC)

9 | Atelier de synthèse : installation d’un encart publicitaire

Merci de votre attention

N’hésitez pas à commenter cet article. Je vous répondrai dès que possible

→ Dernière mise à jour le 14 Avril 2013

Bonjour à tous

J’essaye souvent de mettre à profit les demandes récurrentes de mes clients qui sont parfois (et c’est bien naturel) un peu déroutés par le jargon du Web et de WordPress. Voici donc à leur usage, et au vôtre (et dans la lignée des autres mini-formations que je propose), un petit lexique qui se veut non-exhaustif et qui s’enrichira au fur et à mesure de vos questions. Je vous souhaite une bonne lecture.

» Article (post)

Toute première définition, l’article est également un des fondements de votre site WordPress. Les articles vous permettent traditionnellement de publier des actualités ou des éléments marqués dans le temps. Ils seront classés par date de publication, que votre thème l’affiche ou ne l’affiche pas. Le système des articles peut également servir différemment sur des thèmes plus évolués : ils peuvent être support à vos portfolios, répertorier les produits de votre boutique marchande.

→ Utilisez les articles pour informer d’éléments marqués dans le temps, ou appelés à ‘disparaître’ derrière vos autres publications. Pour les éléments plus pérennes ou qui doivent rester au premier plan, préférez les pages.

» Breadcrumbs ou fil d’Ariane

Le fil d’Ariane est une aide à la navigation. « Breadcrumbs » signifie littéralement « miette de pain » et fait clairement référence au petit Poucet

Le fil d’Ariane permet de situer l’utilisateur dans la hiérarchie du site qu’il visite. Vous le trouverez présent dans le haut de cette page : Accueil>Blog>Petit lexique WordPress. Il est soit proposé nativement dans le template que vous choisirez, soit ajouté à l’aide d’un Plugin comme Breadcrumb NavXT, ce qui est le cas présentement.

» Catégorie

C’est un moyen de classement interne à votre site. Les catégories sont des éléments importants au fonctionnement de votre site (un article appartient toujours à une catégorie). On peut facilement classer les catégories en hiérarchies : elles permettent vraiment d’organiser votre site. Elle peuvent parfois limiter l’affichage d’une partie seulement de vos données (comme l’affichage dans un widget). Les catégories auxquelles appartiennent cet article sont Blog et Formation.

» Extrait (Excerpt)

Des extraits sont utilisés pour résumer le contenu de vos articles afin que seule une partie de l’entrée – le plus souvent l’introduction- soit affichée. L’utilisation des extraits est facultative et variable selon les thèmes utilisés. Traditionnellement, votre extrait est suivi par un lien qui renvoie le lecteur à l’article dans son intégralité.

» .htaccess

A la base, le .htaccess est un fichier de configuration qui s’adresse à votre serveur Apache. Il n’apparait pas dans l’arborescence de WordPress, mais dès lors que (par exemple) pour modifier vos permaliens dans Réglages>Permaliens, WordPress l’auto génère alors. Ce fichier a beaucoup d’usages :

• Modifier les droits d’accès d’une partie de votre thème (comme wp-admin par exemple)
• Créer des redirections d’une ancienne adresse de votre site vers une nouvelle adresse
• D’optimiser la mise en cache et la vitesse de votre site

Attention, ce fichier est un peu sensible, et la moindre mauvaise rédaction de son contenu mène votre site à une erreur 500 (qui est réversible par la suppression momentanée du htaccess ou la correction de celui-ci).

Il existe également plusieurs façons de mieux sécuriser votre site en ajoutant quelques lignes de codes, telles celles que je décris dans l’article cité en lien.

» jquery

Le jQuery est une bibliothèque JavaScript libre qui porte sur l’interaction entre JavaScript  et HTML. Cette bibliothèque permet par exemple :

• la gestion d’événements
• Effets visuels et animations originales (slider, lightbox, bouton animés)
• Manipulations des feuilles de style en cascade
• La gestion d’Ajax pour de splendides effets d’accordéons

» Menu

C’est le résumé de vos pages, de vos articles et de vos catégories avec les liens logiques ou hiérarchiques qui les régissent.
Attention, certains thèmes ne permettent pas l’usage des menus tels définis dans Apparence>Menu.

Pour les plus experts d’entre vous, il existe des moyens évolués de personnaliser votre site en agissant sur ‘Options de l’écran’ en haut et à droite de votre écran et d’utiliser les champs « Afficher les propriétés avancées du menu » qui permettent par exemple de personnaliser les CSS des termes de votre menu ; c’est ce que j’ai fait pour mon menu prestation qui bénéficie d’une présentation personnalisée.

» Mise à jour

Plusieurs éléments sont appelés à être mis à jour sur votre site :

• Vos extensions : C’est une mise à jour généralement facile à mener. Vous n’avez qu’à cocher les mises à jour proposées et les lancer ; elles se mèneront alors automatiquement. Si toutefois cette mise à jour échoue, vous bénéficierez alors d’un « splendide » message noir sur blanc vous signifiant que le site est en maintenance. Pour le supprimer, il vous faut aller dans votre espace ftp et de supprimer le fichier nommé « .maintenance’ pour rétablir les fonctionnalités de votre site.
• La version WordPress de votre site : Si tout se passe bien – et après une mise à jour complète de votre site – la mise à jour de WordPress se mène normalement automatiquement et favorablement. Si toutefois tel n’est pas le cas, consultez cet article qui vous guidera
• Votre thème : C’est sans doute la mise à jour la plus délicate si vous avez modifié les fichiers sources (et que vous n’avez pas gardé un historique). Si vous n’avez aucune idée de ce que vous avez modifié, il va être très complexe de mettre votre thème à jour. Si seule votre feuille de style a été modifiée, vous pouvez comparer les deux fichiers, puis mettre en place votre nouveau thème. Je reste volontairement peu éloquent car c’est une manœuvre complexe et fastidieuse si vous avez bidouillé votre thème.

» Page

» Permalien (permalink)

Les permalinks ou permaliens comporte les adresses permanentes qui mènent à vos pages et à vos articles. Les permaliens permettent d’attribuer à une page, une URL fixe et unique.
Par défaut WordPress attribue une adresse du type http://www.fabricecourt.com/?p=3133 (c’est l’adresse de cette page ou 3133 et l’identité ou l’ID unique de cette page). Vous conviendrez que cette adresse n’est ni facile à retenir, ni très indiquée pour le référencement. Cette adresse est donc ré-écrite via un processus qui procède de l’URL-Rewriting et qui permet de donner l’adresse suivante à cette page http://www.fabricecourt.com/blog-fabrice-court/petit-lexique-wordpress/ ‎



La structure de permalien peut-être personnalisée dans WordPress – Réglages > Permaliens

» Plugin ou extension

Un plugin est un ensemble de fichiers, que vous pouvez librement ajouter à votre site et qui va permettre d’accroître les fonctionnalité de votre thème. Il existe à ce jour plus de 21000 plugins ou extensions disponibles sur http://wordpress.org/extend/plugins/. Le module Facebook que vous voyez que la sidebar (barre latérale) est une extension ajoutée à ce site.

» RSS

C’est acronyme de Really Simple Syndication. Le RSS se manifeste traditionnellement sous la forme d’un flux auquel les visiteurs s’abonnent pour suivre l’évolution d’un site Web. Il existe des lecteurs de flux tel l’application Brief disponible sur Firefox pour être rapidement informé des nouvelles publications sur vos sites préférés. Le flux d’un site WordPress est accessible via l’adresse www.monsite.com/feed/ (exemple www.fabricecourt.com/feed pour ce site)

» Rôles dans WordPress (les)

• Administrateur
C’est le rôle du créateur du site. Il a un pouvoir très étendu sur toutes les facettes de l’interface : les articles, les commentaires, mais aussi les réglages profonds de l’interface WordPress, le choix du thème, l’importation, le rôle alloué aux utilisateurs, et même le pouvoir de supprimer le blog dans son intégralité ! C’est donc un rôle à risque à ne pas attribuer à chacun.

• Rédacteur
Il peut publier un article ou une page ou modifier toute page ou article existant, agir sur les commentaires, les catégories et le liens ainsi que télécharger des fichiers, mais il ne gère par la configuration profonde du blog ni l’ajout d’utilisateurs supplémentaires.

• Auteur
Le pouvoir de l’auteur est s’étend seulement sur ses propres pages ou articles ; il ne peut agir sur les pages qui ne lui appartiennent pas, ni à fortiori agir sur les réglages du site.

• Contributeur
Le contributeur propose des articles que seul un rédacteur pourra valider. Ses pouvoirs sur la configuration du site sont nuls

» Shortcode

Un shortcode est un jeu de fonctions permettant de créer des macros (API) pour l’automatisation d’une fonction ou d’une mise en forme. Lorsque vous désirez ajouter une galerie à l’aide de WordPress, il vous suffit d’enregistrer des images dans votre article et d’indiquer simplement le code ['gallery'] pour implémenter une fonction complexe qui affiche vos images sous la forme d’une galerie. Certains thèmes comportent naturellement des shortcodes pour faciliter la mise en page ou la mise en place de fonction.

→ Le petit encart vert qui vous propose, au bas de cet article, d’ajouter vos commentaires et vos questions, utilise également un shortcode qui transforme la présentation du texte encadré.

» Sidebar

C’est la colonne latérale qui permet l’affichage de widgets. Les thèmes WordPress peuvent intégrer une ou plusieurs sidebars. Vous trouverez à coté de cet article une sidebar sur le coté droite, laquelle contient plusieurs widgets.

» Slider ou menu à glissière

C’est un système d’affiche d’images qui repose parfois sur la technologie Flash (technologie qui ne sera pas facilement lisible sur les appareils mobiles) ou plus souvent sur du jQuery (qui est une bibliothèque JavaScript). On peut attendre d’un bon slider qu’il dispose d’une solide interface d’administration dans votre espace d’administration. Nivo Slider encouragé par plus d’un million de téléchargement est l’un des plus connus (son moteur est également gratuit ) ; le système d’affichage que vous trouverez présent sur la page d’accueil est également à qualifier de slider.

» Thème ou template

un « thème » ou « design » ou encore « template » est la partie visuelle de votre blog, ce qui va carrosser l’intégralité de votre site.

Littéralement, un thème est un ensemble de fichiers qui travaillent ensemble pour produire une interface graphique et un design unificateur pour votre blog. J’utilise le terme ‘carrosser’ car votre thème va bel et bien agir comme une coque de métal (colorée) sur votre moteur WordPress, en définissant également en profondeur nombre d’options. Avec WordPress, vous pouvez également changer de thème sans toucher au contenu de votre site : le contenu, la mise en forme et le moteur de fonctionnement agissent tous indépendamment (voir l’article sur la sauvegarde WordPress dans lequel je glisse un schéma de fonctionnement d’un site WordPress).

» Widget

C’est un mot valise créé à partir de Windows et gadget. Dans WordPress un widget est une zone autonome d’une page Web qui exécute une fonction spécifique. WordPress comprends nativement plusieurs widgets sur lesquels vous pouvez compter (disponible dans Apparence > Widget) : L’affichage de l’encart coloré « Voulez-vous une nouvelle image pour votre entreprise » utilise le widget natif « Texte » de WordPress. Les plugins et les thèmes peuvent fournir des widgets supplémentaires.

→ Vous désirez allez plus loin sur l’utilisation des widgets ? Ne manquez pas de lire cet article sur la personnalisation du widget texte.

Merci de votre attention et à très bientôt

Si l’archivage de votre serveur via une connexion ftp s’avère indispensable pour sécuriser tous vos fichiers (ne manquez pas ce suivre la leçon sur Filezilla si vous ne l’avez pas encore fait), l’archivage de votre base de données est tout aussi capital pour sécuriser toutes les liaisons, les textes et les contenus de votre site. Perdre votre base de données, c’est perdre l’ensemble du contenu de vos articles et de vos pages, c’est pourquoi WordPress vous conseille d’archiver régulièrement et préventivement avant toute mise à jour du CMS.
Votre base est généralement gérée par phpMyAdmin, un programme qui s’occupe d’interagir avec votre base, de la gérer et de l’administrer. Il n’est pas nécessaire d’en connaître le fonctionnement, néanmoins l’identification des principaux outils peut vous être utile en cas de coup dur (comme la perte de vos identifiants de connexion par exemple). Dans cet article nous présenterons deux solutions qui vous permettront soit de passer par ce programme pour sécuriser vos données, soit d’utiliser une extension dédiée.

Optimiser votre base de données

> Avec PHPMyAdmin

Pour préparer l’archive d’une BDD (base de donnée), il peut être utile d’optimiser celle-ci. Les plus expérimentés passerons par PhpMyAdmin (normalement disponible dans l’espace d’administration de votre hébergement, à coté de votre base de données) qui propose menu assurant cette optimisation ; ce menu jouxtant d’autres opérations comme la suppression de la base, il s’agit de vraiment porter toute l’attention nécessaire à cette opération.

1 Sélectionnez tout d’abord votre base de donnée dans la page d’accueil. Il est probable qu’elle se nomme db (comme database) ou qu’elle se nomme du préfixe que vous aurez choisi lors de l’inscription de votre site WordPress

2Cocher l’ensemble de vos tables en cliquant sur tout cocher

3 Sélectionnez avec soin « Optimiser la table ». D’autres opérations sont également possibles avec ce menu : prenez son de choisir la bonne ! L’optimisation ne dure que quelques secondes : votre table est alors optimisée

> Avec une extension dédiée

On peut également passer par un plugin qui se nomme WP optimize et qui permet de le faire sans le concours de PhpMyAdmin. Cette extension permet également de supprimer les révisions d’articles qui peuvent facilement plomber votre base si vous faites beaucoup d’aller-retour et de supprimer d’un seul coup tous les commentaires classés comme spam. Vous ne gagnerez à l’issue que quelque Ko (voire quelques Mo si votre base est importante) ; ces kilo octets peuvent cependant interagir dans la rapidité d’affichage de votre site.

Archiver votre base de données

> Avec PHPMyAdmin

PHPMyAdmin offre une possibilité simple et pérenne d’archiver votre site WordPress. Même si cette solution est un plus complexe et délicate à mettre en œuvre (et qu’elle ne peut pas facilement s’automatiser), elle offre le grand avantage de n’être lié à aucun plugin qui pourrait rajouter des éléments exotiques à votre archivage, où dont le développement pourrait s’arrêter du jour au lendemain.

Nous considérons que vous avez déjà optimisé votre BDD et que l’ensemble des tables de votre base de données est déjà affiché. Cliquez alors sur l’onglet EXPORTER en haut de votre fenêtre PHPMyAdmin pour arriver au menu ci-dessous.

Si votre archivage est long et très conséquent, il se peut que vos outils statistiques, ou votre anti-spam viennent alourdir inutilement votre backup. Dans ce cas, vous pouvez désélectionner certaines lignes de base de données dans l’étape 1. Un outil comme WP-Optimize pourra vous indiquer le poids respectif de vos tables.

> Le stockage de vos archives

Vous avez téléchargé l’archive de votre base de donnée. C’est bien entendu un fichier important dont il faut prendre soin : ce fichier contient de nombreuses données sensibles qu’il ne faut pas laisser sans protection.

• Il est intéressant de conserver l’archivage de votre BDD avec celles que vous avez faite les mois précédents. Pour cela nous vous invitons à horodater l’archivage avec la date du jour (ex : db352636.sql-23012012.zip pour un archivage le 23 Janvier), et de procéder ainsi de manière incrémentale (gardez au moi 3 à 6 mois d’antériorité selon le trafic de votre site). Si vous hésitez sur le contenu de tel ou tel archivage, un simple lecteur de texte que WordPad ou Notepad++ pourra vous permettre de lire.
• Vous pouvez doubler votre archivage local par un archivage sur votre propre serveur. Soyez tout de même conscient que cette opération peut-être risquée si votre serveur n’est pas sécurisé convenablement. Vous pouvez également sécuriser cet archivage sur des espaces tels que Dropbox qui offre un hébergement gratuit pour 2Go et Amazon S3 qui vous permettent de le faire pour quelques deniers. Je n’ai pas testés ces système mais je vous les recommande eut égard à leur réputation.

> Avec une extension dédiée

Il existe de nombreuses extensions qui vous permettent d’automatiser l’archivage de votre site. Nous nous concentrerons sur une des solutions les plus reconnues : WP-DB-Backup par Austin Matzko. Ce plugin sauvegardera votre base de données à intervalle régulier en vous l’envoyant par mail ou en la stockant sur votre serveur. C’est une extension simple qui autorise également la restauration des bases de données sauvegardées avec PHPMyAdmin (en cas de plantage massif, votre archivage est donc toujours valable).

1 Par défaut, l’ensemble des tables de votre base WordPress a été sélectionné. Vous pouvez en outre ajouter des bases de données annexes (souvent relatives à des plugins que vous aurez ajouté), ce afin que votre archive soit vraiment complète

2Vous disposez de plusieurs choix concernant la destination de l’archivage : sur votre serveur (avec les précautions que j’ai évoqué un peu plus haut), sur votre ordinateur en local ou par email. Il peut-être judicieux d’ouvrir une boite email spécialisée dans vos archivages

3 Choisissez enfin la fréquence de votre archivage qui sera harmonisée avec la fréquence de modification de votre blog (nul besoin de faire une sauvegarde par jour si vous faite un article par mois ! Dans cette partie vous pouvez également ajouter les tables annexes comme vous avez pu le faire sur au premier point.

Pour les plus avancés (ou aventureux) d’entre-vous

Il se peut que vous ayez besoin d’intervenir directement sur votre base de données MySQL afin de corriger un chemin défectueux, ou réparer une URL après un déménagement de votre site. Il vous faut pour cela vous connectez-vous à la base de données MySQL de votre site (accessible dans PhpMyadmin), laquelle héberge toutes les tables de WordPress de votre site. Attention : ces manœuvres sont délicates et un oubli d’un seul signe dans la commande SQL, peut mettre en péril la stabilité de votre site.

Pour mettre à jour les options d’un nouveau blog (après déménagement), vous pouvez utilisez les commandes SQL suivante :

UPDATE wp_options SET option_value = replace(option_value, 'http://www.ancien-domain.com', 'http://www.nouveau-domaine.com') WHERE option_name = 'home' OR option_name = 'siteurl';

Si vous avez besoin de réparer les URL des articles et des pages (ces valeurs URL sont stockées comme des URL absolues, c’est-à-dire avec le chemin complet), elles pourront être modifiées avec cette commande :

UPDATE wp_posts SET guid = replace(guid, 'http://www.ancien-domaine.com','http://www.nouveau-domaine.com');

Si vous avez lié des pages entres elles (en faisant du maillage interne par exemple), ces liens peuvent désormais pointer vers de mauvaises URLs. Utilisez la commande SQL suivante pour corriger tous les liens internes des articles et des pages:

UPDATE wp_posts SET post_content = replace(post_content, 'http://www.ancien-domaine.com', 'http://www.nouveau-domaine.com');

Les questions que vous pourriez être amenées à vous poser

→ Quelle fréquence devrais-je sauvegarder, Combien dois-je conserver de sauvegardes?
Comme nous l’avons déjà précisé, cela dépend largement du trafic sur votre site (donc des commentaires apportés par exemple) et de votre rythme de publication. Il peut être intéressant d’automatiser la sauvegarde ET de la faire également de façon immédiate en cas de gros changement. N’oublie pas que la sécurité de votre site dépend également de la bonne tenue des mises à jour du cœur de WordPress et de vos plugins . Très récemment, un site célèbre et reconnu s’est fait piraté car un blog inutilisé était accessible via une ancienne version de WordPress (laquelle à offert une porte arrière à l’ensemble du site).

→ Quel autre plugin existe ?
Mon article n’a pas pour vertu de faire un benchmark des plugins. Gardez en tête qu’un bon plugin de sauvegarde est un programme qui doit avoir été très téléchargé auparavant (la popularité prouvera sans doute son efficacité). Il doit être simple dans son utilisation et ne doit pas fabriquer des sauvegardes exotiques que seul le plugin pourra relire (si le dev met la clef sous la porte, vos sauvegardes iront alors toutes à la poubelle). Un bon plugin peut également proposer un forum d’aide et un support technique adapté. En outre il ne doit rien coûter à mon sens (sauf s’il propose l’hébergement de votre archive).

Merci de votre attention. N’hésitez pas à commenter cet article. Je vous répondrai dès que possible !

Si vous arrivez jusqu’ici pour mieux maîtriser l’archivage de votre site, il y a de fortes chances que vous apparteniez à l’un de ces profils :
- Soit vous êtes précautionneux et vous voulez assurer la pérennité de ces données que vous avez mis tant de temps à rassembler
- Soit (c’est malheureusement plus probable) vous avez rencontré un problème de perte irrémédiable de données, et…on ne vous y reprendra plus.

Doit-on le préciser ? Faire des sauvegardes régulières de votre site WordPress est un gage de sécurité pour vos données, car elles vous mettront à l’abri d’une catastrophe du côté de votre hébergeur (s’il est fiable, c’est néanmoins peu probable) ou d’une manœuvre hasardeuse qui aurait corrompue votre site.  En dépit du fait que WordPress soit une plate-forme régulièrement mis à jour, elle peut également être hackée ou piratée si vous n’avez pas su protéger suffisamment votre mot de passe, ou si vous avez mal géré vos permissions.

Rappelons tout d’abord comment marche WordPress

Comme tout site dynamique, WordPress est régit par ce que l’on nomme la relation Client/Serveur, ou le client est la personne qui consulte un site, et ou le serveur est l’ordinateur qui contient l’ensemble des données de ce site

Archive de vos fichiers sur le serveur ftp

Si vous avez installé votre site WordPress, vous connaissez déjà la façon de procéder. Il s’agit d’utiliser un client ftp pour contacter le serveur de votre site. Rien de très compliqué en somme…Imaginez que vous utilisez simplement un logiciel adapté pour consulter  ou modifier le contenu d’un ordinateur distant.
Nous utiliserons pour cela le logiciel open-source bien connu, Filezilla (si cela n’est pas déjà fait, je vous invite à télécharger cette application en cliquant sur ce lien)

1 Cliquez sur l’icone en haut et à gauche (on peut également passer par Fichier>Gestionnaire de Sites pour créer notre nouvelle entrée)

2 Cliquez sur « nouveau site » et donnez un nom a votre connexion pour l’identifier à votre prochaine visite

3 Dans l’onglet « Général » indiquez tout d’abord vos coordonnées FTP, la plupart du temps au format ftp.votresite.com. La case « port » peut-être laissée vide. Le port par défaut (sauf indication contraire de votre hébergeur) est 21.

4 Sélectionnez « Normal » pour le type d’identification.

5 Indiquez alors votre nom d’utilisateur et votre mot de passe (vous recevrez cette information de la part de votre hébergeur). Souvenez-vous que ces deux paramètres sont sensibles à la casse employée : MotDePasse est différent de motdepasse !

6 Cliquez sur « OK » pour à la fois sauvegarder vos coordonnées et vous connecter à votre site.

Le fonctionnement de Filezilla

Découvrez dans ce tuto de formation une explication complète sur les rouages de filezilla.
Vous pouvez consulter cette vidéo en HD directement sur Viadeo

A suivre…

Dans la prochaine leçon, nous étudierons ensemble
- L’archivage de votre base de données
- Des conseils et des plugins pour vous permettre d’automatiser ces actions.

N’hésitez pas à commenter cet article. Je vous répondrai dès que possible

Vous avez apporté tout le soin nécessaire à la fabrication de votre boîte à lumière et à la prise de vue de votre objet et vous allez maintenant traiter votre photo. Ces quelques conseils vous aideront à tirer le meilleur parti de votre visuel. Une fois de plus, je précise qu’il s’agit là de conseils à destinations d’utilisateurs débutants à intermédiaires, avec des recettes faciles à mettre en place. La post-production (et particulièrement le travail sur les logiciels de traitement de l’image type ‘Photoshop’) propose bien des voies pour une même destination, avec des résultats plus ou moins aboutis selon les recettes employées.

Utilisateur du format jpeg : tirez le meilleur parti de votre image

Si vous avez pris le parti de travailler en jpeg, je vous invite à bien relire les conseils de la précédente leçon consacrée au tutoriel sur la prise de vue. Soignez tout particulièrement votre exposition et la température de couleur de votre image pour qu’elle soit la plus parfaite possible. Cette étape de post-production doit rester de la finition et non du gros-œuvre ! Travaillez au besoin de façon empirique en modifiant tel ou tel paramètre : les pré-réglages de votre appareil, la puissance de l’éclairage, la mesure de la lumière.

Vous avez téléchargé vos photos sur votre ordinateur, dans un dossier clairement identifié (pour que votre travail s’archive tout aussi clairement). Glissez alors votre photo dans votre logiciel de retouche préféré. Sur GIMP ou Photoshop, prenez l’habitude de dupliquer le calque de travail : vous disposerez ainsi d’un calque qui contient le visuel original et d’un calque de travail (pour cela cliquez-droit sur le calque et sélectionnez « dupliquer le calque »). Enregistrez sans plus attendre votre composition en .psd (pour Photoshop) ou en .xcf pour GIMP. Cela vous permettra de conserver le fichier jpeg original intact et de conserver via ces formats de fichier particuliers, l’ensemble de votre travail accompli .

Densité et contraste

1Le moyen le plus rapide, mais pas forcément le plus élégant d’étalonner votre image (au regard des pros), est d’utiliser les niveaux automatiques. Les logiciels ont fait un progrès considérables pour identifier les dominantes et les combattre (particulièrement dans Photoshop). Sur Photoshop justement, vous pouvez appeler cette fonction par le raccourci CTRL+L (L comme Level ou niveau). Sélectionnez Couleurs > Niveau pour retrouvez la même commande dans GIMP. Appuyer sur AUTO pour activer la correction automatique. Vous pouvez agir sur ces curseurs pour parfaire le réglage. Appuyer sur Valider dans GIMP ou sur OK dans Photoshop.

2Toujours sur ce même outil de niveau, vous trouverez sur Photoshop et GIMP 3 pipettes : noire, grise et blanche. Cliquez sur la pipette noire pour pipetter la valeur la plus sombre de votre image (une couleur proche du noir de préférence), la pipette blanche pour cliquer sur la valeur la plus claire (du blanc pur idéalement, mais éviter de considérer les reflets d’une surface réfléchissante comme un blanc probant). La pipette grise pourra être utilisée en correction colorimétrique sur un gris (une valeur dont la couleur sélectionnée est constituée de valeurs R, V et B identiques). C’est à cette étape que vous pourrez cliquer sur une charte colorimétique que vous aurez disposée à coté de votre objet pour étalonner une suite de photos.

3Pour vérifier qu’il ne demeure pas une dominante colorée sur votre photo utilisez la pipette et cliquez dans la partie blanche (celle de votre cyclo). Dans le Panneau Information (appuyez sur F8 dans Photoshop, ou cochez la case « Utilisez la fenêtre d’informations » dans GIMP). Dans l’idéal, la valeur doit être équilibrée sur les trois valeurs Rouge, Vert, Bleu. Si ce n’est pas le cas, Utilisez la commande Balance des Couleurs (Ctrl+B dans Photoshop ou Couleurs>Balance des couleurs) pour combattre cette dominante selon le schéma suivant :  Combattez ainsi une dominante bleu avec du jaune, une dominante verte avec du magenta, etc.

Redimensionnement, accentuation et enregistrement

4Vous utiliserez rarement votre image dans sa taille native. Supposons que vous désirez placer cette image dans une bannière web de 320px × 240px. Sur Photoshop, sélectionnez l’outil recadrage (raccourci C). Dans le menu de recadrage que vous trouverez normalement dans le haut de l’écran, notez les paramètres dans les champs appropriés : largeur 240px et hauteur 320px (le px comme pixel a son importance). Cliquez-Glissez pour obtenir le cadrage qui vous convient. Sur GIMP, utilisez l’outil de sélection. dans le panneau de réglage qui est en dessous des outils, cochez la case ‘fixé’ et sélectionnez ‘Proportion’ dans le menu déroulant et indiquez les valeurs ’320:240′ (le : à également son importance) dans le champ de texte sous le mot ‘fixé’ ; Cliquez-Glissez pour obtenir le cadrage qui vous convient. Sélectionnez ensuite la commande Image>Ajustez le canevas à la sélection. Votre image est redimensionnée.

5L’accentuation est indispensable pour vos photos numériques qui sont réputées un peu ‘molle’ (soit en manque de netteté, de piqué). Cette opération est à réaliser en toute fin de la chaîne de post-production, car cette elle s’avère destructive (dans le sens où vous optez pour un choix esthétique sur lequel il sera difficile de revenir). Sur Photoshop ou Photoshop Elements, je vous conseille d’employer le filtre accentuation (Filtre > Renforcement > Accentuation). Poussez le Gain de 100% à 150% selon votre photo. Monter ensuite le paramètre de Gain (mais à la limite de 2px). On conseille typiquement d’accentuer la photo comme vous l’estimez, puis de diminuer les paramètres par 2. Vous ne serez alors pas très loin de la vérité. Sur GIMP, le réglage est accessible sur image Filtres > Amélioration > Renforcer la netteté. Le réglage par défaut est convenable dans la plupart des cas.  Appuyez sur valider pour activer ce filtre.

6Il vous reste finalement à enregistrer votre travail. Nous avons travaillé jusqu’alors à partir de la définition native de l’image. Si vous destinez votre image au Web, il est sage de rabattre sa définition et de l’enregistrer dans un format compressé. Utilisez la commande Fichier>Enregistrer pour le Web sur Photoshop. Choississez le format PNG 24 si votre image comporte beaucoup de zones transparentes ou semi transparentes (votre fichier aura alors l’inconvénient d’être un peu plus lourd). Choisissez du .jpeg si votre image comporte des photos, ou du .gif si elle comporte peu de couleurs (attention, ce format est destructif). Sur GIMP cette commande n’existe pas directement. Il faut donc vous assurer que votre image est bien à 72ppi tout d’abord. Dans Image>Échelle et taille de l’image, ramenez la résolution à 72ppi (appuyez sur OK). Dans Fichier>Enregistrez sous, choisissez le bon format d’image comme indiqué ci-dessus.

Utilisateur du format Raw : derawtisez et étalonnez votre fichier

Je le répète une fois de plus, utiliser le format Raw pour vos photographies qui méritent un post-traitement fin n’est vraiment pas plus complexe que de le faire en jpeg. Le grand avantage est un pouvoir de correction décuplé dès lors que vous voulez modifier la balance des blancs, la saturation ou le contraste (et lorsque je dis décuplé, c’est plus une forme de style car les possibilités sont bien supérieures). Ce choix est cependant réservé aux possesseurs d’un appareil un peu plus sophistiqué comme un reflex numérique par exemple. Dans le cadre de ce tuto, j’étudie les possibilités de deux logiciels :

• Camera Raw le plus connu des derawtiseurs (quel vilain mot) qui fait partie de la gamme Adobe et qui se greffe directement sur Photoshop (il est également le moteur de Lightroom). Il dépend de Photoshop et ne peux être acheté à part. Il est très ergonomique et puissant.
• UFRaw qui peut être utilisé indépendamment ou en complémentarité avec GIMP (documentation sur ce lien – téléchargement ici si vous êtes sur PC,là si vous êtes sur MAC). Il est open-source et offre toutes les possibilités de son grand frère.

Les extensions d’un fichiers Raw sont nombreuses : .nef, .raw, .dng, .arw, etc. Il existe plus de 200 types de fichiers, ce qui explique qu’il faut un logiciel spécifique pour le traiter

1Nous allons commencer le traitement du fichier Raw en réglant précisément la balance des blancs (si celle ci n’a pas été faite de façon précise à la prise de vue. Avec l’outil pipette il va être très facile de le faire. Sur Camera Raw la pipette se trouve dans la palette d’outil en Haut (appuyez autrement sur I). Cliquez sur une partie blanche (celle de votre cyclo) ; si le résultat n’est pas convaincant, vous avez le droit à d’autres essais. Sur UFRaw, la méthode est un peu différente, mais le résultat sera le même : sélectionner dans l’image une partie blanche (cela se fait de façon intuitive en cliquant-glissant avec la souris. Appuyez ensuite sur la pipette dans l’onglet ‘balance des blancs’

2Poursuivons ensuite en réglant l’exposition et le contraste de votre image. Nous allons pouvoir corriger une sur ou sous-exposition en agissant sur l’exposition de la photo, et densifier les parties noires pour rendre l’image plus dense et agréable à l’œil. Sur Camera Raw, ces deux réglages sont dans la partie droite de l’application : agissez doucement sur les curseurs Exposition et Noir pour trouver un réglage adéquat.  Sur UFRaw, les choses sont un peu moins simples et intuitives. Le plus aisé est d’appuyer sur le bouton avec les deux engrenages pour obtenir un réglage automatique. Dans l’onglet « correction luminosité, saturation » vous pouvez agir sur le niveaux de noir. Si votre image semble brumeuse ou délavée, le bouton noir automatique pourrait la corriger.

3Il existe beaucoup de possibilités de correction sur un derawtiseur qui mériterait un ensemble de formations à elles seules. N’hésitez pas à tester les différents réglages qui vont surprendront. Notons également que l’ont peut appliquer un même réglage sur tout un ensemble de photos prises au même moment ; cela se nomme le traitement par lot ou « batch » en anglais. Cette manoeuvre est relativement aisée pour Camera raw, un peu moins pour UFraw où il faut lancer le processus en ligne de commande. Sur Camera raw et UFraw vous pouvez ensuite basculer respectivement vers Photoshop ou Gimp. En appuyant sur ‘Ouvrir l’image’ sur Camera Raw ou sur l’icône GIMP pour basculer vers ces applications et travailler encore sur votre image si nécessaire.

Une fois de plus, ne manquez pas de commenter cet article. J’apporterai des réponses à vos questions dans la mesure du possible.

Dans cette leçon nous allons étudier ensemble tous les principes qui vous permettront de mieux comprendre et maîtriser votre appareil photo. Cette leçon s’adresse principalement à ceux qui ne connaissent pas ou peu leur appareil photographique ; un petit icône vous préviendra des notions un peu plus avancées. Je vous souhaite une très bonne lecture ! (ne manquez pas de suivre la leçon précédente si vous ne l’avez pas fait).

Assurer votre stabilité

Travailler sur un pied-photo vous donne l’assurance d’avoir des photos nettes (tout du moins sans flou de bougé). Cette stabilité de prise de vue vous permettra également de soigner votre composition pour que celle-ci se rapproche au maximum de votre cadrage définitif.

Travailler sur pied vous assure également la reproductibilité de vos angles de prise de vue et vous sauve le coup si vous avez oublié un paramètre et que vous devez recommencer la photo. Ainsi stabilisé, vous pourrez reproduire facilement la prise de vue avec un angle et un cadrage qui vous plaisait.

En vertu de cela, ne touchez pas à votre installation (ne modifiez pas la position du pied ni de la boîte à lumière et de son dispositif d’éclairage) avant d’avoir eu l’assurance que vos visuels sont réussis. Cela paraît un conseil simple à donner et pourtant même en le connaissant, il m’arrive encore parfois de faire cette erreur.

Je n’ai pas vraiment de solution toute faite pour remplacer un pied avec un bricolage maison. Cela me paraît un accessoire relativement indispensable si vous vous lancez dans des séries de photos. Il existe des pieds à tous les prix, du moins onéreux à la tête fluide à branches en fibre de carbone. Sachez choisir le vôtre.

Prise de vue

Maîtrisez les bases : Travaillez dans le mode qui vous donnera la meilleure qualité (la qualité Jpeg la moins compressée) et la plus grande taille en terme de pixels. Sur un reflex Nikon choisissez le réglage FINE, sur un reflex Canon, recherchez le réglage L (comme Large). Le travail de post-production (c’est-à-dire de filtrage de votre photo) sera ainsi moins destructif.

Pour aller un peu plus loin : les utilisateurs les plus avancés travailleront en RAW. Cette solution est toutefois réservée aux boîtiers reflex et non à la plupart des compacts. Si vous avez la chance de disposer d’un tel appareil, c’est un format à privilégier. Ce format offre la possibilité de régler en post-production (sur votre ordinateur) la balance des blancs, la température de couleur, l’exposition, la saturation, la réduction de bruit et le réglage fin de netteté ou encore les aberrations chromatiques. C’est le format que j’ai utilisé lors des prises de vue test de la leçon précédente.

L’inconvénient est qu’il nécessite un logiciel supplémentaire pour le traiter correctement et qu’il pèsera plus lourd sur votre carte mémoire. Nous étudierons cela lors de la 3e leçon, et vous verrez qu’il existe de nombreuses solutions, même dans le domaine open-source.

Choisissez votre objectif

Maîtrisez les bases : placez un peu loin votre appareil photo et zoomez plutôt que de vous rapprocher et de dézoomer. Si je grossis le trait, je pourrais également dire que votre objet sera plus valorisé s’il est regardé à travers une paire de jumelle que dans un juda de porte (avec l’effet de fuite des perspectives)

Pour aller un peu plus loin : En d’autres termes, préférez un petit télé-objectif à un grand angle. Travaillez avec un objectif compris entre 50mm et 80mm (si vous avez un capteur full-frame, vous devrez évoluer entre 75mm et 120mm, mais que faites-vous sur mon tuto avec un tel appareil ? .

Réglage de votre appareil

Maîtrisez les bases : Travailler en mode Auto la plupart du temps représenté par la couleur verte. Assurez vous bien que votre appareil mesure la lumière sur l’objet photographié et non sur le fond (ce qui pourrait fausser la mesure). Dans tous les cas, veillez à ce que l’objet soit bien net sur toute sa surface en regardant une photo « test » sur l’ordinateur. Si vous rencontrez des soucis d’exposition, il faudra rechercher la mesure de la lumière dite « Spot » et viser votre objet, ou faire joujou avec les réglages manuels à partir des résultats que vous donnera votre cellule. C’est le seul moyen de vous en sortir correctement.

Pour aller un peu plus loin : Travailler en priorité ouverture (Sur un reflex Nikon choisissez le réglage A comme Aperture, sur un reflex Canon, recherchez le réglage Av) et assurez-vous que le réglage du diaphragme convienne à la profondeur de champ et régler le couple vitesse/ouverture de manière à avoir un rapport satisfaisant.

Voici quelques points qu’il faudra également surveiller si vous voulez aller un peu plus loin

ISO :
la mesure ISO exprime une échelle de mesure de la sensibilité des surfaces sensibles (wikipédia). Cette échelle se nommait ASA au temps où nous achetions de la pellicule (1 ASA = 1 ISO). Si votre appareil est configuré en mesure automatique, il va augmenter la valeur ISO de la prise de vue dès lors que la quantité de lumière nécessaire à une exposition correcte est trop faible. Pour un meilleur rendu photographique, mieux vaut se cantonner à une valeur ISO basse (entre 200 ISO et 600 ISO) pour éviter ce que l’on appelle la montée de grain ou de bruit numérique. Tous les appareils ne sont pas égaux devant ce phénomène et à valeur de réglage égal, certains boîtiers seront bien meilleurs que d’autres.

A focale et réglage ISO égal, voici la différence de rendu entre deux boitiers. On remarque que celui de gauche est plus "moucheté". C'est ce que l'on nomme le bruit numérique

Vitesse :
Le réglage de vitesse vous permet de « geler » ou non, un mouvement. Nous n’allons pas nous servir de cette capacité dans ce cas précis, mais il s’agit de vérifier qu’il est suffisant pour éviter par exemple un flou de bougé lorsque vous appuyez sur le déclencheur de votre appareil. Si vous travaillez tout de même à main levée, veillez à ce que la vitesse soit l‘inverse de la distance focale de l’objectif. Pour un objectif 50mm, travaillez à une vitesse supérieure à 1/50e, pour un objectif 80mm, travaillez à une vitesse supérieure au 1/80e, etc. C’est un petit moyen mnémotechnique simple pour éviter le flou de bougé.

Ouverture :

L’ouverture a ici son importance, car elle gère également  la profondeur de champ. Plus élevé sera le chiffre de votre diaphragme et plus grande sera votre profondeur de champ. Concernant l’exposition et la maîtrise de votre diaphragme (enfin pas le vôtre, plutôt celui de votre appareil), vous pouvez également miser sur le correcteur d’exposition si votre appareil en dispose d’un.

Recherchez  sur votre boitier les mentions EV, IL ou AE et utilisez les en sur-exposant de 0.5 à 1 valeur de diaphragme pour rattraper la mesure de la cellule qui se laisse abuser par la grande surface blanche de votre cyclorama (soit -0.5 ou -1 IL, EV ou AE). Si vous avez toujours considéré ce petit réglage avec beaucoup de circonspection (tout comme moi avec mes premiers boitiers), c’est le moment de l’utiliser !

Profondeur de champ :
Concernant la profondeur de champ, l’idéal est d’avoir l’objet net sur toute sa surface et un arrière-plan flou (pour masquer d’éventuels défauts du papier de fond). Travailler de façon empirique en faisant des essais préalables (sauf si vous avez des abaques de profondeur de champ qui correspondent à votre objectif). A choisir et si vous n’arrivez pas à régler la profondeur de champs, assurer vous de travailler avec une valeur de diaphragme élevée (f/8, f/11 ou f/16).

Balance des blancs

Maîtrisez les bases : si vous travaillez en jpeg, il est vraiment intéressant que votre balance de blanc soit bien réglée. Choisissez le réglage Auto de votre appareil qui est en général probant. Si vous travaillez sur des températures de couleur extrêmes (les lampes dont vous disposez ont un rendu jaune ou magenta par exemple) il sera alors impératif de régler votre appareil correctement ou de choisir des ampoules au rendu plus normalisé (certaines fluo-compactes sont dites par exemple « lumière du jour »). Il n’y a malheureusement pas vraiment de moyen d’envisager les choses plus simplement dans ce domaine-là. Vous pourrez éventuellement vous en sortir par la voie logiciel, mais cela sera moins fidèle que si vous aviez réglé votre appareil correctement à l’origine.

La photo ci-dessus illustre ce phénomène : l'image de gauche est l'image témoin qui a sciemment été prise avec un mauvais réglage de température de couleur (réglage 'lumière artificielle' dans un environnement 'lumière du jour'). Les images suivantes montrent la correction que l'on peut mener dans Photoshop à partir d'une image jpeg, et les corrections qui ont été menées dans camera RAW à partir d'une image RAW. Je vous laisse juge du meilleur rendu !

Pour aller un peu plus loin : Si vous travaillez en RAW, un mauvais réglage est un peu moins catastrophique, même si la dérive colorimétrique de votre objet sera moins importante si vous avez un bon réglage de base. Si la couleur des objets à une importance toute particulière, il peut être intéressant de travailler avec une charte colorimétrique qui comporte les couleurs de base : noir, blanc et gris. On appelle justement cet outil de réglage une charte de gris neutre qui comporte une valeur de gris à 18% (valeur dont se sert le posemètre de notre appareil pour mesurer la lumière). Ces valeurs vont nous aider à calibrer finement la balance des blancs en production et en post-prodution (sur photoshop par exemple) et obtenir par voie de conséquence une bonne reproduction des couleurs.

Vous pourrez trouvez des explications complémentaires en lisant la notice du digigrey (tout est bien expliqué sur le site donc je ne m’étendrai pas dessus) ou encore la Qpcard.

Ne manquez pas de consulter

La photographie sans ombre pour tous – Partie 01|03 : La boîte à lumière

A suivre…

Dans la prochaine leçon, nous étudierons ensemble
- Des conseils de post-production pour optimiser au mieux vos images sur GIMP (open source) et Photoshop

N’hésitez pas à commenter cet article. Je vous répondrai dès que possible

Vous êtes créatrice de bijoux, fondu d’Ebay, responsable d’une boutique en ligne, fou des maquettes…et vous recherchez comment photographier au mieux vos objets et vos créations. Voici la première des 3 leçons qui vous permettra d’obtenir des visuels plus vendeurs et de tirer le meilleur parti de votre appareil photo, en construisant une structure fait-maison, et recyclable ! Ne manquez pas de suivre les chapitres suivants :

Vous êtes nombreux à consulter ces articles.
Ne manquez pas de commenter ou d’ajouter votre témoignage en fin de page. Merci !

» Recette N° 1 : Découvrons les qualités du cyclorama

Un cyclorama (qu’on appelle aussi cyclo en jargon de ‘prod’, lorsqu’on est fatigué de le répéter) est un accessoire qui vient du théâtre.

En production cinématographique et photographique ce dispositif indispensable sert à créer un environnement sans ombre marquée (ce qui est utile pour un « chroma key », c’est-à-dire avec un fond vert ou bleu pour le trucage, très utilisés pour les grands films à effet spéciaux) .

Comme on le voit illustré ici en 3D, le cyclorama ne retient pas les ombres que des arrêtes vives provoquent. C’est donc l’environnement à privilégier pour ne pas avoir d’ombre en arrière plan.

Pour créer votre propre cyclo, il vous suffit d’acheter une feuille de taille A3 (ou A4, selon la taille de votre boîte à lumière) et de la poser ou la fixer afin qu’elle ait une forme semi-circulaire. Choisissez un bristol blanc au grammage assez fort et dont le grain du papier ne retiendra pas la lumière. (exemple de référence d’un papier bristol chez Mille et une feuilles, papeterie créative)

» Recette N° 2 : Qu’est-ce que la température de couleur ?

Ceux qui connaissent un peu la photographie ne seront pas trop paniqué par le sujet : qu’est-ce qu’une température de couleur ? Cela n’a bien entendu rien à voir avec la chaleur ressentie auprès d’une source de lumière. Éloignons nous de l’étude appliquée de la sensitométrie pour retrouver un terrain qui nous est commun à tous.

Cette différence de température de couleur qui est jolie un soir d’hiver est moins charmante pour un appareil photo qui n’a pas la même faculté d’adaptation que nos yeux. Il est donc impératif que toutes les sources de lumière de votre mini-studio soient équilibrées : utilisez pour cela deux sources identiques, que ce soit 2 ampoules traditionnelles à incandescence , 2 halogènes , 2 néons (qui tirent vers le vert ou le magenta, mais que nous pourrons filtrer en post-production, ou si vous savez connaissez la manipulation, faire la balance des blancs sur votre appareil photo).

Dans l’expérience qui suit, j’ai utilisé la lumière solaire uniquement pour conserver un bon équilibre des sources lumineuses.

Pour expérimenter cela, j’ai utilisé le cyclo (c’est-à-dire la simple feuille de bristol adossée contre un meuble pour qu’elle prenne cette forme semi-circulaire) que nous avons évoqué à l’étape précédente et je l’ai éclairé à la lumière solaire (5400°K).

J’ai un peu triché en utilisant un réflecteur photo professionnel que j’ai emprunté à mon épouse, ce pour illuminer le côté opposé au soleil et rattraper la différence de contraste (le soleil s’y reflétant, apporte de la lumière sur le coté droit). J’ai également tiré le voilage de ma fenêtre pour diminuer les ombres portées (je prends de l’avance sur ma recette n°3). Vous pouvez remplacer le réflecteur par panneau de polystyrène ou un grand carton blanc.

Voici la photo prise avec ce système élémentaire :

On pourrait faire largement mieux en terme de prise de vue, mais là n’est pas le sujet. On constate donc que l’on peut faire des images à peu près correctes, mais avec force post-production, ce qui n’est pas vraiment souhaitable pour nos vies d’hommes et de femmes d’affaire pressé(e)s.

Toujours pour les mêmes raisons de différences de température de couleur, et si vous préférez travailler en lumière artificielle,  il sera préférable de travailler le soir ou les volets fermés pour ne pas mélanger la lumière solaire et la lumière électrique qui n’auront pas du tout le même rendu.

» Recette N° 3 :  A la recherche des ombres diffuses

Pour obtenir un résultat très doux et sans ombre, il nous faut impérativement tamiser la lumière pour obtenir un éclairage le plus enveloppant possible.

Pour retrouver ce résultat, vous pouvez utiliser les accessoires ou dispositifs suivants, au choix :

» Recette N° 4 : Une boîte à lumière bricolée avec les moyens du bord

Choisissez une boîte en carton chez votre épicier préféré (préférez le double cannelure, double-face qui sera plus robuste). Ménagez de part et d’autres deux ouvertures de façon bien symétriques : cela donnera plus d’allure à votre bricolage et assurera une répartition gauche et droite équivalente de la lumière.

Ne découpez pas les pans d’ouverture du carton qui pourront éventuellement vous servir ultérieurement comme nous l’étudierons un peu plus tard. Tapissez les ouvertures avec une des trois solutions évoquées dans la recette 3 : un filtre photo, du calque ou un tissu léger et vaporeux qui couvrira les deux ouvertures.

Glissez à l’intérieur la feuille de bristol et fixez la de sorte à ce qu’elle fasse un bel arrondi comme ci-dessus.
Placez enfin des sources de lumière à équi-distance en respectant les conseils que nous avons évoqué jusqu’alors.

J’ai vraiment voulu imaginer ici la méthode la plus économique et la plus simple à mettre en œuvre. Il existe bien entendu des façons de perfectionner ce système comme nous le verrons en conclusion.

Notez toutefois que ce procédé fonctionne bien avec des objets de petite taille à taille moyenne.Pour de plus grands objets ou pour des personnes il sera à mon sens nécessaire de passer à des procédés professionnels car plus l’espace de la boite/studio sera grand, et plus vous devrez ajouter de la lumière. Le flash qui a un rapport énergie/lumière beaucoup plus intéressant deviendra alors indispensable.

Voici le résultat obtenu avec ce type de bricolage :

Nous reviendrons bien entendu sur la façon de retoucher la photo

» Recette N° 5 : Quelques astuces

Vous pouvez également tapisser le haut de votre boite à lumière du même papier qui a servi à votre cyclorama, de sorte que la lumière réfléchisse également sur cette surface. Cela améliorera la qualité de la lumière et limitera encore les quelques ombres résiduelles.

Il existe des ampoules de type  fluo-compacte (économes en énergie) spirale qui affichent une puissance de 85W (Température de couleur: 6400°K  – lumière du jour). C’est un bon investissement pour une meilleure utilisation de ce studio. Ne lésinez pas sur la puissance et la qualité de votre éclairage. Choisissez dans tous les cas des ampoules de même références pour éviter d’avoir des résultats déséquilibrés.

Si vous désirez faire des photos d’objets réfléchissant, je vous engage à remplacer le papier que nous venons d’évoquer par un papier noir et à rabattre les ouvertures du cartons que vous aurez également tapissé de noir.

Cette solution de prise de vue offre de très bons résultats pour peu que l’on s’en serve correctement. Si vous avez besoin d’un plus grand espace de prise de vue ou que vous ne voulez pas vous cassez la tête, il existe des solutions toutes faites pour cela :

• e-photomaker, une tente pour les objets de petites tailles (à partir de 80€ H.T.)
• Cubelite de chez Lastolite pour des espaces de prise de vue de 45cm à 200cm de coté (80€ à 550€ H.T)
• Des kits Cubelite, dans lequel les torches et les pieds lumière sont également compris (à partir de 400€ H.T)

Vous trouverez l’ensemble de ce matériel chez MMF Pro basé à Paris, et qui vend également par correspondance.

L’ensemble des conseils cités ci-dessus resteront cependant tout à fait valable pour en tirer le meilleur parti

A suivre…

Dans les prochaines leçons, nous étudierons ensemble
- Des conseils pour la prise de vue et l’utilisation de votre appareil photo avec votre boîte à lumière
- Des conseils de post-production pour optimiser au mieux vos images sur GIMP (open source) et Photoshop

N’hésitez pas à commenter cet article. Je vous répondrai dès que possible