Savoir prendre et retravailler des photos pour illustrer son site internet

1. Les bases pratiques de la photographie
Kristell Trochu
kristelltrochu@terrenourriciere.org
09 53 44 34 34
www.terrenourriciere.org

2. Sommaire
• Se présenter
• La photographie et le web
– Importance pour le web
– Quelles photographies?
• Comment faire une bonne image?
– Les bases
– Prises de vues
– Commenter une image
• Mettre une image sur internet
– Transférer son image
– Réduire son image
– La personnaliser
• A vous de jouer : après la théorie… la pratique

3. La photographie et le web

4. Importance de l’image sur le web
• Les internautes font + attention aux textes qu'aux images
• Une image aura + de chances d'être vue si elle est
étroitement intégrée au contenu
• Un article avec une image est cependant plus lu
• En matière d'e-commerce, une photo vaut parfois mille
mots.

8. Les différents rôles des images
Dans un ordre décroissant d'efficacité :
– L'image comme élément d'information
– L'image comme élément de navigation
– L'image comme élément de mise en page
– L'image comme élément d'ornementation

9. Importance de l’image sur le web
• Prévoyez une légende, concise et donnant du sens
• Associer à ses images un texte alternatif (équivalent textuel,
descriptif et concis, visible au survol de la souris)
• Privilégiez les images à caractère informatif

10. Une photographie: pourquoi? pour qui?
• Définir le message que l’on veut passer
• Importance du ciblage :
– Touristes
– Locaux
– Jeunes
– Familles
– Grand public

11. Les bases pour faire une bonne image

12. Cadrage
Horizontal
Vision humaine Sens de lecture
Paysage / groupe Vertical
Calme profondeur distance Portrait / action dans la hauteur
Plus de balayage
Dynamisme chaleur

13. Cadrage
Carré Panoramique

14. Points de vue
À hauteur
Respect Plongée Contre plongée
Attention aux enfants! Solitude et détresse puissance et domination

15. Plans
Plan général Plan d’ensemble Plan moyen
Plan américain Plan rapproché Gros plan Très gros plan
http://www.web-libre.org

16. Règle des tiers

17. Règle des tiers
Les yeux sur une ligne De l’espace devant le personnage

18. Les lignes directrices
Lignes horizontale ou vertical = statique
Guider l’œil vers le sujet principal

19. Exposition
Sous exposition Surexposition

20. Flou/net
Faible profondeur de champs Grande profondeur de champs

21. Cadrage d’une image
Ne garder que la partie réellement Quelle est la partie de l'image dont je peux me
efficace et informative. passer ?
... d'un point de vue informatif et non seulement
ornemental !
• Recadrer une image = Est-ce que tous les détails sont vraiment
indispensables ? ...
simplifier l’image
– Recentrer sur son sujet principal
– Eliminer les pourtours superflus
parfaitement recadrée, mais sa taille pourrait
certainement être diminuée

22. Poids d’une image
• Choisissez le format
– JPEG pour les photographies
– GIF pour les icônes, la typographie ou les vignettes (thumbnails)
• Diminuer la taille et le poids d'une image :
– Diminuer la résolution
– Simplifier la palette de couleurs : postériser
Chaque kilobyte gagné améliore les performances de votre site
et la satisfaction des utilisateurs !

23. Taille et poids
• Taille maximum : 600px de largeur (un site fait entre 800
et 1020)
• Poids : 200 ko (si plus petite beaucoup moins)

24. Paysage

25. Paysage
• Une grande netteté sur tous les plans
• Un premier plan possible
• Fuite du regard possible : suivre une ligne

26. Action

27. Action
• Des images avec de l’espace autour de l’action
• Des lignes dynamiques
• Des mouvements suspendus

28. Lieux

29. Lieux
• Agencer tous les éléments
• Utiliser la lumière, jouer sur la sérénité
• Plusieurs images pour un même lieu : une visite...

30. Personnes

31. Personnes
• Faites des portraits
• Plans serrés
• Soyez originaux
• ...
• Pour les groupes : plans rapprochés

32. Règles
• Raconter quelque chose, elle doit faire passer un
message, une émotion.
• Ne montrer qu’un seul sujet principal
• Choisir son heure, sa saison (Les Golden Hours correspondent à la
première et à la dernière heure de soleil dans la journée, au moment où le
soleil n’est pas trop haut dans le ciel)
• Ne pas hésiter à mettre en scène
• Alterner les plans (de généraux à gros)

33. Autres éléments
• Veillez à conserver l'horizon horizontal. La mer qui penche,
c'est rare...
• Un premier plan donne de la profondeur à une image.
• La gauche va représenter le passé et la droite le futur.
• Le bas d’une image représente la matérialité alors que le
haut va plutôt rappeler la spiritualité.
• Veillez à laisser une zone neutre dans votre cadre.

34. Un peu plus de technique
• Ouverture et diaphragme

35. Un peu plus de technique
Priorité Ouverture | Vitesse Priorité Ouverture | Vitesse
d'Obturation 1/25 | Valeur Ouverture 8 d'Obturation 1/1000 | Valeur
| Sensibilité ISO 50 Ouverture 3.2 | Sensibilité ISO 50