Webschool contenu-de-qualite-pour-le-web

Contenu de qualitépour le web

Textes et images stylés pour des pages plus lisibles

13-04-2015 // Webschool // CCI du Jura // François Bonneville - Aricia

& Alexis Montpeyroux Graphiste

Ecrire pour le WEB… Pour qui ? Sur quoi ?

• Proposer une chronique à une communauté(amis, réseau, clients, fans)Réseaux sociaux (Facebook, Google +, etc)

• Partager un savoir-faire, une expérience Blogs, site web « personnel »

• Fournir de l’information structurée à un large public Site WEB professionnel, newsletter

• Diffuser des contenus multimédia Plateformes spécialisées

(Youtube, Dailymotion, FlickR, Calameo, etc)

Écrire sur les réseaux sociaux• Séparer personne physique et personne morale• Être actif avec une fréquence régulière• Scénariser chronologiquement ses publications• Ajouter intelligemment des liens dans ses « posts »• Publier des photos de qualité• Géolocaliser ses interventions• Contrôler le niveau de confidentialité• Chercher le buzz sans provocation (effet boomerang)• Ne pas relayer d’informations sans vérification préalable :

partager un fake ruine votre réputation• Ne pas « aimer » ni accepter n’importe qui comme ami

Publier sur un blog

• Donner à ses billets une homogénéité de style• Créer un contenu original qui ne soit pas du plagiat• Garder une régularité de publication sans se sentir

obliger d’écrire pour rien• Soigner ses titres (courts, percutants, voire

provocateurs)• Chercher des liens et des références de qualité• Éviter les plateformes qui noient le contenu sous la

publicité

Site WEB professionnel

Un processus de création complexe• Sur la forme : élaboration d’une identité

graphique et d’une ergonomie• Sur le fond

– Structuration du contenu– Élaboration des textes et choix du vocabulaire

• Dans le temps– Prévoir les évolutions– Diffuser une lettre d’informations

13-04-2015 // Webschool // CCI du Jura // François Bonneville Aricia & Alexis Montpeyroux Graphiste 6

Les textes

Contenu : « Less is more »

• Peut-être moins de contenu, mais du contenu plus logique et lisible

– des textes qui permettent d'entrer dans le contenu plus facilement, voire le remplacent quand le contenu est court : thème, titre, chapô, sous-titres, légendes, intertitre (une écriture journalistique)








Le ton du texte : les conseils d’Airbnb• Les hébergements

proposés sont rarement uniques, alors personnalisez vos descriptions.

• Ne décrivez pas uniquement des faits, mais plutôt l’expérience à vivre.

http://www.fastcompany.com/3043468/the-secrets-of-airbnb-superhosts


La structuration du contenu


• Définir l’architecture avant de commencer à rédiger• Hiérarchiser l’information• Rubriquer par catégories

• Prévoir une page WEB par sujet, par produit• Décomposer le contenu en pages WEB de taille

similaire• Créer des liens internes pour faire référence à des

contenus spécifiques

Les mots clés


• Avant de rédiger, chercher tous les mots clés et leurs synonymes : créer un nuage de termes au cours d’un brainstorming

• Penser dans le vocabulaire de l’internaute• « squatter » les mots clés de ses concurrents• Écrire des phrases simples en cherchant à placer tous les mots clés• Rapprocher les mots qui correspondent aux termes utilisés dans

les moteurs de recherche• Confier ses traductions à un professionnel en lui donnant les

mêmes contraintes• Créer des liens sur les mots clés

• Liens internes• Liens externes

Balises HTML et référencement


• Placer des mots clés dans la balise <title>• Répéter ces mots clés dans les balises « Meta »

<meta name="Description" content= "…">Subject, Copyright, Author, PublisherLa balise meta "keywords" n’a plus guère d’effet sur Google

• Utiliser les balises de titre <h1> <h2> pour structurer le contenu

• Choisir les balises de mises standard de mise en forme<strong> pour mettre en gras<em> pour mettre en italique

Allier le stylisme et la cohérence graphique

• Veiller à la cohérence graphique des styles à travers les pages.– Les CMS proposent des styles de mise en page

cohérents à travers le site et évitent la cacophonie graphique.

• Donner un style spécifique à vos pages– Les polices web permettent de multiplier par 100

le choix en fontes pour les sites


Sites web et newsletters, même combat

• Très peu de temps pour capter le message et juger de son intérêt pour nous

• Peu de place : l’aperçu d’un email est réduit par rapport à une page web

• Les images ne sont pas toujours visibles• Des cadrages souvent panoramiques pour les

images



Des outils de rédaction de newsletter intuitifs en ligne

• Mailchimp• Mailjet• Message business• …



Les images

Les contenus image : fabricationRègles de base de la photographie• Le cadrage

– Avancer, reculer, bouger autour du sujet avant de choisir le point de vue– Mettre « tout ce qu’il faut » (les pieds, la tête) sans cadrer trop large– Composer ses clichés : la règle des tiers

• La profondeur de champ– Choisir le plan de netteté– Définit la progressivité du flou (ouverture de l’objectif)

• Choix de l’instant– Anticiper et savoir attendre

• La lumière– Identifier la position des sources lumineuses (contre-jour)– Contrôler les ombres– Éviter ou accentuer les reflets


Des exemples concrets

• S’adapter à la capacité de son appareil photo

• Bricoler un fond photo maison et quelques astuces de ministudio

• Penser le cadrage (verticalité, garder de la matière autour)


• Choisir un fond neutre, sans parasites• Penser à préserver des zones sur lesquelles écrire• On peut choisir des couleurs de textes tirées de

l’image (à la pipette)


• Un éclairage (presque) professionnel


• Prêter attention aux détails qui fâchent


• Un fond photo (presque) professionnel• Se méfier du grand angle et de la hauteur de prise de vue

– Capturer avec de la marge, puis recadrer. Mesure de lumière décadrée.


• Éclairage diffusé ou naturel, mais doux (début ou fin de journée)


• On peut cependant exploiter l’effet exagéré du grand angle.


• On cherchera surtout à…

Les contenus image : classement• Des logiciels de catalogage sur votre ordinateur

• Microsoft Expression Media >>> www.microsoft.com/fr-fr/download/details.aspx?id=6605 • Photo Mechanic >>> >>> http://www.camerabits.com/products• Adobe Bridge >>> www.adobe.com

• Des logiciels de catalogage en ligne• Flickr >>> www.flickr.com• Google photos >>> www.google.com/intl/fr_ALL/+/learnmore/photos

• Des banques de photos en ligne• Fotolia >>> www.fotolia.com• Dreamstime >>> www.dreamstime.com


Microsoft Expression Media


• Classer, étiqueter, gérer vos images

Flickr


• 1To gratuit !• Niveau de confidentialité• Création de fichiers de

différentes résolution• Titre, description, mots clés,

géolocalisation, albums, classeurs

• Moteur de recherche• Des composants pour

intégrer des diaporamas• Une « API »

Banques d’images en ligne• Acheter des images à l’unité après recherche


• Fotolia, Dreamstime…

Maintenant à vous de jouer.

• Mettez en avant les points clés de vos problématiques dans vos textes.

• Avancez des idées simples, claires et complémentaires.

• Créez votre fond documentaire.• Classez-le pour vous y retrouver.• Faites votre choix. Racontez votre histoire…


FIN

Merci de votre attention.


rue de l’église39270 ORGELET

www.aricia.fr

Technology

Webschool contenu-de-qualite-pour-le-web