Sauvegarde images et format affichage web

Bonjour,

J'ai une question qui va paraitre des plus basiques pour l'ensemble d'entre vous mais je demarre le dvt d'un site web.

Je programme en ce moment l'affichage de photos miniatures et en cliquant sur une photos il y a une nouvelle fenêtre qui apparait pour afficher la photo en plus grand avec un petit programme trouvé sur ce forum (splash image).

Je voudrais savoir quelle est la meilleure procédure pour, à partir de photos téléchargés sur le micro (photos prises avec un numérique), sauvegarder les photos à afficher sur un site web à savoir :

- résolution photo numérique lors de la prise : y-a-t-il quelques conseils ?

- le meilleur format de sauvegarde : JPEG ? PNG ?

- Comment dimensionner la photo pour qu'elle puisse apparaître en miniature puis en taille réelle lors de l'aggrandissement ?

- Quel est le code CSS pour afficher la photo en miniature car pour l'instant je n'obtiens pas ce que je veux. Avec width et Height, on donne les dimensions de la zone qui va contenir la photo mais cela ne change rien.
Comment faire pour avec une seule photo, avec un affichage en miniature et un affichage en normal ?

Bref vos conseils seront les bienvenus.

Merci d'avance
Claude

Salut.

Alors déjà, je suis un noob, donc je suis assez mal placé pour faire mon shérif, mais il me semble que tu as déjà ouvert un topic sur ton problème d'images. Enfin, je dis ça, je dis rien...

A part ça, au niveau des images, personnellement, au niveau de la prise, je prends toujours mes photos dans la meilleure définition possible. Ca ne pose aucun problème de les réduire ensuite (voir de les compresser au max et de baisser la définition selon tes besoins) L'inverse est plus difficile à faire (agrandir une image, augmenter la def...ça fait tout de suite moins propre) Donc je conserve toujours des masters "haute qualité".

Ensuite, pour ce qui est des miniatures, tu peux forcer tes images à s'afficher en tout petit (avec les attributs "width" et "heigth" de ton img) pour ensuite les ouvrir en "grand" dans un autre div (plusieurs méthodes...un ch'tite fonction javascript...ou dur pur CSS..il me semble qu'il y a un bon tuto ici même sur ce genre de fonction)
Cependant, je te déconseille cette méthode, surtout si ton site doit comporter beaucoup d'images. car dans ce cas, même si ton navigateur affichera les vignettes en tout petit, il devra auparavant charger l'image dans sa taille d'origine. Ce qui peut vite devenir très lourd et très lent pour une petite ou moyenne connexion. (voire même pour une grosse si t'as vraiment beaucoup d'images HD)
Je te conseille donc de créer deux versions de tes images : un grande, et une petite. les vignettes mettront nettement moins de temps à charger, et les grandes ne seront chargées que si l'utilisateur le décide, et une par une (sauf si tu les forces à se preloader, ce qui peut faire gagner un peu de temps...)
C'est plus de boulot, mais c'est nettement plus confortable pour les gens qui viendront sur ton site.
Pour ce qui est de la taille/définition etc...à toi de voir. C'est selon la taille que tu veux obtenir pour tes images finales (en n'oubliant pas les différentes définitions d'écran)
Par habitude, pour les photos j'utilise le format jpg...Le png c'est excellent pour remplacer le gif (tant que tu ne fais pas de transparence...saloperie d'IE6)....mais à toi de tester pour voir le meilleur rapport qualité/poids.

Bon courage.

A noter que pour les miniatures (images d'apperçu de petite taille) il est possible d'automatiser ça en php, ou encore de le faire via un programme tel XnView {fr} (outils -> conversion multiple) qui permet de traiter toutes les images en un coup plutôt qu'une par une.


Pour le reste je ne peux que plussoyer Kea .