Vous l'avez constaté, ici aussi, c'est le printemps! Mon génie de Ced nous a fait un thème, vraiment, mais alors, vraiment superbe. Du Grand Art à coups de vert olive et de petites babioles.
Au rayon des babioles :
- [sIFR 2.0](http://www.mikeindustries.com/sifr/) : un système permettant de remplacer le texte html pour les titres par du texte en flash
- L'affichage des derniers commentaires
- Le nombre de lectures des billets (des visiteurs qui cliquent sur le billet pour le lire)
- Le nombre de personnes connectées là maintenant tout de suite sur notre superbe blog
- Un peu d'ordre dans les liens
- La possibilité d'utiliser les [gravatars](http://www.gravatar.com/) dans les commentaires
- Une table des matières
Tout ça grâce aux plugins disponibles sur le site de Dotclear. Tout n'est pas encore terminé mais on espère que ça vous plaira ;-)
Commentaires (24)
validator.w3.org/check?ur... snif snif...
sinon, on a comparé entre un ordi avec flash et un ordi sans flash, je vois pas vraiment ce qu'apporte le titre en flash... Il bouge pas, il clignote pas... C'est du texte quoi... Une explication ? ;)
C'est super joli ce thème vert olive :)
Ca sent le printemps.
Par contre, pourquoi du flash ? Ca bouge même pas !
Cela permet d'avoir la typo qu'on veut pour les titres, de ne pas être limité par les polices installées sur l'ordinateur de la personne. Ici c'est du Myriad Pro Bold Condesed, mais ça pourrait être n'importe quelle autre police TTF
...même une police rigolote . Ced va encore bidouiller sur le thème mais là ça lui a juste pris une après-midi et demi.
En fait, il faut que je vous avoue un truc, c'est moi qui l'ai ennuyé au finish pour qu'il change l'horrible truc gris, hivernal et affreusement pas personnalisé qu'on avait. Donc, ça a été vite fait, juste pour que je sois contente (gentil, mon amoureux hein), il était pressé de retrouver sa boîte d'arcade...
Marc >> Donc, des changements en vue notamment la validité du code.
En bon geeks que vous etes tous les deux, Diane et Marc, j'espère que vous vous ferez de jolis petits gravatars... Je dois préciser un truc que vous savez sans doute déjà, pour que le gravatar soit visible dans le commentaire (et plus celui par défaut que Ced a bidouillé), il faut laisser son adresse email (y a un lien entre l'adresse email et le gravatar).
soph>> je me documenterais sur cette histoire de gravatar, car j'ai pas encore tout compris ;)
Ced>> un peu comme un truc qui génère un png/gif/jpeg à partir de texte (genre avec la libgd ça doit se faire simplement à partir de php), sauf que c'est du flash? Bon ok, je suis de mauvaise foi, mais j'ai horreur du flash quand c'est pour des choses qui peuvent être faite avec des choses plus standard... mais bon, j'ai rien à dire vu que même sans flash, on est absoluement pas géné ici ;)
En tout cas, c'est joli ;)
(par contre, maintenant que le fond est gris, je vois exactement où se place la pub, y'a un gros cadre blanc vide)
Sympathoche tout ça.
Par contre : même remarque pour les titres. Pourquoi du flash pour des titres aussi classiques ?
Mais ça va changeeeeeer, allez quoi, une grosse demi journée, ça a pris, pour faire ce blog, alors tout n'est pas fini, tout n'est pas fini...
SUPER , cette couleur ca sent la gaité et la bonne humeur
bravo!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
Bravo, chouette, un site qui bouge!
Si je pouvais en faire autant et prendre le tps pour mon site perso...
Et techniquement réalisé de manière professionelle! SIFR, DIV, CSS, etc...
Ce petit gars à l'air de s'y connaître!;)
On dit merci à Cuvelier pour ses leçons d'HTML, il a su nous inculquer l'amour du Web!
Puréééééééééé!!! Ca tue ce blog les gars... Et ce GOUROU ne rigole plus.... :) il bosse grave et il perd pas son temps! :) ... il est temps que nous aussi on passe aux choses sérieuses, surtout moi je déconne... g toujours pas eu le temps de commencer le mien.
moi je suis love, c'est propre comme j'aime, enfin bref jai deja donné mon avis sur cafzone ;)
moi qui prépare mon site joujou en version 2.0, ya de bonnes idées ici
le coup des typos, je trouve ca génial !
pour ceux qui comprennent pas l'interet, comment dire, laissons les dans l'ignorance, hahaha :)
encore bravo.
Titan>> si tu m'expliques en quoi je suis ignorant, je serais heureux de moisir dans mon coin =)
>>Marc: A ce que j'ai pu comprendre, si les titres n'avaient pas été en flash, il n'y auraient que les gens qui ont installé la police airstrip sur leur ordinateur qui auraient pu voir nos titres comme on les montre là. Sinon ils les auraient vu dans une police simple et non personnalisée.
Bref, flash c'est un truc d'artistogeek.
>>Titan: Wééééé, il déchire le blog que mon mec a fait (hahahaha suis heureuse de l'avoir poussé à changer le design). Trop fort, mon mec :-)
soph>> ça je suis d'accord, et le principe n'est pas nouveau. C'est plutôt le 'pourquoi flash?'. Car pour afficher quelquechose de fixe, c'est simple, un jpeg/png fait l'affaire. Pour afficher une animation sympatoche, flash sait le faire. Pourquoi du flash pour un truc tout fixe qui bouge pas.
Parce qu'une image/jpg/png, il faut en générer une pour chaque titre. Avec plus de 100 billets, ça ferait plus de 100 images. Alors qu'avec le système sIFR, il suffit d'un javascript, d'un fichier flash de quelques ko, et tous les titres sont dans la typo qu'on veut. Tout en restant 100% accessible aux personnes qui n'ont pas Flash ni javascript. Dans la source html, ça reste une simple balise html, comme h2, p, etc.
Je copie ici un texte de almaren.ch :
"Les techniques de remplacement graphique (TRG?), ou Image Replacement techniques, ne sont plus vraiment une nouveauté. Depuis la nuit des temps (c’est-à-dire depuis une dizaine d’années) les webmasters ont rêvé d’enfin s’affranchir des limitations de la toile quant à l’emploi des polices de caractère. Une authentique typographie sur la toile, c’est devenu un vrai serpent de mer: ah, ne plus être limité aux quelques sept polices de caractère “universelle�? (c’est-à-dire présentes sur la très grande majorité des machines Linux, Mac OS ou Windows)!
Nous n’allons même pas reparcourir les techniques utilisées avant 2001*, alors que “webdesign�? signifiait encore “mise en page avec des tableaux�? presque exclusivement. Mais avec le développement web glissant depuis vers les techniques (X)HTML + CSS, le besoin s’est fait sentir de trouver autre chose que h1, h2, h3, h4, h5, h6 { font-family : Georgia, "New York", Utopia, "Times New Roman", Times, serif; } pour embellir titres et en-têtes de page.
Le 7 mars 2003, Douglas Bowman publiait Using Background-Image to Replace Text, en y décrivant une technique qui deviendra célèbre sous le doux nom de FIR (�?Set my Web on FIR�? fut un gag éculé depuis lors), ou Fahrner Image Replacement d’après le nom de son concepteur Todd Fahrner. Si cette technique est devenue obsolète depuis (son plus grave défaut étant de ne pas être accessible), elle a ouvert le chemin à bien d’autres techniques pour donner un peu de “pep�? à nos pages web. Citons, parmi d’autres, LIR (Leahy/Langridge Image Replacement), RTIM (Rundle’s Text-Indent Method) ou PGIR (Pixy/Gilder Image Replacement).
Toutes ces techniques présentent leurs propres avantage et inconvénients. Si vous êtes vraiment intéressé à une revue de détail des différentes possibilités aujourd’hui à votre disposition, nous vous renvoyons à l’excellent article de Dave Shea intitulé Accessible Image Replacement, ainsi qu’au tableau comparatif Image replacement decision grid concocté par Levin Alexander. Nous avons nous-même testé la plupart de ces techniques à un moment ou à un autre sur Almaren, mais finalement notre choix s’est porté sur une variante de la FIR originelle telle que présentée par Levin Alexander (encore lui!). Mais pour d’autres sites, d’autres choix peuvent être nécessaires.
Un défaut non lié à l’accessibilité ou à la pureté du code des techniques sus-mentionnées est le fait que chaque image doit être prévue et créée à l’avance. Impossible de l’adapter à un site en évolution constante tel un blog. Pourtant… Toujours sur l’incontournable A List Apart, Stewart Rosenberger publiait cet été un article intitulé Dynamic Text Replacement. Bingo! Voici qu’avec un peu de PHP et un brin de (Java|ECMA)Script s’ouvraient les portes de la création dynamique d’images à partir d’une police de caractère donnée. Enfin le Sacré Graal d’une typographie riche et libre de contraintes pour les webdesigners? Pas encore, mais on s’approchait beaucoup d’une solution élégante et accessible. D’ailleurs, l’idée n’était pas tout à fait nouvelle: les utilisateurs de WordPress connaissent bien le site de son développeur principal, sieur Matt Mullenweg, et ses grands titres constitués d’images créées à la volée par une armée d’elfes à partir de la police de caractère Dante.
Parallèlement à cette technique de remplacement dynamique du texte par des images, Shaun Inman présentait (et révisait peu après) IFR (Inman Flash Replacement). Essentiellement, il s’agit d’une technique similaire à celle présentée par Stewart Rosenberger, mais avec une variation de taille: le texte n’est plus remplacé dynamiquement par une image, mais par une “animation�? Flash! L’inconvénient de dépendre d’une technologie propriétaire pouvait trouver compensation dans le fait que le texte ainsi remplacé n’était pas seulement élégant et accessible, mais également selectionnable.
IFR a rapidement été re-développé et amélioré par d’autres, et un des résultats les plus impressionnants est sans doute sIFR (scalable Inman Flash Replacement), développé par Mike Davidson et al. et présenté au monde en août de cette année. Combinant (ECMA|Java)Script, CSS et Flash, sIFR lâche enfin la bride sur le cou des webdesigners et permet des choses incroyables il y a quelques mois: jugez-en vous même! Le texte reste parfaitement accessible aux navigateurs en mode texte (oui, même Lynx), est selectionnable, lisible et suffisamment sexy aux yeux de n’importe quel webdesigner normalement constitué (un oxymore, on sait) pour que même les plus aguerris d’entre eux sentent un noeud leur monter à la gorge.
Ayant atteint désormais sa deuxième incarnation, sIFR nous a paru suffisamment solide pour tenter son introduction sur Almaren. Nous ne sommes d’ailleurs pas les seuls à avoir trempé nos orteils dans ce nouveau lac, et d’autres ont déjà écrit leurs impressions à ce sujet de manière très concise et claire. Nous sommes conscients que sIFR présente encore quelques défauts, mais nous allons essayer cette technique une petite semaine, puis nous déciderons si l’adopter définitivement ou pas. Après tout, si nous ne pratiquons pas ce type d’expériences sur notre propre site personnel, où devrions-nous les pratiquer?"
ouai, je vois un peu mieux :) Sans doute que ces gens savent bien mieux que moi, même si je suis pas sûr d'avoir saisi les gros avantages de flash par rapport à la génération d'image (mais je vois mieux les désavantages de cette dernière)... Merci des éclaircissement!
Ah bon, c'est ced qui place les flash, je vais t'envoyer mes contraventions pour excès de vitesse alors !!!
super joli cette nouvelle peau ^^
en plus je suis fan du vert olive en ce moment :) (que j'appelle vert "dizigne" ou vert lime :) )
bonne continuation :D
>> fONfEK: lol merci c'est vrai que c'est super tendance en ce moment.
Tiens et si je m'achetais un petit top vert olive pour l'été.
on dirait que les liens en bas pour CSSValid et XHMLValid sont pas bons, les deux pointent vers la validateur CSS (qui veut pas valider d'ailleurs) =)
Et aussi, on a pas la chouette petite fleche quand on passe la souris sur les liens de la rubrique 'liens'
Voilà voilà =)
Gongratulation Sir ! J'imagine ta satisfaction quand tout a été terminé... Les CSS c'est bien :)
Tu le sais probablement déjà, mais j'adore ce redesign, c'est très joli :)
Super ce theme..la classe..
Mais y a pas moyen de le distribuer et d'en faire profiter..?
Merci d'avance..
Rien a dire ce bkog est nikel comme une sucette à la fraise :)