Quel compromis taille résolution pour un bon affichage web

Démarré par migué2A, Mai 26, 2012, 16:24:17

« précédent - suivant »

migué2A

Tout est dans le titre:
J'avais un site Wix en flash donc difficement référençable, je (on) me le refait entièrement en html hébergé chez OVH comme le précédent.
Q: Il est dit que la résolution 72 dpi est suffisante pour l'affichage web,
partant de là quelle taille vous apparait etre un bon compromis poids qualité.
Merci de vos lumières

GG_

Citation de: migué2A le Mai 26, 2012, 16:24:17
J'avais un site Wix en flash donc difficement référençable, je (on) me le refait entièrement en html hébergé chez OVH comme le précédent.

Moi j'ai voulu garder le flash, j'ai donc du dupliquer mes galeries en html pour faire référencer mes images par Google, en prenant soin de spécifier que mes galeries flash sont des doublons et qu'il faut référencer les galeries html, et ça marche !

Citation de: migué2A le Mai 26, 2012, 16:24:17
Q: Il est dit que la résolution 72 dpi est suffisante pour l'affichage web,
partant de là quelle taille vous apparait etre un bon compromis poids qualité.

Le dpi spécifie uniquement des pixels par unité de longueur, donc on s'en fiche.
C'est la résolution en pixels qu'il faut ajuster. Moi j'utilise environ 760 x 500 pixels avec une compression JPEG telle que j'ai des fichiers d'environ 100ko.

migué2A

J'ai viré le site "Flash" donc pas de risque de doublon.
Pour le reste je vais tester la résoltion proposée, j'ai vue qu'elle homothetique avec le 24x36
Merci
Michel

Verso92

Citation de: GG_ le Mai 26, 2012, 23:35:20
Le dpi spécifie uniquement des pixels par unité de longueur, donc on s'en fiche.

Toutafé.
Citation de: GG_ le Mai 26, 2012, 23:35:20
C'est la résolution en pixels qu'il faut ajuster.

Pour employer les bons termes, c'est la définition qu'il faut ajuster.
Citation de: GG_ le Mai 26, 2012, 23:35:20
Moi j'utilise environ 760 x 500 pixels avec une compression JPEG telle que j'ai des fichiers d'environ 100ko.

C'est un compromis raisonnable.
Pour ma part (voir ma galerie photo Piwigo), j'utilise une définition d'image de 1024 pixels de large pour les photos horizontales et de 800 pixels de haut pour les photos verticales (poids aux alentours de 200ko) pour l'affichage "haute définition". En "standard", les photos sont affichées en 800 pixels de large (ou 600 pixels de haut).

migué2A

Verso,
après un tour sur ton site, j'y vois plus clair.
Je vais me caler sur tes propositions de "définition".
A trop descendre on finit par perdre nettement en qualité et le comparatif "avant" "après" est dramatique.
Le but n'étant pas de montrer des images médiocres pour avoir un site léger.

GG_

Citation de: migué2A le Mai 27, 2012, 08:47:32
J'ai viré le site "Flash" donc pas de risque de doublon.

Pour être sûr de bien m'être fait comprendre, Google autorise les doublons (fichiers à contenu similaire) dès lors que l'on utilise bien la bonne balise "canonical" prévue pour cela. Plus de détails par ici http://support.google.com/webmasters/bin/answer.py?hl=en&answer=139066

plegall

Citation de: Verso92 le Mai 27, 2012, 09:03:06
Pour ma part (voir ma galerie photo Piwigo), j'utilise une définition d'image de 1024 pixels de large pour les photos horizontales et de 800 pixels de haut pour les photos verticales (poids aux alentours de 200ko) pour l'affichage "haute définition". En "standard", les photos sont affichées en 800 pixels de large (ou 600 pixels de haut).
A noter qu'avec l'arrivée de la version 2.4 de Piwigo, le principe de la "taille web" disparaît : Piwigo va automatiquement proposer 8 tailles, allant du XXS au XXL (M par défaut en dimensions maximales 792x594 pixels). Le visiteur qui a un grand écran pourra afficher plutôt la XL et celui avec un petit écran la S.

la_grenouille

Citation de: plegall le Mai 27, 2012, 23:09:04
A noter qu'avec l'arrivée de la version 2.4 de Piwigo, le principe de la "taille web" disparaît : Piwigo va automatiquement proposer 8 tailles, allant du XXS au XXL (M par défaut en dimensions maximales 792x594 pixels). Le visiteur qui a un grand écran pourra afficher plutôt la XL et celui avec un petit écran la S.

Peut-être saurez vous répondre à mes questions à ce sujet.  :)
Je cherche à migrer mon site de galeries photos (Impact Web Site Publisher Pro en plugin pour Lightroom) et je suis tenté par Piwigo qui permettrait d'avoir (toujours avec un moteur de publication des images depuis LR) :
1. des commentaires par photo ou par galerie, pour rendre la chose plus vivante
2. un flux RSS pour prévenir des modifications/ajouts

Le problème est que je ne suis pas tout à fait satisfait des sites Piwigo que j'ai vu jusqu'à présent (une dizaine seulement...) car il manque toujours au moins un des éléments suivants :
A. Taille des images qui s'adapte pour se mettre en (quasi) plein écran lors de la navigation dans une galerie, avec le minimum de menus autour pour ne pas perturber sa lecture. En général, sur les sites Piwigo je vois des images petites et entourées de menus (choix du créateur du site ?). Pire, il faut parfois sur les petits écrans (portable 13") jouer de l'ascenseur sur chaque photo pour la voir en entier !
B. présentation sobre, sans tous les menus à gauche et en bas. (Les statistiques, les exif, etc... m'importent peu)
C. Possibilité de mettre un petit texte (plusieurs phrases) pour chaque "ensemble de galerie" pour présenter le thème abordé dans les galeries qu'il contient.

J'ai vu que C. était possible, mais je n'ai pas vraiment vu cela pour A. et B. est ce que la version évoquée par plegall permet dorénavant le point A automatiquement ?
Une photo vaut mille mensonges

icon6

Il y a quelques systèmes en "responsive" ou vous n'avez plus besoin de vous préoccuper de la taille, il suffit d'envoyer vos images pour la résolution la plus grande. (c'est à dire environs 2000px du coté le plus large.)

Wix propose des sites colonnes de 980 pixels de large donc non adaptés à la présentation plein écran.

Le flash est à éviter pour de nombreuses raisons, notamment son poids mais aussi son exécution sur les mobiles ou encore son entretien (adobe a abandonné flash l'an dernier).

Notre système ne permet pas d'envoyer ses photos depuis Lightroom néanmoins cela semble répondre à vos besoins concernant l'ergonomie du plein écran ou du poids. (http://icon6.com)

Verso92

Citation de: icon6 le Juillet 10, 2013, 21:23:19
Le flash est à éviter pour de nombreuses raisons, notamment son poids mais aussi son exécution sur les mobiles ou encore son entretien (adobe a abandonné flash l'an dernier).

Adobe vient pourtant de me proposer un MàJ tout à l'heure...

icon6

Oui ce sont des mises à jour de sécurité pour cause de "vulnérabilités critiques".

Je parlais de la version mobile pour l'abandon mais l'entretien de la version de base semble compliqué et sans intérêt sauf pour l'animation pure et encore : Adobe Edge Animate CC.

Le javascript et le html5 ayant clairement remplacé cette technologie au niveau du web.

la_grenouille

Citation de: icon6 le Juillet 10, 2013, 21:23:19
Il y a quelques systèmes en "responsive" ou vous n'avez plus besoin de vous préoccuper de la taille, il suffit d'envoyer vos images pour la résolution la plus grande. (c'est à dire environs 2000px du coté le plus large.)
(...)

Justement, avec Impact Web Site Publisher Pro que j'utilise actuellement, je ne me préoccupe pas vraiment de la taille. Enfin, plus exactement, trois tailles sont définies au départ, mais lorsque j'ajoute une photo dans une galerie lightroom, elle est téléchargée automatiquement dans les 3 tailles. En surfant sur le site résultant, seule l'image avec la taille la plus appropriée est téléchargée et elle est redimensionnée à la taille de la fenêtre du navigateur. Il est vrai que je souhaiterais conserver le principe de l'image de taille adaptée à l'écran.
Merci pour votre réponse, je vais tout de même regarder ce système  :)
Une photo vaut mille mensonges

plegall

Citation de: la_grenouille le Juillet 10, 2013, 18:38:46
Peut-être saurez vous répondre à mes questions à ce sujet.  :)
Avec plaisir.

Citation de: la_grenouille le Juillet 10, 2013, 18:38:46Je cherche à migrer mon site de galeries photos (Impact Web Site Publisher Pro en plugin pour Lightroom) et je suis tenté par Piwigo qui permettrait d'avoir (toujours avec un moteur de publication des images depuis LR) :
1. des commentaires par photo ou par galerie, pour rendre la chose plus vivante
Les commentaires par photo sont une fonctionnalité native de Piwigo. Pour les commentaires par album, il faut activer le plugin Comments on Album.

Citation de: la_grenouille le Juillet 10, 2013, 18:38:462. un flux RSS pour prévenir des modifications/ajouts
Même si de mon point de vue le flux RSS n'est utilisé que par quelques techniciens de l'informatique (malheureusement, parce que c'est une super techno), Piwigo propose ce mode de notification. N'importe quel visiteur peut aller sur le lien "notification RSS" du menu de la galerie et 2 flux RSS sont disponibles : un flux avec les miniatures et un flux avec uniquement du texte.
Citation de: la_grenouille le Juillet 10, 2013, 18:38:46
Le problème est que je ne suis pas tout à fait satisfait des sites Piwigo que j'ai vu jusqu'à présent (une dizaine seulement...) car il manque toujours au moins un des éléments suivants :
A. Taille des images qui s'adapte pour se mettre en (quasi) plein écran lors de la navigation dans une galerie, avec le minimum de menus autour pour ne pas perturber sa lecture. En général, sur les sites Piwigo je vois des images petites et entourées de menus (choix du créateur du site ?). Pire, il faut parfois sur les petits écrans (portable 13") jouer de l'ascenseur sur chaque photo pour la voir en entier !

Donc je rappelle que dans Piwigo, il y a la photo originale puis Piwigo génère jusqu'à 9 tailles : carrée, miniature, XXS, XS, S, M, L, XL, XXL. Par défaut sur la page de la photo, c'est la taille M qui s'affiche. On peut configurer Piwigo pour que la taille par défaut soit L ou XL ou S... On peut aussi changer les dimensions (en pixels) de chaque taille.

Ensuite il y a le plugin Automatic Size, qui permet de choisir la taille la mieux adaptée à l'écran du visiteur. Par exemple avec mon écran 1680x1050, je vais afficher la taille XL pour les paysages et la taille L pour les portraits. Le plugin choisit la taille pour qu'il n'y ait pas besoin de "scroller" et pour maximiser l'espace consacré à la photo.

Citation de: la_grenouille le Juillet 10, 2013, 18:38:46
B. présentation sobre, sans tous les menus à gauche et en bas. (Les statistiques, les exif, etc... m'importent peu)

D'abord il faut choisir le thème qui s'approche le plus de ce que vous cherchez. A mon avis, si la sobriété prime, c'est le thème Stripped le mieux placé. Ensuite il faut regarder la page de configuration du thème pour voir ce qu'on active ou désactive.

Evidemment, certains plugins ajoutent des informations, libre à l'administrateur de la galerie de choisir les plugins qui l'intéresse. C'est ce qui fait que chaque galerie Piwigo est unique.

Citation de: la_grenouille le Juillet 10, 2013, 18:38:46
C. Possibilité de mettre un petit texte (plusieurs phrases) pour chaque "ensemble de galerie" pour présenter le thème abordé dans les galeries qu'il contient.

Je pense qu'il s'agit simplement de rédiger une description pour un album. (un album pouvant contenir autant de niveaux de sous-albums que souhaité)

Citation de: la_grenouille le Juillet 10, 2013, 18:38:46
J'ai vu que C. était possible, mais je n'ai pas vraiment vu cela pour A. et B. est ce que la version évoquée par plegall permet dorénavant le point A automatiquement ?
Pour le A : plugin Automatic Size. Pour le B, à vous de choisir le thème le plus adapté (et éventuellement de le personnaliser pour supprimer le superflu)

plegall

Citation de: icon6 le Juillet 10, 2013, 21:51:30
Le javascript et le html5 ayant clairement remplacé cette technologie au niveau du web.
Ceux qui ont choisi le Flash comme technologie principale s'en mordent certainement les doigts et ont été obligé de tout refaire avec des technos ouvertes...

la_grenouille

Merci pour avoir pris le temps de me répondre.

Citation de: plegall le Juillet 11, 2013, 16:03:53
(...)
Ensuite il y a le plugin Automatic Size, qui permet de choisir la taille la mieux adaptée à l'écran du visiteur. Par exemple avec mon écran 1680x1050, je vais afficher la taille XL pour les paysages et la taille L pour les portraits. Le plugin choisit la taille pour qu'il n'y ait pas besoin de "scroller" et pour maximiser l'espace consacré à la photo.
(...)
Donc si je comprends bien, avec ce plugin, la taille la plus grande affichable sur l'écran du visiteur sans scroll sera choisie parmi différentes tailles pré enregistrées (au maximum 9). Ca n'est pas le redimensionnement à la volée que j'ai actuellement mais si le choix se fait parmi 9 tailles, c'est déjà pas mal. Auriez vous un(des) exemple(s) d'un site Piwigo utilisant ce plugin ?
Et auriez-vous un(des) exemple(s) de site utilisant le thème "Sripped" ?

Pour finir, est ce que les sites faits sur Piwigo.com ont des possibilités différentes (en + ou en -) par rapport à un site Piwigo sur un serveur indépendant ?
Une photo vaut mille mensonges

Tomzé

J'utilise le thème Stripped et une multitude de plugins. C'est une galerie avec plus de 20 utilisateurs
http://lyon-photo-gone.piwigo.com
Tout a été fait, sauf par moi.

plegall

Citation de: la_grenouille le Juillet 11, 2013, 16:52:50
Donc si je comprends bien, avec ce plugin, la taille la plus grande affichable sur l'écran du visiteur sans scroll sera choisie parmi différentes tailles pré enregistrées (au maximum 9). Ca n'est pas le redimensionnement à la volée que j'ai actuellement mais si le choix se fait parmi 9 tailles, c'est déjà pas mal.

Il y a 2 approches qui s'opposent dans le "choix de taille automatique". D'un côté il y a le système du plugin Automatic Size qui sélectionne la taille la plus grande possible sans que ça dépasse et qui ne fait aucun redimensionnement dans le navigateur web. De l'autre il y a le système "j'envoie une photo plus grande et je réduit à l'affichage". La seconde méthode est intégrée dans le thème Stripped d'ailleurs, en tout cas pour le moment.

La seconde méthode permet d'avoir une photo qui optimise l'espace au millimètre (enfin... au pixel). Par contre, elle oblige à envoyer une photo grande et lourde. Par exemple, si je sais que mes visiteurs ont des écrans en 1920x1080 il faut que la taille envoyée fasse au moins ces dimensions. Et même pour ceux qui visitent avec un portable 13 pouces... Ce n'est pas optimal du point de vue vitesse d'affichage et confort de navigation sur la galerie. L'autre soucis, c'est que le redimensionnement "à l'affichage" par le navigateur marche bien dans les navigateurs modernes mais rend l'image très moche sur des navigateurs plus anciens. Et vous ne pouvez pas imposer un navigateur à vos visiteurs...

Donc je précise qu'à l'heure actuelle, Stripped a son propre système de redimensionnement et n'est pas compatible avec le plugin Automatic Size. Mais il est prévu de faire évoluer Stripped pour devenir compatible Automatic Size.

Citation de: la_grenouille le Juillet 11, 2013, 16:52:50
Auriez vous un(des) exemple(s) d'un site Piwigo utilisant ce plugin ?

http://piwigo.us/beta/25

Citation de: la_grenouille le Juillet 11, 2013, 16:52:50
Et auriez-vous un(des) exemple(s) de site utilisant le thème "Sripped" ?

http://pichardie.piwigo.com
http://www.brigitte-raison-photographies.com/
http://www.objectif-macro.fr/index.php?/categories
et des milliers d'autres... j'ai trouvé ceux là sur notre "Showcase" http://fr.piwigo.org/showcase/

Citation de: la_grenouille le Juillet 11, 2013, 16:52:50
Pour finir, est ce que les sites faits sur Piwigo.com ont des possibilités différentes (en + ou en -) par rapport à un site Piwigo sur un serveur indépendant ?
Très bonne question. Je copie ici mes explications faites sur le forum Piwigo.org http://fr.piwigo.org/forum/viewtopic.php?pid=202303#p202303 :

Citation de: plg sur le forum Piwigo.org
[...] des différences entre Piwigo sur Piwigo.com et hors Piwigo.com :

* pas d'accès FTP
* liste d'extensions pré-installées (testées, validées)
* LocalFiles Editor limité aux fichiers CSS (mais le support peut modifier la configuration locale)

Cette liste c'est ce qu'il y a "en moins" sur Piwigo.com, et voici ce qu'il y a "en plus" :

* stockage illimité
* installation automatique
* mises à jour automatiques
* sauvegardes automatiques (disques redondés, duplication sur serveurs de secours)
* support par email

Grosso modo, Piwigo.com c'est le confort et la tranquilité, sans pour autant perdre en liberté car l'utilisateur n'est jamais verrouillé : à tout moment il peut exporter ses données (base de données, fichiers locaux, photos) et déménager son Piwigo ailleurs.

[...]

icon6

#17
En plus de ne pas prendre tout l'espace disponible par rapport à l'écran de l'utilisateur, comment faites-vous pour les écrans retina avec la première technique dans ce cas ? (sachant qu'une image de 800 px chargée à 800 px est floue)

Concernant votre seconde méthode, ce n'est pas la bonne technique, le javascript sert justement à ça ... si un utilisateur à un écran de 13 pouces (entre 800 et 900 de haut donc) alors cela lui charge une photo à peine plus grande que l'espace disponible mais surement pas la même photo que pour le 27 pouces.

Il y a aussi un moyen d'avoir un rendu quasi-identique sur tous les navigateurs sauf IE7.

IE 7 qui n'est plus utilisé : http://gs.statcounter.com/#browser_version-FR-monthly-201306-201307-bar

plegall

Bonjour icon6,

Citation de: icon6 le Juillet 12, 2013, 15:14:57
En plus de ne pas prendre tout l'espace disponible par rapport à l'écran de l'utilisateur, comment faites-vous pour les écrans retina avec la première technique dans ce cas ? (sachant qu'une image de 800 px chargée à 800 px est floue)
C'est vrai que c'est un poil pixelisé sur écran retina. Je viens de m'en rendre compte (autant sur les icônes non SVG, ça se voit très bien, autant sur les photos c'est moins évident). On va bosser dessus, en exploitant le window.devicePixelRatio.

Citation de: icon6 le Juillet 12, 2013, 15:14:57
Concernant votre seconde méthode, ce n'est pas la bonne technique, le javascript sert justement à ça ... si un utilisateur à un écran de 13 pouces (entre 800 et 900 de haut donc) alors cela lui charge une photo à peine plus grande que l'espace disponible mais surement pas la même photo que pour le 27 pouces.
Ca c'est une évolution prévue du plugin Automatic Size. Je décrivais juste le fonctionnement actuel du redimensionnement sur le thème Stripped :-)

Verso92

Citation de: erickb le Juillet 15, 2013, 14:04:24
essaye de faire une image de 1000 pixels de large  en 1 dpi et la meme image de 1000 pixels de large en 2400 dpi  et regarde le résultat

Celle à 2 400 dpi est 2 400 fois meilleure que celle à 1 dpi ?

(--> ;-)

Verso92


Avatar

Excusez ma naïveté, mais dans le logiciel que j'utilise pour réduire la taille de mes images (Light Image Resizer), à quoi sert alors l'option "résolution" qui est par défaut à 96 dpi (mais que l'on peut personnaliser ou décocher) ?
Merci.

nidob24

Réponse à Avatar : Généralement cela ne sert à rien sauf si doit porter une image chez l'imprimeur.
Vivre c'est avancer sans cesse

Avatar

Merci de ta réponse Nidob24.
Justement, je mets actuellement mes photos en 640x480 sur mon site pour éviter que quelqu'un qui ferait une copie ne puisse ensuite les imprimer. Mais je suis frustré parce que je trouve que c'est une taille trop petite pour bien apprécier une photo. Je serais tenté de les afficher désormais en 800x600. Est-ce à dire que si je veux continuer à "protéger mon travail" (je sais, c'est relatif à partir du moment où il est diffusé), il faut du 800x600 à 1 dpi plutôt que du 800x600 à 300dpi ? Cela empêcherait-il d'imprimer avec une qualité suffisante les photos qui auraient été sauvegardées par les visiteurs de mon site ?
Merci.

Verso92

Citation de: Avatar le Août 13, 2013, 10:49:57
Merci de ta réponse Nidob24.
Justement, je mets actuellement mes photos en 640x480 sur mon site pour éviter que quelqu'un qui ferait une copie ne puisse ensuite les imprimer. Mais je suis frustré parce que je trouve que c'est une taille trop petite pour bien apprécier une photo. Je serais tenté de les afficher désormais en 800x600. Est-ce à dire que si je veux continuer à "protéger mon travail" (je sais, c'est relatif à partir du moment où il est diffusé), il faut du 800x600 à 1 dpi plutôt que du 800x600 à 300dpi ? Cela empêcherait-il d'imprimer avec une qualité suffisante les photos qui auraient été sauvegardées par les visiteurs de mon site ?
Merci.

Tu n'as pas lu les messages précédents, ou bien ?
Rappel : la seule dimension d'une photo est la définition, exprimée en pixels. Soit 800 x 600 pixels, par exemple. Il n'y en a pas d'autres*...
*sauf la profondeur de couleur (3 x 8 bits ou 3 x 16 bits, par exemple).