28173 sujets

CSS et mise en forme, CSS3

Bonjour,

Je fais parti de l'équipe de dev de www.laviefinanciere.com et si vous allez voir, j'ai un soucis ésthétique avec les news de la home : le justify du texte !

Comme j'écris le titre de la news sur le côté droit de la photo, j'ai des espaces énormes sur une ligne et c'est vraiment moche.

Alors j'ai recherché pas mal de choses ou de techniques et je vous avoue que la pêche a été très mince, du côté de jquery, pas plus de solutions... et même techniquement, je me demande si c'est possible...

Donc voilà, si vous avez une idée pour me dépanner ce serait vraiment énorme Smiley biggrin

Ciao.
Modifié par guiltouf (11 Jan 2008 - 10:50)
Bonjour

Il fait mal aux yeux ton sapin de noël Smiley cligne
Plus sérieusement y'a pas moyen actuellement de solutionner le problème d'espaces en justify, et c'est tant mieux.
Ah oui cette pub !! Faut bien vivre...

Donc aucune solution alors ? Je vais sans doute le passer en align:left mais pourquoi tu trouves ça mieux ces gros espaces immenses ? Moi ça me sort des gros boutons en tout cas.

Bon merci pour ta réponse et si un jour je trouve une piste (car je vais pas m'arrêter là Smiley cligne ) je vous informe.

Ciao.
Bonjour,

guiltouf a écrit :
Donc aucune solution alors ?

Pas à ma connaissance. Et la gestion intelligente des césures (car il s'agit de réaliser automatiquement des césures et pas n'importe où dans les mots) est suffisamment complexe pour qu'aucun script JS ne la tente. Il faut par exemple avoir recours à un gros dictionnaire de césures, ou à des algorithmes, ou aux deux à la fois.

Sans gestion native par les navigateurs, je ne vois pas trop...

guiltouf a écrit :
Je vais sans doute le passer en align:left

Je le ferais à la fois pour #headnews .panel_33 p et pour .fJustify. Il n'y a que le bloc de la première news à la une qui soit assez large pour que la justification du texte puisse marcher à peu près correctement.

guiltouf a écrit :
mais pourquoi tu trouves ça mieux ces gros espaces immenses ?

Je crois qu'il trouve mieux de se passer de la justification et de se contenter de l'alignement à gauche. Smiley cligne
"Intégré en natif" : ce serait génial, mais pas de sitot Smiley cligne

Alors, en fait j'ai une autre idée, je vais permettre dans l'admin à ce qu'ils puissent redimensionner l'image de l'interview en live. Comme ça, à l'oeil, ils pourront ajuster au mieux le justify.
=> Plan Mac Gyver Smiley biggrin

Merci pour vos réponses,
@+
Ben à mon avis l'idéal serait qu'on en finisse avec justify, déjà parce qu'à force de vouloir ressembler à un média papier on va finir par penser qu'on est sur un média papier (maquettage presse), ensuite parce que les "escaliers" générés par les blancs en fin de ligne en fer à gauche offrent une excellente assistance au regard, et perso un texte justifié me fait souvent perdre la ligne, ce qui n'arrive pas - ou beaucoup moins souvent - avec un align-left. Disons que ça procède, comme la taille, le style, la fonte ou l'interlignage des textes, d'une démarche de gain de lisibilité et de confort accru. A pavé de texte égal je trouve qu'il y a plus de confort à le lire aligné à gauche que justifié ou centré. Donc tant que ces blancs disgracieux entre les mots font que les webdesigners fuient justify je ne peux que me réjouir Smiley smile
J'aime bien ton explication Arsene, c'est interessant et vrai comme point de vue.
L'avantage pour le justify reste la "beauté à l'écran" : on a cadre de texte carré et c'est quoi qu'on en dise plus joli.
J'ai bien aimé aussi ta petite remarque sur le maquettage presse Smiley cligne . On est un groupe de presse, ça doit venir de là Smiley biggrin

En tout cas merci pour vos avis et conseils, c'est trés constructif.
@+
guiltouf a écrit :
=> Plan Mac Gyver Smiley biggrin

Sauf que Mac Gyver même lorsqu'il fabrique un missile sol-air avec un briquet à moitié vide et du bambou tressé ses solutions sont plus robustes que ça. Smiley cligne

Au final, tu n'éviteras que les plus disgracieux des trous dans le texte, et encore uniquement pour les utilisateurs qui ont la bonne taille de texte, la bonne fonte, le bon moteur de rendu des fontes (et donc le bon système), etc.

Pour le débat sur le justify:
- effectivement, on gagne sans doute un peu en lisibilité grâce au repère visuel des lignes en drapeau à droite avec un texte aligné à gauche... mais ça n'est pas si flagrant que ça (je veux bien voir le test utilisateur qui démontrerait que ça représente un gain flagrant, ou même simplement sensible);
- l'argument du «le Web n'est pas le print» est une tartufferie si on ne l'étoffe pas un peu... ici, sans démonstration claire, je ne le retiens donc pas;
- d'accord avec guiltouf pour dire que le texte justifié peut être intéressant graphiquement.

Ma conclusion personnelle: il serait globalement plus intéressant de pouvoir utiliser le texte justifié de manière correcte, y compris sur des colonnes fines (avec césure intelligente). Il n'y a aucune raison de privilégier le texte justifié (alors qu'effectivement pour l'imprimé, pour certains formats spécifiques, il peut y en avoir), mais avoir à disposition une possibilité de ce type serait pas mal.
Il me semble que CSS3 inclus quelque chose de ce genre, ou au moins la capacité de définir le nombre d'espace max utilisé (pas plus de 3 blancs par exemple.
=> Attendre 2012 pour que tout le monde puisse en profiter et encore on aura encore des IE5 qui surferont Smiley langue

Pour la césure, ce n'est pas impossible si le texte est pas généré en live, mais il manquerait encore un paramètre de largeur utilisé par le texte dans la ligne pour ajuster la césure... Un vrai casse-tête pour faire ça en auto et utiliser jQuery en scripté...

Va falloir se résigner Smiley bawling