Formulaire - Mise en forme

[Laegalad]

Ou peut-être, mettre prévisualiser avec un fond de la même couleur que poster, mais le mettre tout à gauche, alors que poster serait tout à droite ? <br>Bien séparés, et bien visibles sur le fond global des entrelacs...<p><small>Sylvie : j'ai pris le pli d'imaginer tous les comportements possibles d'essayer, du moins... les comportements humains, ça va, les comportements des navigateurs, c'est plus dûr </small>

[ISENGAR]

Intéressant...<br>Je vais pouvoir me remettre à mes <b>pamphlets </b>anti-jaxoniens <font color=red>lourdement HTMLisés</font>. La mise en forme prenait <i>tellement </i>de temps... <p>Bien entendu, je <u>plaisante </u>;p<p>I.

[ISENGAR]

<DIV class="citeAuteur"><B>moi-même</B> a dit :<DIV class="citeTexte">Intéressant...<br>Je vais pouvoir me remettre à mes pamphlets anti-jaxoniens lourdement HTMLisés. La mise en forme prenait tellement de temps... <br>Bien entendu, je plaisante ;p</DIV><p>Je vérifie juste si ça marche...<br>

[Laegalad]

Continuons le pinaillage : <br>pour les couleurs, le gris est assez souvent utilisé dans les messages -- notament pas Yyr l'Etoilé, mais pas que . Il permet d'estomper une partie du message si elle n'est pas dans le sujet (en plus du small), et d'accrocher plus vite ce qui est important si l'on est pressé. Est-il pertinant/possible de l'insérer dans la liste déroulante ? <br>Peut-être pas le <font color="#cccccc">gris #cccccc</font>, un peu trop clair, mais le <font color="#808080">gris #808080</font> ?<p>Sympa, la nouvelle présentation de la barre du haut, on perd moins de place

[Melilot]

Yope! C'est <i>pratique</i>. On va pouvoir <font color=red>s'</font><font color=green>am</font><font color=darkred>us</font><font color=blue>er</font> sans <b>s'user</b>. :-)<p><font color=blue><b>Merci Cédric</b></font>. :-)<p><font color=green><i>Merci pour le p'tit truc, Sylvie</i></font>. :-)<p><SMALL><SMALL>Isengar : attends, qui va oser dire "<font color=green>dommage</font>", et qui va oser dire "<font color=red>tant mieux</font>"; </SMALL></SMALL>:-D :-D :-D

[Cédric]

J'ai repris le formulaire pour poster un message pour lui ajouter les fonctions de mise en forme, telles que l'on en avait parlé il y a un temps certain...<p>Pour l'instant, ce n'est pas achevé, mais pour vous montrer que ça avance, vous voyez ci-dessus les différents nouveaux boutons disponibles pour vous aider à la mise en forme.<br>Pour l'instant, ils ne sont visibles que dans la section "Webmaster", où les tests non concluants ne causeront pas de dommages à des fuseaux intéressants.<p><br>Cédric.

[Cédric]

.

[Cédric]

<DIV class="citeAuteur"><B>Cedric</B> a dit :<DIV class="citeTexte">voyez ci-dessus les différents nouveaux boutons disponibles pour vous aider à la mise en forme.<br></DIV></DIV><br>A condition bien sûr de faire "Répondre" pour afficher le formulaire, évidemment.<p><br>Cédric.

[Cédric]

Quelques retouches :<br>- J'ai réorganisé et changé les intitulés des boutons.<br>- Insérer la couleur <font color=#808080>grise</font>.<br>- Rendu les liens externes.<p>Cédric.

[Dior]

<font color=blue>Génial !!! Merci Cédric !!!</font>

[Hyarion]

<b>Test</b> <i>général</i> : <font color=green>en</font> <font color=darkred>espérant</font> <font color=red>ne plus avoir</font> <font color=blue>à recopier</font> <font color=darkblue>les formules</font> du fameux fuseau <A HREF="http://" target="_blank"><A HREF="http://www.jrrvf.com/forum/noncgi/Forum6/HTML/000039.html" target="_blank">"Un peu d'HTML"</A>... ;-)<p><b>Blabla... </b>(en gras)<br><i>Blabla... </i>(en italique)<br><u>Blabla... </u>(en souligné)<br><SMALL><SMALL>Blabla... </SMALL></SMALL>(en petit)<p><DIV class="citeAuteur"><B>Le locataire de l'Elysée</B> a dit :<DIV class="citeTexte">Blabla<DIV class="citeAuteur"><B>Le locataire de la place Beauvau</B> a répondu :<DIV class="citeTexte">Blabla toi-même...</div></div></div></div>(citation)<p><br><div class="refTexte">Blabla<div class="refTitre">de chez Blabla</div></div><div class="refTexte">Blabla<div class="refTitre">de chez Blabla</div></div>(référence)<p><br><div class=gauche>Blablabla</div><div class=droite>signifiant Blabla</div><div class=vide></div>Blabla<div class=gauche>Blablabla</div><div class=droite> signifiant Blabla</div><div class=vide></div> (traduction)<p><br><A HREF="http://" target="_blank"><A HREF="http://www.logitheque.com/fiche.asp?I=15253" target="_blank">Blabla...</A>(lien)<p><font color=darkred>Blabla... </font>(bordeaux)<p><u><b><i>Alors ?</i></b></u>

[Hyarion]

Une vraie <font color=red>révolution</font> dans <font color=darkblue>l'histoire</font> du forum de <font color=green>JRRVF</font>. Très bonne idée d'avoir mis les liens en externe... Vivement une application à tout le forum ! Que de temps gagné ! <b>Merci beaucoup</b>, cher webmestre... :-)<p>Cordialement, :-)<p>Hyarion.

[Cédric]

Bien, malgré quelques défauts et ajustements encore à apporter, je crois que les tests sont concluants.<p>La mise en forme est disponible sur l'ensemble des sections du forum.<p><br>Cédric.

[Gurth]

<div class="refTexte">Et maintenant, on veut des avatars :-p<div class="refTitre">Le Whining pour les Nuls vol. II</div></div> <p><div class=gauche><font color=blue>On veut des avatars!</font></div><div class=droite><font color=darkblue>Non je rigole </font></div><div class=vide></div><p><br><DIV class="citeAuteur"><B>Saint Emilion</B> a dit :<DIV class="citeTexte">Il n'est point d'éloge flatteur sans un peu d'humour...</div></div><p><b>Ben </b>c'est bien <i><font color=green>chouette </font></i>tout ça, je vais veiller à ce que <font color=darkred><SMALL>Rebeca </SMALL></font>l'utilise <u>abondamment </u>:-D<p>G.

[rebeca]

<SMALL>Trop cool, je sens qu'y en a qui vont se lacher ^^<p><font color=darkred>Merci Cédric )</font><p>... et juste pour le plaisir du principe je vais continuer à utilser mon <font color=purple>mauve</font> préféré </SMALL>

[Sylvae]

Essai de <b>gras</b>, <i>italique</i>, <u>souligné</u><p><DIV class="citeAuteur"><B>(moi !)</B> a dit :<DIV class="citeTexte">essai de citation</div></div><p>essai de <font color=red>rouge</font>, <font color=green>vert</font>, <font color=blue>bleu</font>, <font color=darkred>rouge</font> encore et à nouveau <font color=darkblue>bleu</font><p><SMALL>Petit</SMALL> <p><font color=red><u><i><b><big>Merci-merci-merci pour les nuls en HTML !</big></b></i></u></font><p>Rien que ça m'incitera à poster un peu plus <SMALL>(enfin... Je pense...</SMALL> ;o)<SMALL></small>

[Laegalad]

Yeeeppeee <p>Allez, je fais quelques tests avec FF1.5.0.4... (pas trop le temps de faire sur autres navigateurs, peut-être à midi)<p><br><div class=gauche>Silver flow the streams from Celos to Erui<br>In the green fields of Lebennin!<br>Tall grow the grass there. In the wind from the Sea<br>The white lilies sway<br>And the golden bells are shaken of mellos and alfirin<br>In the green fields of Lebennin,<br>In the wind from the Sea!</div><div class=droite>D'argent coulent les flots du Celos et de l'Erui<br>Dans les prés verts du Lebennin !<br>Haute y pousse l'herbe. Au vent de l'Océan gris<br>Les lis blancs se balancent<br>Et dansent les clochettes d'or du mellos et de l'alfirin<br>Dans les prés verts du Lebennin,<br>Au vent de l'Océan gris !</div><div class=vide></div><p><DIV class="citeAuteur"><B>Sylvae-des-bois</B> a dit :<DIV class="citeTexte">Merci-merci-merci pour les nuls en HTML !</div></div><br>Et pour ceux qui ne sont pas fichus de retenir par coeur les codes <p><div class="refTexte">Dans le Vaste Monde, [les Elfes Silvan] traînaient dans le crépuscule de notre Soleil et de notre Lune, mais ce qu'ils préféraient, c'était les étoiles. [...] Leurs arbres favoris étaient les hêtres.<div class="refTitre">Bilbo le Hobbit</div></div> <p><br>Voyons donc... (prévisualise) :<br><b>génial</b><p><br>(comportement un peu déroutant des boutons "g", "i" et "u" : ils font remonter en haut du message. Et il faut recliquer dessus pour refermer la balise. Bon, il suffit de comprendre que quand il y a une petite étoile sur le bouton, il faut recliquer )<br>Mm, tiens, autre test, je clique sur "i", j'enlève le "i", l'étoile est toujours là. Logique, la page n'est pas rafraîchie... Mm, oui, il faut rafraîchir pour voir s'il reste encore des étoiles quelque part... le texte ne disparaît pas, c'est déjà ça <p>Par contre, le fait de surligner de la souris un passage et cliquer sur "g", pour que ça mette automatiquement les balises au bon endroit, c'est bien <p>Mais comme le comportement de ces boutons (g, u, i) n'est pas le même que ceux "citer", "ref", "trad" et "url" (ces derniers sont sous la forme : balise ouvrante, "votre texte", balise fermante), peut-être mieux les séparer des trois autres, en mettant les trois premières à gauches, les autres à droite ? <p>Pour l'utilisateur, les différences de comportement seraient plus clair ?<p>(continu les tests)<p>En fait, seuls les boutons g i et u sont à part... c'est à dire, si je clique dessus, sans sélectionner de texte, je n'ai qu'une balise ouvrante. Alors que pour les autres, c'est balise ouvrante, balise fermante, qui s'affichent. <br>Pourquoi ne pas garder ce même principe pour toutes les commandes ? Ce serait plus simple et plus prudent, je pense... sinon, on risque de voir des balises non refermées un peu de partout...<p>Bon, ce que j'en dis, hein <br>C'est déjà super d'avoir ces commandes, et la prévisualisation en plus <p>S.

[Pellucidar]

Petit test avec Safari, le navigateur de Mac OS X :<p><b>gras</b><br><font color=red>couleur</font><br><i>italique</i><br><SMALL>petit</SMALL><p>Suspense...

[Cédric]

<DIV class="citeAuteur"><B>Laegalad</B> a dit :<DIV class="citeTexte">Pourquoi ne pas garder ce même principe pour toutes les commandes ? Ce serait plus simple et plus prudent, je pense... sinon, on risque de voir des balises non refermées un peu de partout...</div></div><br>Oui, effectivement, cela semble plus sain. Je vais tester cette solution et vérifier si cela n'occasionne pas de "dommages collatéraux". Ex : quand je sélectionne une portion de texte et que je clique sur "G".<p><br>Cédric.

[Pellucidar]

Ouaaaiiis !!!<br>Merci Cédric !<br><SMALL>Pour quelqu'un qui fait de la mise en page toute la journée, qu'est-ce que ça fait du bien !</SMALL><p>J-M ("Pas un sou pour Microsoft !")

[Sylvae]

<SMALL>Je me suis posé moins de questions que toi, Steph ! J'ai écrit mon texte, puis mis en surbrillance avec la souris ce que je voulais mettre en forme, puis clic sur le bouton ad-hoc...</SMALL><br><SMALL>Sois basique, un peu ! C'est <i>"mise en forme pour les nuls ©"</i> !<br></SMALL><br>Par contre, Cédric, si tu pouvais ajouter le bouton-miracle "insérer un lien" <SMALL>(dans une nouvelle fenêtre si possible, ça évite de tout fermer au lieu de reculer... )</SMALL>, ce serait <u><b>parfait </b></u>! ;o)<p><SMALL>PS : quand on sélectionne un mot à mettre en forme au milieu d'un texte et qu'on clique sur "Petit", ça met bien les balises d'ouverture et de fermeture "small", mais ça en rajoute aussi une en fin de texte qu'il faut enlever...</SMALL>

[Vinyamar]

Ca y est, j'ai trouvé LE défaut ! <br>On ne peut plus utiliser la touche TAB pour aller du champ pseudo jusqu'au champ texte en trois mouvements.<br>Je crois qu'on peut y remédier facilement avec les ID des champs de formulaire, si tu peux configurer le champs texte en 3e position, ce serait chouette :-D<p>De même, la couleur bordeau étant plutôt utilisée pour tes liens (qui ne sontpas soulignés par ailleurs), ce serait bien de ne pas la rendre accessible, qu'on sache qu'un texte bordeau est un lien (sinon je passe ma souris sur les textes bordeaux pour voir si c'est un lien ou non...)<p>sinon, évidemment : bravissimo !!! <IMG SRC="http://parati.fraternite.net/forum/images/smiles/applaudit_gif.gif">

[sosryko]

Peut-être que Cédric a déjà oeuvré sans le dire, mais le bouton "URL" permet bien de placer un lien (mais pas dans une nouvelle fenêtre).<br>Tu vas pouvoir t'envoler vers de nouveaux horizons à l'image du <A HREF="http://www.pixelnumerique.com/pixelnumerique.php?fonction=displayPhoto&id=132&categorie=21#vignettes">petit oiseau</A> que tu aimes tant ;-)<p>Petite remarque pour Cédric : pour éviter certains accidents qui pourraient être dus à l'enthousiasme de poster rapidement, ne pourrait-on grossir le bouton "prévisualiser" ou alors changer sa couleur ou la couleur de son fond (rouge ? vert ? une couleur qui détonerait pour attirer le regard et faire penser à vérifier ses balises)

[Moraldandil]

Ca s'étoffe ! Très bonne idée Cédric que ces petits outils. C'est utile même quand on connaît un brin d'HTML... il n'est pas toujours aisé ne pas oublier une balise dans un message un peu long, ces fonctions de mise en forme faciliteront bien les choses. Je vais même pouvoir faire en deux temps trois mouvements des citations correctes <p>Le seul inconvénient, c'est que Rebeca en profitera encore plus pour ne poster qu'en petit. Parole, je finirai par croire que &lt;small&gt;&lt;/small&gt; est la seule balise HTML qu'elle retienne :-P<p>B.

[Cédric]

<DIV class="citeAuteur"><B>Vinyamar</B> a dit :<DIV class="citeTexte">De même, la couleur bordeau étant plutôt utilisée pour tes liens (qui ne sontpas soulignés par ailleurs), ce serait bien de ne pas la rendre accessible, qu'on sache qu'un texte bordeau est un lien (sinon je passe ma souris sur les textes bordeaux pour voir si c'est un lien ou non...)</div></div>Remarque pertinente, la couleur bordeaux n'est plus ;-)<p>Pour l'ordre des tabulations, je m'en occupe.<p><br>Cédric.

[rebeca]

<SMALL><i><font color=purple>Non non, je sais aussi comment mettre du mauve et de l'italique ^^</font></i></SMALL>

[Jecapitch]

Si je puis me permettre, le bouton petit, quand on l'utilise sur une sélection, ouvre, ferme, et ouvre encore une fois, en tout cas chez moi. <SMALL>La preuve.</SMALL><.SMALL>

[Gawain]

<b>Qui veut soigner une <i>migraine</i><i></i></b><i> <br>n'a qu'à <u>boire</u></i><u> toujours du bon</u><br>et maintenir<br><SMALL><div class=gauche>miam miam</div><div class=droite>glouglou</div><div class=vide></div></SMALL><div class="refTexte">la table pleine<div class="refTitre">de cervelas et de jambon</div></div> <br><DIV class="citeAuteur"><B>Giligili</B> a dit :<DIV class="citeTexte">l'eau ne fait rien que pourrir le poumon</div></div><br><font color=green>boute </font><font color=#808080>boute </font><font color=red>boute </font><font color=blue>boute </font><font color=darkblue>compagnon</font><p><A HREF="http://www.chimay.com//" target="_blank">Vide nous ce verre et nous le remplirons</A><p>C'est sur ça va plus vite !!

[Cédric]

<DIV class="citeAuteur"><B>Sosryko</B> a dit :<DIV class="citeTexte">ne pourrait-on grossir le bouton "prévisualiser" ou alors changer sa couleur ou la couleur de son fond (rouge ? vert ? une couleur qui détonerait pour attirer le regard et faire penser à vérifier ses balises)</div></div>C'est fait. Un beau bouton bien rouge est maintenant visible ;-)<p><br>Cédric.

[ISENGAR]

Ah ça, oui. On ne peut plus le rater :o)

[sosryko]

Merci cédric ;-)