HTML & CSS

Frameworks CSS — Blueprint vs 960 Grid System

Blueprint et 960 Grid System sont deux frameworks CSS que j’ai utilisés parmi les 25 que j’ai recensés et survolés dans Choisir un framework CSS. J’ai ainsi pu me faire une idée plus précise de leurs qualités respectives. Je ne me suis pas attardé sur les aspects typographiques — même s’ils ont leur importance : j’ai préféré faire l’analyse du système de grille de mise en page (grid.css et 960.css). Pourquoi comparer ces deux frameworks ? Tout simplement parce qu’ils proposent pratiquement les mêmes «fonctionnalités» avec quelques différences dans la mise en oeuvre. Après une rapide introduction sur Blueprint et 960 Grid System, vous trouverez dans la suite de cet article une comparaison et une explication de code. →

HTML & CSS

39 frameworks CSS — Mettez une grille dans votre design

Grille de mise en page

Il existe de nombreuses raisons pour ne pas utiliser de frameworks CSS lors de la phase de conception ou d’intégration de votre site web : le poids, l’intrusion des classes CSS dans le code HTML qui devient la règle pour placer le moindre bloc de contenu, le fait que de nombreuses règles ne sont pas utilisées, etc. Ceci dit, j’aime bien tester les frameworks CSS qui tombent à portée de souris, et je n’hésite pas à faire des expériences d’hybridation. Le potentiel didactique de ces projets est très intéressant. Ne vous en privez pas. →

Helper CSS

Balance Columns — Équilibrer des colonnes avec Javascript

balance_columns — ce script astucieux et non instrusif vous permettra d’équilibrer des colonnes entre elles (contenu et barre latérale, par exemple). Les identifiants des blocs à équilibrer se placent dans l’en-tête du script et ce dernier se dégrade harmonieusement si Javascript n’est pas activé sur le navigateur.

CMS WordPress

Devenez Alpha testeurs pour Vanilla : un thème WordPress basé sur SandBox et Yahoo! User Interface CSS

Ca fait quelque temps que je n’ai pas parlé du thème Sandbox qui contient une foultitude de classes CSS générées automatiquement en fonction du contexte. Ce « meta » thème pour WordPress est déjà en version 1.3 pour la branche 2.3.x de WordPress et existe également en version 0.9.8 pour ceux qui serait resté avec un WordPress 2.0.x. Une des particularités de la version 1.3 est la présence d’un fichier .pot pour localiser ou traduire le thème !

Prêt pour la prochaine génération de thèmes WordPress ?

La spécificité de Sandbox est donc de servir de fondations pour bâtir d’autres thèmes. A ce propos, j’attire votre attention sur le thème WordPress Vanilla conçu par Alister Cameron, blogueur et designer de talent, qui fut membre du jury pour le concours de thèmes Sandbox qui s’est terminé en juillet 2007 avec 46 thèmes en lice.

Le thème Vanilla est bâti autour de Sandbox et du framework UI CSS de Yahoo!, ce qui lui permet une certaine souplesse dans le choix de la largeur du design, de la taille des colonnes et de plein d’autres choses que je vous laisse découvrir dans le billet de l’auteur. Bref, un thème pour plusieurs maquettes avec la prise en compte des formats de publicité définit par l’IAB !

Pour devenir Alpha testeur, il suffit d’en faire la demande à Alister Cameron à l’adresse : alister@alistercameron.com ou dans les commentaires de son billet.

HTML & CSS

Frameworks CSS + Reset CSS : design from scratch

Je n’ai pas résisté à l’envie de vous proposer ma traduction de l’article CSS Frameworks + CSS Reset: Design From Scratch paru dernièrement sur Smashing Magazine. Les frameworks CSS sont des environnements de développement composés généralement de plusieurs fichiers CSS gérant chacun une partie spécifique du design web (typographie, grille de mise en en page, formulaires, etc…). Ces frameworks sont souvent accompagnés d’un Reset CSS, pour s’affranchir des différences de rendu entre les navigateurs. L’article fait ainsi le point sur la notion de framework CSS, ses avantages et ses inconvénients, décrit les frameworks les plus populaires et termine par une série de liens commentés à propos des Reset CSS et des styles de base. En attendant d’éventuels retours sur la traduction, ce billet est en version bêta. →

Thèmes WordPress

Sandbox Designs Competition : 46 thèmes pour WordPress passés en revue

Les résultats du Sandbox Designs Competition sont disponibles depuis quelques heures après plusieurs jours passés à peser le pour et le contre de chaque proposition. Chaque membre du jury était libre de laisser libre court à sa subjectivité et à son intime conviction pour se prononcer sur les choix éditoriaux ou la mise en valeur des différentes fonctionnalités qui structurent un blog. Ou encore sur les choix purement esthétiques comme les visuels employés ou les choix colorimétriques. J’ai accordé un poids important au confort de lecture en traquant impitoyablement les déficits en blancs tournants, interlignages et autres espacements. Pour autant, je n’ai pas laissé de répit aux problèmes de lisibilité dépendants de la palette de couleurs retenue : un blog, c’est avant tout beaucoup de texte à lire. En second lieu, j’ai pris en compte l’équilibre global du design. J’ai vérifié ensuite si la structure résistait à l’épreuve de la compatibilité inter-navigateurs. Pour celà, j’ai testé les pages sous Firefox 2, Internet Explorer 6 et Opéra 9, le tout pour Windows. Merci à Scott pour avoir mis en place ce concours qui fut un modèle d’organisation. Vivement l’année prochaine ! →

Javascript & PHP

Framework JQuery pour écrire du Javascript non-intrusif

JQuery, librairie Javascript. Pour ajouter un semblant d’interactivité aux pages web, il fallait auparavant chercher longtemps pour dénicher le bon bout de code Javascript cross-browsers qui va bien. Aujourd’hui, c’est le choix d’une librairie1 Javascript adaptée à nos besoins qui prend du temps. Les prétendants sont nombreux et la qualité est au rendez-vous : Prototype accompagné de script.aculo.us, Mootools et le petit Moofx, Dojo, Yahoo! UI Library, jQuery avec Interface, etc. Whoa! quel chemin parcouru depuis la fin du 2ème millénaire… →

Pages : 1 2 3 4 5
Ergonomie & Accessibilité

Améliorations cosmétiques et ergonomiques sur ce blog

Améliorations cosmétiques et ergonomiques sur ce blog ? Après mon petit tour sur les questions relatives à l’ergonomie des blogs, je me suis décidé à repenser la navigation sur css4design qui en avait bien besoin. Quelques commentaires plus tard sur la navigation par tag vs catégorie, je suis descendu de mon petit nuage… J’en ai même profité pour harmoniser les couleurs en diminuant la part du rose au profit du vert. Sans connotation politique aucune 😉 →

Pages : 1 2 3