BoyWiki:Agora/3 janvier 2013

Agora/3 janvier 2013

Recherche d'une présentation de galerie

Sur la page Albert Anker (galerie), j'ai fait trois tentatives de mise en page d'une galerie d'images. Chacune a ses défauts : manifestement la meilleure solution reste à trouver.

Je n'ai pas repris la même présentation que, par exemple, dans Claude Joseph Bail (galerie), où il y avait 28 images seulement (ce qui est déjà beaucoup). Celle d'Anker devrait atteindre ou même dépasser les 60 images : il faut donc de plus petites images, rangées par lignes de 3 ou 4, et non plus de 2 seulement.

Le premier essai (tableau) est le plus facile. Inconvénients :

• la largeur des images reste toujours à peu près la même, limitée par la taille des cellules
• en cas d'affichage haute définition, il y a de grands vides entre les images (pas esthétique)

Le deuxième essai (tableau + modèle Image relative) donne un tableau systématiquement trop large, même en haute définition.

Le troisième essai (modèle Image relative seul) est le plus souple, mais il est presque impossible de faire tenir trois images sur une même ligne : celle de droite est décalée vers le bas, sans doute gênée par celle du centre. Quant à en aligner 4, ça semble complètement impossible, puisque les seuls paramètres de position sont "gauche", "centre" et "droite".

Peut-être n'ai-je pas su mettre les bons paramètres...

N'a-t-on jamais trouvé un système pour aligner simplement des images les unes à la suite des autres, comme on met des mots dans un texte, en laissant le logiciel décider de l'endroit où il faut passer à la ligne suivante ?

Pour ce soir je laisse les choses telles quelles, ne sachant trop comment améliorer les choses. Pinocchio, si tu as des idées, n'hésite pas à faire de nouveaux essais, même si ça chamboule tout : cette page n'est qu'une ébauche très provisoire.

Caprineus 4 janvier 2013 à 00:12 (GMT)

J'ai retiré les tableaux qui troublaient la largeur de page et faisaient apparaitre des ascenseurs.

Mais si ! Nativement pour html, les images sont considérées comme du texte, par exemple :

Une image et une autre et encore une ...

Mais ce n'est plus aussi simple si on veut placer l'image dans un cadre de taille variable, y ajouter un titre, un commentaire, un lien vers l'image originale...

Le positionnement des flottants (c'est le cas de {{image relative}}) est parfois d'humeur primesautière quand ils sont nombreux ! Le {{clr}} n'est pas indispensable après chaque rangée, il permet d'arrêter l'effet flottant et de repartir sur une ligne horizontale : un seul est nécessaire, celui placé tout à la fin des images. On peut en insérer d'autres pour figer une organisation. L'option droite ou gauche doit être vue comme le sens d'empilement des images les unes après les autres, et non comme un ordre de répartition dans la page dès lors que les images sont placées cote à cote. En particulier l'option centre ne doit pas être utilisée dans ce cas. La première image à gauche va le long de la marge ; la seconde toujours à gauche vient se placer le long de la première, et ainsi de suite tant qu'il reste de la place sur la même rangée. Il peut être intéressant de ranger les images par ordre de hauteur, ainsi le rang suivant s'imbrique mieux sous le précédent. Pour casser l'effet empilement vertical il peut être utile de changer l'ordre gauche ou droite d'un rang à l'autre.

Reste le problème du poids et du temps de chargement de la page qui ne sont pas négligeables.

Pinocchio 4 janvier 2013 à 16:00 (GMT)

Bon, je comprends mieux, merci de ces explications. Il n'empêche que la logique informatique n'est pas toujours compatible avec la logique humaine — sans doute parce que nous sommes plus pragmatiques que des logiciels, c'est ce qui nous induit souvent en "erreur".

L'idée d'occuper au maximum l'espace de la page, comme des tableaux qui couvriraient entièrement un mur, est un choix intéressant, bien que peu courant en France (et inimaginable au Japon...). Je me rappelle avoir été frappé d'une telle disposition lors d'une lointaine visite en Italie — peut-être ont-ils tant d'oeuvres d'art là-bas qu'ils ne savent plus où les mettre !

Le poids est un problème aujourd'hui, mais ne le sera plus demain. Dire qu'il y a dix ans à peine j'étais tout content d'avoir du 56K ! Idem pour le temps, qui malgré tout n'est pas si long que ça : même à travers TOR les pages s'affichent assez vite. Et puis, rester parfois quelques secondes supplémentaires devant une oeuvre d'art, en attendant que la suivante se charge, ça apprend la patience, voire la contemplation...

Caprineus 4 janvier 2013 à 22:58 (GMT)

Bien sûr ce n'est qu'une façon de ranger qui a pour moi l'avantage de casser les alignements. Pour recréer des alignements horizontaux il suffit de remettre les {{clr}} entre chaque rang. Mais pour des alignements verticaux c'est plus difficile. Sinon il existe un outil souvent appelé visionneuse sur de nombreux sites, qui n'affiche qu'une image en grand à la fois et toutes les autres en miniatures que l'on peut faire défiler. L'inconvénient est qu'il nécessite du code pour fonctionner.

Pinocchio 5 janvier 2013 à 08:09 (GMT)

Il est sans doute bon de varier les modes de présentation, ça fait partie de l'animation d'un site. La disposition que tu suggères a en effet l'intérêt de rompre la monotonie des alignements.

Qu'entends-tu par « L'inconvénient est qu'il nécessite du code pour fonctionner » ? Risque de piratage du code et de modification par un malveillant ? (Certains prennent peur et évoquent cette possibilité dès qu'il y a du javascript ; mais n'étant pas spécialiste, je n'ai jamais su s'il s'agissait d'un vrai risque...)

Caprineus 5 janvier 2013 à 14:25 (GMT)

Le principal inconvénient est que les utilisateurs qui ont désactivé dans leur navigateur l'utilisation des scripts, ne voient rien. Si c'est acceptable, à mon avis, pour des options de présentation ou des gadgets, ça l'est moins pour des contenus. Pinocchio 6 janvier 2013 à 23:40 (GMT)

Une galerie sans script à tester :

• 
  
• 
  
• 
  
• 
  
• 
  
• 
  
• 
  
• 
  
• 
  
• 
  

Oui, cette galerie est intéressante et d'utilisation très intuitive. Reste à déterminer dans quels cas elle est préférable à d'autres sortes de présentation.

A mon goût, il serait peut-être plus esthétique de supprimer le fond gris (le mettre en blanc ou transparent ?).

Est-il possible d'insérer du texte pour chaque image ? (titre, auteur, date, lieu, etc.)

Une possibilité de présentation verticale serait bienvenue. Mais si ça ne peut pas se faire dans le modèle, on pourra toujours empiler des modèles comme ça :

{{Image galerie|ANKER Albert 1858 Der Pfeifenschnitzer 1184x1575.jpg}}
{{Image galerie|ANKER Albert 1861 Sonntagnachmittag (Detail) 612x522.jpg}}
{{Image galerie|ANKER Albert 1858 Der Pfeifenschnitzer 1184x1575.jpg}}

à condition d'avoir un paramètre permettant d'afficher l'image à droite de la miniature. J'imagine par exemple un tableau énumérant les œuvres avec leurs caractéristiques, un peu comme celui-ci.

Caprineus 8 janvier 2013 à 12:54 (GMT)

Je viens de tester la galerie dans une fenêtre étroite, qui donne une idée de ce que serait une suite d'une vingtaine d'œuvres. Là, pour le coup, ce n'est pas très intuitif, ni commode : les miniatures s'affichent sur deux lignes, et il faut aller chercher la deuxième en utilisant un ascenseur.

S'il n'est pas possible de faire défiler la galerie sur une seule ligne sans utiliser de script, il vaudrait sans doute mieux afficher d'emblée les deux lignes de miniatures, sans ascenseur donc.

Caprineus 8 janvier 2013 à 13:07 (GMT)