Deeder.fr

Tribulations d'un geek...

Aller au contenu | Aller au menu | Aller à la recherche

12 avril 2008

On peut tout faire en CSS, même dessiner Homer Simpson !

Et oui, certains son fous des CSS, à un tel point qu'ils décident de passer quelques heures à dessiner Homer Simpson. Bon, on passera sur les symptômes de "divite aigue" que l'on peut déceler dans le code pour se concentrer sur l'oeuvre en elle même, d'un réalisme assez bluffant soit dit en passant. On croirait une image, mais non : essayez de zoomer ('ctrl' et '+' sous Firefox) et vous verrez que l'image s'agrandit également. Magie !

Cela rejoint d'ailleurs un billet que j'avais écrit il y a deux ans sur les CSS et leurs usages assez particuliers pour ceux qui l'auraient manqué. Pour admirer Homer en CSS, ça se passe par là. Have fun !

Via Webinventif

31 juillet 2007

Déformation peu professionnelle...

Si vous êtes passé il sur ce blog il y a quelques heures de cela (enter 15h et 16h), vous avez peut-être aperçu une modification du design de ce blog. Non, je ne change pas le design pour l'instant (bien que j'y réfléchisse à mes heures perdues et que ça me titille un peu en ce moment), ce n'est pas non plus un complot interplanétaire ou même une souris qui se serait introduite dans le serveur de chez 1&1 en rongeant quelques fils mais bien une erreur humaine qui n'a rien à voir avec un hypothétique changement de design de ce blog...

En effet, je travaillais à l'adaptation d'un skin Dotclear v1.x sur Dotclear v2 et j'uploadais le résultat de la modification sur le blog afin de vérifier le rendu de la mise en page. Tout se passait bien jusqu'à ce que je m'aperçoive que je m'étais trompé de FTP et que j'avais uploadé le fichier en écrasant le syle de LiberT... Après m'être cogné la tête trois à quatre fois contre le mur, la plus lourde tâche qui était mienne consistait à retrouver la sauvegarde des CSS de ce blog pour les remettre en place.

Malheureusement, c'est toujours lorsque l'on en a besoin qu'on se rend compte que l'on ne fait pas assez régulièrement de sauvegardes, la dernière datant de décembre dernier ! Maque de bol, j'ai depuis effectué quelques modifications du design et même Dc2 encore en beta a changé quelques petites choses dans son code. Il m'a alors fallu régler les problèmes de compatibilité en catastrophe, corrigeant les bugs d'affichage selon mes lointains souvenirs.

Bref, tout ça pour vous dire qu'il ne faut jamais oublier de faire de sauvegardes régulièrement (ni oublier où on les a ranger, étant donné que j'ai dû fouiller deux PC et un disque dur externe avant de les retrouver. On n'est jamais à l'abri d'une erreur humaine, parfois même la plus bête possible, celle à laquelle on n'aurait jamais pensé. Bon, je vous laisse, j'ai des sauvegardes à faire moi...

PS : vu que la peinture est fraiche, il est possible qu'il reste quelques bugs. Si vous en voyez, n'hésitez pas à me faire signe dans les commentaires. ;)

17 février 2007

Arrondissez les angles avec RoundedCornr

Qui n'a jamais eu affaire avec ces maudits angles arrondis en codant un design ? Si c'est parfois subtile aux yeux d'un intégrateur xHTML/CSS, imaginez à quel point ça peut être devenir une épreuve pour un débutant en la matière. Et bien d'autres y ont pensé pour vous en créant le premier générateur de coins arrondis nommé RoundedCornr[1].

Logo RoundedCornr

Basique, dégradé, avec bordure, il vous suffit de remplir les quelques caractéristiques de votre boîte pour qu'elle soit automatiquement générée. Vous n'avez plus qu'à récupérer les images créées ainsi que le code XHTML et le code CSS correspondants. Pratique non ? D'autant plus que c'est simple et efficace.

Le code ainsi généré n'est pas forcément des plus magnifiques, rajoutant quelques balises neutres (<div>) vides, mais cela reste correct dans l'ensemble. Evidemment, si vous vous y connaissez un peu en CSS, je vous conseille de créer vous même vos arrondis en adaptant le code à la structure dont vous disposez, il n'y a rien de plus propre que ce qui est créé par la main de l'homme.

Mais en tant que débutant, vous y trouverez forcément votre compte. Vous voyez que les générateurs Web 2.0 peuvent être utiles dans certains cas ! Si vous en avez d'autres dans le genre, je reste preneur... ;)

Notes

[1] Non, je n'ai pas oublié le "e" ! :)

21 janvier 2007

Testez vos connaissances standardistiques !

Vous pensez tout savoir sur l'accessibilité, le XHTML, les CSS ou même le PHP ? Et bien il est temps de vérifier vos compétences avec les Quiz Alsacréations. Regroupés sous plusieurs thèmes et plusieurs niveaux de difficulté, ces quiz vous permettront de vous divertir tout en apprenant ou en consolidant vos acquis grâce aux éléments de réponses et de compléments apportés à la correction.

Quiz

Une initiative intéressante à saluer qui est, je crois, une première dans le domaine. Raphaël avait déjà, si je ne m'abuse, usé de cette technique de questionnaires à plusieurs reprises dans son livre. L'occasion de ne pas laisser le lecteur inactif et de vérifier qu'il a tout assimilé. Là où la plupart des médias à vocation unilatérale tels que les ouvrages papier vous laissent seul face à l'épreuve d'assimilation de l'information, cela permet d'assurer un minimum d'interactivité et d'impliquer le lecteur. Sur le web, le principe est le même.

Vous n'avez qu'une envie : tester de suite vos connaissances, alors c'est par ici : Quiz Alsacréations.

EDIT : Raphael me fait remarquer en commentaire que W3School propose déjà ce genre de quiz en anglais.

28 novembre 2006

La création d'un site avec les CSS en images

Petit gif animé sympa qui montre la construction d'un site web au fil du temps, le tout en CSS bien sûr !

L'évolution d'un site web

Source, découvert sur le forum d'Alsacréations

- page 1 de 2