BoyWiki:Agora/9 décembre 2010

Agora/9 décembre 2010

Mise au point de l'image du jour

Les trois marmitons de Bail sont bien mal élevés ! Chez moi (affichage 1024x768, avec panneau latéral), ils débordent largement sur la citation du jour, dont ils cachent un bon tiers.

Par ailleurs, j'ai fait quelques modifications sur la page d'accueil : d'une part, un petit texte humoristique pour la bannière ; d'autre part, et surtout, une refonte des deux textes sur BoyWiki – en laissant apparente l'explication générale, et en mettant dans la boîte déroulante tout ce qui a trait à l'inscription et à la participation (y compris ce qui était auparavant en italique et en tête de page). Ce n'est qu'un essai – tous les avis sont bienvenus.

A propos des conditions d'inscription, il serait sans doute souhaitable de réécrire la page Scribe, qui ne correspond pas à la réalité actuelle.

Désolé d'écrire tout ça sous le seul titre Mise au point de l'image du jour ; mais j'ai actuellement de sérieuses difficultés de connexion, qui obligent à tout regrouper pour avoir plus de chances que ça passe.

Caprineus 9 décembre 2010 à 16:06 (GMT)

Normalement ils ne devraient plus déborder. Il faudra vérifier les effets possibles sur les images en portrait. Il faut dire aussi, je pensais que les derniers écrans 1024x768 avaient disparu il y a plusieurs années ! Tu devrais en parler au Père Noël... Pinocchio 9 décembre 2010 à 22:21 (GMT)

Détrompe-toi ! A mon domicile principal, j'utilise deux ordinateurs : un récent, avec un bel écran 1920x1080, et une antiquité, néanmoins fort utile, que j'ai réglée en 800x600 ! Mais dans la "résidence secondaire" où je suis actuellement, un vieux 1024x768 fait très bien l'affaire. Ça permet de tester que BoyWiki est lisible par les internautes du monde entier – car dans de nombreux pays l'utilisateur moyen est très loin de bénéficier des derniers progrès en informatique.

Justement, lorsque je retrouverai le grand écran en HD, j'ai bien peur que les "images du jour" m'apparaissent minuscules ! C'est vraiment dommage qu'on ne puisse pas adapter ces aperçus à la place disponible, en fonction de l'affichage choisi.

Caprineus 9 décembre 2010 à 23:17 (GMT)

Le problème est le même pour toutes les pages articles, les images ont des tailles fixées : c'est une limite inhérente au choix du format de publication (le wiki). On peut contourner certaines limitations mais si on veut tout changer il est plus efficace de changer de support ! Ceci dit, je propose en test le modèle {{Image relative}} destiné (s'il fonctionne…) à contourner une partie de la limite et rendre proportionnelles les images dans les articles. C'est aussi une ébauche pour tenter de mieux appréhender le problème (plus complexe) des images du jour.

Pinocchio 13 décembre 2010 à 22:24 (GMT)

Pour permettre de visualiser l'affichage du modèle {{Image relative}} (qui paraît être une excellente initiative), je l'ai mis en double de l'affichage normal pour certaines images de Claude Joseph Bail : la 2ème (Le marmiton et son chat), ainsi que les 4 premières de la section Œuvres.

Lettre de son père et Marmiton fumant une cigarette montrent que ce modèle permet de bien mieux gérer l'espace de la page pour un affichage optimal. Mais apparemment ça ne fonctionne pas à l'intérieur d'un tableau. Dommage !

Les 2 suivants posent un problème que je n'ai pas réussi à résoudre : La cigarette, au lieu de se positionner à gauche et sur la même ligne que Le petit marmiton, s'obstine à rester collée à droite, sous Marmiton fumant une cigarette. Ça c'est de l'amour ! Mais enfin, on ne peut pas laisser faire ça...

Par ailleurs, je présume que la largeur d'affichage maximale est limitée, dans tous les cas, à celle de l'image d'origine (une image 600×400, même en 50 % sur un écran 1920×1080, s'affichera en 600 pixels de large, et non en 960). Présumé-je bien ? Si c'est le cas, il serait plus simple, dans un tel cas, de ne pas avoir à renseigner ce paramètre.

On remarque que, dans ce modèle, le commentaire est systématiquement centré. À mon sens, il faudrait au moins laisser le choix : un texte continu sur plusieurs lignes, par exemple, se prêterait mal à cette présentation.

Caprineus 14 décembre 2010 à 01:50 (GMT)

Les positionnements gauche et droite sont flottants, c'est à dire qu'ils permettent l'affichage de texte ou autre dans l'espace libre à côté, tant qu'il reste de la place ; pour annuler cette disposition et repartir sur un espace neuf en dessous de l'image la plus basse il suffit d'utiliser le modèle {{Clr}}, qui a pour effet de créer une nouvelle ligne depuis la marge. De ce fait les tableaux sont inutiles.

Tu présumes bien, le grossissement des images n'est pas prévu : c'est très moche, les pixels manquants étant extrapolés à partir de leurs voisins. Je ne pense pas qu'il est possible d'omettre un paramètre parce qu'ils ne sont pas nommés, c'est sa position qui détermine le rôle de chacun d'eux, sinon il faut écrire param=valeur. Mais il suffit dans ce cas d'indiquer une valeur maximale au hasard, 2000px ou plus.

Je vais ajouter un paramètre optionnel dans le modèle pour l'alignement du texte descriptif.

Pinocchio 14 décembre 2010 à 11:57 (GMT)

(conflit d'édition) Le problème subsiste si, pour une raison ou pour une autre, on diminue la taille de la fenêtre à une largeur inférieure à ces fatidiques 1024 pixels. Idéalement, la solution serait que la taille de l'image se réduise de concert avec la diminution de la taille du cadre réservé à l'image du jour. Par exemple actuellement, la taille de l'image est de 420 pixels. Si le cadre de l'image du jour est plus large que 420 pixels, ne rien changer (afficher l'image avec une largeur de 420 pixels) ; si le cadre de l'image du jour fait moins de 420 pixels, disons 380 pixels, afficher l'image avec une largeur de 380 pixels. Pour ton commentaire sur la disparition des écrans 1024x768, n'oublie pas les nouveaux usages : des gens consultent les sites sur des téléphones portables, sur des tablettes... Lascar 9 décembre 2010 à 23:21 (GMT)

Wikipedia a prévu en effet un accès réservé à la résolution des écrans de téléphones portables [1]. Et tu sais comment a été résolu le problème des images ? Elles ont simplement été supprimées de même que les menus ! Ils ont l'art pour résoudre simplement les problèmes chez Wikipedia !

Pinocchio 13 décembre 2010 à 22:24 (GMT)

Je regrette, si sur mon téléphone je tente d'accéder à http://fr.wikipedia.org, je suis redirigé sur la page http://fr.m.wikipedia.org (qui certes représente une version simplifiée de la page d'accueil, mais affiche quand-même deux images). Si, sur ce site mobile je cherche un article particulier, les images de l'article sont bel et bien affichés. Les différentes sections de l'article sont affichés également. De surcroit, par un lien, je peux demander l'affichage normal du site. Et les images s'affichent comme il faut. Par contre concernant Boywiki (même accédé en http), il y a un autre problème : Les images sont situés sur un serveur httpS (media.boywiki.org) dont le certificat n'est pas valide. Pour que les images s'affichent, il faut explicitement demander l'affichage d'une image et cliquer sur "continuer" lorsque s'affiche un message indiquant que le navigateur ne peut pas vérifier l'identité de media.boywiki.org. Il faudrait sans doute soit modifier ce comportement (à quoi sert l'accès à media.boywiki.org en httpS ?), soit placer une note explicative (non masquée) pour les utilisateurs qui voient s'afficher des zones vides à la place des images.

Lascar 14 décembre 2010 à 19:24 (GMT)

En effet, je ne connaissais pas cette adresse de meilleure qualité. Mais il n'empêche, l'accès aux portables fait l'objet d'un cas particulier, un accès réservé, ce qui signifie qu'il y a bien une configuration minimale supportée pour accéder au site normal, même si certains mobiles peuvent quand même y accéder. Puisque c'était là le sujet de la discussion, il me semble raisonnable de se fixer une limite en taille d'écran minimale sans quoi il devient difficile de faire quoi que ce soit. Ceci dit, si on peut sans trop de difficulté satisfaire tout le monde, pourquoi pas, mais il faudrait pour cela avoir des remontées de bugs. Pour ma part je n'ai pas de téléphone portable, tablette ou autre mobile qui me permettrait de faire les tests, de même que je ne passe pas des jours entiers à tester tout les navigateurs dans toutes leurs versions courantes à chaque modification. Je pense que c'est un travail collaboratif qui serait plus facile (et utile) à faire si on étaient plus nombreux.

Les problèmes de chargement des images en https, oui, le problème a été constaté en particulier sur IE. J'ai essayé quand c'était possible de favoriser l'accès en http au moins pour les icônes qui ne posent aucun problème. Maintenant concernant les autres images je ne sais pas si un accès sécurisé est nécessaire pour l'utilisateur, il faudrait en discuter. Le fait est que le wiki propose des liens images en https et qu'on n'a pas les moyens de le lui interdire. Mais on pourrait probablement substituer les adresses dans le navigateur. Merci de remonter le problème.

Pinocchio 14 décembre 2010 à 20:48 (GMT)

Il semble que les suggestions de Lascar aient été prises en compte, puisque maintenant l'image du jour s'adapte quand on fait varier la taille du cadre (en modifiant la largeur du bandeau latéral). C'est beaucoup mieux, en effet.

Avec cette amélioration, on peut se demander s'il est toujours opportun de redimensionner l'image avant de l'envoyer vers la page d'accueil. Pourquoi ne pas utiliser simplement l'image d'origine, dans sa définition maximum, puisqu'elle s'adaptera d'elle-même à la largeur disponible en fonction de l'écran ?

Plus encore : on pourrait lui faire de la place en gérant mieux le partage entre image et citation. Par exemple, définir que le cadre de la citation occupe en principe 50 % de la largeur disponible, mais jamais plus de 400 pixels (à affiner). Il resterait donc pour le cadre de l'image, soit 50 % (petits écrans), soit 100 % – 400 pixels (grands écrans).

Pour la hauteur du cadre de l'image, je serais d'avis de lui donner un peu de marge en la définissant selon le rapport : largeur × 1,618 (soit N = nombre d'or, proportion reconnue comme particulièrement harmonieuse). Le titre Image du jour et le commentaire occupant une partie de cet espace, il resterait de quoi afficher aisément les images verticales.

(A propos du commentaire : je veux bien en rédiger d'autres, mais comment les insérer dans le modèle {{Mainpix|fr|huile}} ?)

Pour la hauteur du cadre de la citation, elle serait égale à celle du cadre de l'image, puisqu'apparemment une différence serait inesthétique. Reste à trouver une idée pour meubler le bas du cadre quand la citation est courte... (Une vignette genre angelot ou diablotin, ça serait possible ? Je dois avoir ça dans mes archives...)

Caprineus 10 décembre 2010 à 22:11 (GMT)

Ben non ! Ça ne marche pas si bien que je croyais. L'affichage "adaptatif" que je décrivais ci-dessus, c'était avec le marmiton alcoolisé – format horizontal. Voici maintenant en vertical Un cuisinier et son chien carlin (Dieu ! qu'il est moche !) (pas le cuisinier, le carlin), et là ça ne va plus du tout.

Non seulement l'image ne s'adapte pas à la largeur du cadre, mais quand celui-ci est trop étroit elle déborde sur le cadre de la citation (comme Les trois marmitons d'hier) ; et même quand le cadre est plus large (ma non troppo), le texte passe sous l'image, et il sort à la fois du cadre de l'image et de celui de la page. (Il y a un stade intermédiaire dans lequel le mot « Un » est sur le côté droit de l'image, tandis que tout le reste du texte est au-dessous !)

Apparemment, il faudrait réserver un espace au bas du cadre pour le commentaire, sinon l'image prend toute la place et le texte ne peut que s'afficher hors du cadre quand il n'a pas assez de place sur le côté.

Autre solution (que j'imagine – je ne dis pas que c'est faisable !) :
1°) le système détermine la largeur totale Lt disponible en fonction de l'affichage ;
2°) il en attribue 50 % à la largeur Lc du cadre de citation, ou seulement 400 pixels si Lt > 800 ;
3°) il attribue le reste Li = Lt – Lc à la largeur du cadre d'image ;
4°) l'image s'adapte et prend toute la largeur Li ;
5°) l'image a alors une hauteur Hi, à laquelle il faut ajouter la hauteur du titre et celle du commentaire pour obtenir la hauteur totale Ht. Le cadre d'image prend donc les dimensions Li × Ht, et le cadre de citation Lc × Ht (le logiciel en profite pour déterminer si ça vaut alors la peine d'afficher une jolie vignette sous la citation).

Ça paraît compliqué à première vue, mais tout s'enchaîne logiquement. La question est de savoir si on peut lier ainsi les dimensions des deux cadres et de l'image.

Caprineus 11 décembre 2010 à 01:40 (GMT)

Utiliser les images dans leur taille d'origine (sans les réduire) fonctionne mais occasionne des transferts de fichiers plus gros (quand on augmente de 40% une dimension on double la taille du transfert) ce qui encombre inutilement le réseau et provoque des lenteurs d'affichage du navigateur qui a plus de travail.

Les commentaires dans Mainpix : il faudrait distinguer ceux qu'on veut voir apparaitre seulement dans le commentaire de la page image, ceux qu'on veut voir seulement sous l'image dans l'article. Si cette distinction est nécessaire. Les modifications ne seront pas pratiques à effectuer, les commentaires et le modèle étant situés sur médiawiki...

Pour le reste, ce n'est pas si simple : le principal problème provient de l'inefficacité à gérer une hauteur proportionnelle ou relative pour le cadre, il semblerait que la page n'ait pas de hauteur prévisible et donc préciser une valeur relative à une inconnue ne fonctionne pas. Mais la hauteur n'est peut-être pas vraiment un problème : entre un écran 1024x768 et un HD1080 il n'y a que 30% de différence.

Pinocchio 13 décembre 2010 à 22:24 (GMT)

Pour les commentaires des images, il faut distinguer deux choses :

• Sur la page de l'image, hors modèle Mainpix, doit figurer la description "catalographique" standardisée de l'œuvre : titre, auteur, lieu, date, technique, dimensions, etc.
• Le commentaire particulier à l'affichage sur la page d'accueil (mais qui pourrait aussi être repris à d'autres endroits) est distinct de cette description, et n'a rien de standardisé ; c'est lui qui devrait figurer dans le modèle Mainpix.

Si chaque wiki doit éventuellement insérer dans la page d'image son modèle distinct (par exemple {{Mainpix | fr | huile}}{{Mainpix | en | oil}}), le champ peut simplement être commentaire=. En revanche, s'il y a un seul modèle Mainpix par page d'image (par exemple {{Mainpix | en fr | huile}}), il faudrait préciser commentaire-fr= (et laisser les anglophones insérer un comment-en=).

Pour la hauteur de l'image du jour : ne peut-on pas résoudre le problème en supprimant le cadre et en affichant simplement l'image, comme dans le cours d'un article ? Ce serait une utilisation judicieuse du modèle {{Image relative}}...

Caprineus 14 décembre 2010 à 02:21 (GMT)

Prenons un exemple concret :

« Mirth » / Henry Oliver Walker ; detail of Lyric Poetry. – Washington : 1896. – Mural. – (Washington, D. C., United States : Library of Congress Thomas Jefferson Building ; Great Hall, South Corridor).

Allégorie de l’Allégresse, détail au coin gauche de la peinture murale Lyric Poetry (signée « Copyright 1896 H.O. Walker »).

(Importé depuis le site de la Bibliothèque du Congrès http://lcweb2.loc.gov, puis recadré par l’utilisateur)

La première ligne est à conserver pour le commentaire de la page d'accueil. Elle est assez facile à isoler, c'est la seule qui figure actuellement en page d'accueil. La troisième ligne concerne les droits, elle a sa place sur la page de l'image. Mais la seconde ? Comment savoir si elle doit être écartée ou pas, sur quels critères? Et il peut y avoir plus de trois lignes. Ceci en plus des commentaires particuliers de l'image du jour.

Une image dans un article peut être ajustée au mieux, c'est toujours la même image ; dans le cas de l'image du jour on est confronté à des dimensions et des définitions disparates et qui doivent s'afficher dans un même espace assez défini, d'où la difficulté. Une image en mode paysage va se caler sur la largeur disponible, facile, mais pour un portrait...

Pinocchio 14 décembre 2010 à 18:40 (GMT)

1. Textes accompagnant les images

En principe, le texte des pages d'image est destiné à être lu uniquement sur lesdites pages (qui sont facilement accessibles). Lorsqu'on insère une image dans un article, il faut rédiger un texte particulier à cet article. La même image peut donc être utilisée dans deux articles (ou plus), avec chaque fois un commentaire différent.

Par exemple, un tableau représentant un petit marmiton sur la page de Claude Joseph Bail sera accompagné d'un descriptif plutôt technique : titre, année, technique de peinture, dimensions, lieu de conservation. Le même tableau inséré dans un article sur le travail des garçons au XIXème siècle aura un texte différent : auteur, titre, année, et un bref commentaire attirant l'attention sur le travail et ses conditions, l'âge du garçon, etc.

Le cas de l'image du jour est tout autre, puisque les images changent sans cesse. De plus, elles sont hors contexte (le commentaire doit donc être plus explicatif), et elles ont pour objectif d'allécher le lecteur en lui proposant des liens. C'est pour ça que le modèle Mainpix devrait contenir un commentaire spécialement écrit dans ce but.

Je propose donc de créer dans Mainpix les champs commentaire= / comment= / Kommentieren= (l'intitulé du champ indiquant automatiquement sur quel wiki le texte doit s'afficher). Et c'est uniquement dans le cas où le champ serait vide, l'image étant quand même sélectionnée pour la page d'accueil, qu'on afficherait à la place le commentaire-descriptif de la page d'image ; mais ce ne serait qu'un pis-aller, dans l'attente de la rédaction d'un texte spécifique.

2. Alignement inférieur de l'image et de la citation du jour

Une piste (sans garantie aucune !) concernant l'affichage de l'image et de la citation : puisque le problème est de les aligner au même niveau inférieur, ne pourrait-on pas déterminer cette limite inférieure, et que le cadre de la citation vienne se caler sur elle ? C'est-à-dire qu'en cas d'inégalité de hauteur entre l'image et la citation, il n'y aurait pas d'espace libre sous la citation, mais au-dessus.

La limite inférieure serait déterminée par la hauteur de l'ensemble : titre Image du jour + image + commentaire (l'image ayant pris en hauteur toute la place nécessaire, en fonction de son format et de la largeur qu'on lui a attribuée). Apparemment, ce fonctionnement serait plus facile si l'image est insérée dans le modèle {{Image relative}}, sans cadre.

L'espace vide au-dessus de la citation serait-il moins inesthétique qu'en-dessous ? Pourrait-il être rempli par une vignette, ou une plage colorée, ou par autre chose ? Seuls quelques essais pourront nous permettre d'en juger...

Caprineus 15 décembre 2010 à 01:51 (GMT)

Dernière mouture de l'image et de la citation du jour

Ah oui, c'est un gros progrès ! Finalement, même avec une image en portrait et un écran HD, le cadre de la citation devrait rester acceptable, même s'il est en partie vide. Quid de l'idée d'une vignette pour occuper cet espace vide ?

Petit problème purement esthétique : la séparation entre les deux cadres n'est pas très jolie. Peut-être serait-ce mieux en la réduisant à une seule ligne au lieu de deux ; ou encore, en la supprimant carrément (les deux titres suffisent pour montrer ce dont il s'agit – dans ce cas, voir s'il ne serait pas préférable de justifier le titre Citation du jour à droite plutôt qu'à gauche).

Heu, l'image du jour Les bulles de savon, c'est encore un rouquin, non ?! Du coup, c'est sûr que Benoît XVI va nous envoyer sa bénédiction, en faisant lui aussi une bulle en annexe à sa lettre pastorale sur les petits Irlandais...

Caprineus 16 décembre 2010 à 01:36 (GMT)

Un champ commentaire a été ajouté dans le modèle Mainpix qui remplace, si j'ai bien compris, la description par défaut, seulement s'il existe et uniquement pour le cas de l'image du jour. Comme tout les champs sont requis il n'est pas nécessaire de lui donner un nom, il suffit de respecter l'ordre : langue, type, commentaire. Pour simplifier j'ai retiré le second type optionnel qui ne sert pas actuellement. Y'a plus qu'à créer les commentaires...

Les images du jour ont été agrandies. J'ai voulu remettre celle d'aujourd'hui mais je me suis trompé de bulles, il y a deux tableaux qui portent le titre bulles de savon. La hauteur maximale est fixée mais en unité quelque peu relative ! Je m'explique : quand on change de définition d'écran il est souvent nécessaire de modifier la taille de la police par défaut du navigateur, sans quoi, sur un grand écran, les caractères sont tout petits. La hauteur de l'image du jour devrait être proportionnelle à la taille de la police de base. À tester (je n'ai qu'une taille d'écran).

D'accord pour la vignette de remplissage pour les citations courtes, le problème étant de ne pas savoir à l'avance la quantité d'espace à occuper. Prévoir une vignette pas trop grande et surtout pas trop large.

Pinocchio 16 décembre 2010 à 12:47 (GMT)