Un petit édito pour vous annoncer que je vais commencer à publier ici quelques billet rédigés au départ sur Notorious Blog afin de leur donner une meilleure visibilité. Si l’audience de Notorious Blog est de qualité (normal, la majeure partie vient de ce blog), le nombre de lecteurs plafonne à une trentaine par jour en [...]
Les 10 plus beaux designs CSS selon SmashingCoding
Le concours organisé par Smashingcoding est terminé et les membres du jury ont rendu leur copie pour désigner le vainqueur parmi le top 10 des blogs inscrits. Je suis content d’être à la 5ème place et je félicite chaleureusement le 1er (avec une pointe de jalousie, il faut bien le dire) ainsi que tous les autres participants avec une pensée pour SuperChinois 
Voici donc les 10 plus beaux design CSS selon SmashingCoding qui avait pris en compte l’apparence du blog, la qualité du code, les astuces CSS utilisées et les difficultés surmontées en terme de webdesign :
- Affinity Web
- le blog de Damien Alexandre
- Webinventif, Kenny-Blog
- BizetFamily
- css4design
- Pixnlov
- Pixenjoy
- Pilok
- Buzz and People
- Tux Planet
PS : Vous remarquerez que Britney “CSS” Spears n’était pas très “fatiguée d’être sexy” ! Bien joué eMeRiKa 
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. Lire l’article »
Créer le logo et la charte graphique de mon nouveau blog en 4 étapes
J’ai déjà eu l’occasion de dire quelques mots sur la conception d’une charte graphique. Les 3 étapes évoquées alors étaient forcément réductrices… Plus qu’un billet sur le graphisme, il s’agissait d’une part de montrer comment la théorie peut s’articuler avec la pratique et d’autre part d’expliciter une méthode d’organisation. Aujourd’hui, je profite de la mise en place progressive de mon nouveau blog sur les blogs, les blogueurs, la blogosphère, le blogging, le microblogging, le moblogging (rien de sanglant, rassurez-vous) et la création de blogs événementiels, pour mettre la théorie en pratique. Après le teasing qui a débuté avec la chaîne Kawa-Yaka, je vous livre les étapes qui mènent de l’envie à l’idée, jusqu’à la réalisation finale. Lire l’article »
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 ! Lire l’article »
Quelques notes sur la conception d’une charte graphique
Le processus de création d’une charte graphique devrait idéalement s’appuyer sur un contenu validé par le client et bien compris par l’équipe créative chargé du projet. Le contenu est roi, paraît-il, ce cher contenu… Le moins que l’on puisse dire, c’est que si l’exactitude est la politesse des rois, le contenu se fait souvent désirer, alors que dans le même temps le client attend une maquette fonctionnelle si possible. Dans ces conditions comment “sortir” une charte qui ne soit pas seulement l’application de vieilles recettes (aussi bonnes soient-elles) ou le résultat d’une bonne pioche (fut-elle issue de la tendance web 2.0) ? Lire l’article »
Smashing Magazine : des CSS plein les yeux
C’est Noël ! Et pour fêter ce moment dans la joie et la bonne humeur, je partage avec vous un site idéal à consulter entre les huîtres et la bûche pour en apprendre encore plus sur le XHTML et les CSS. Et aussi pour avoir sous les yeux des dizaines de design web qui, si vous n’y prenez garde, risquent de booster votre imagination. A consommer sans modération.
Découvert grâce à l’excellent blog de neo-ma, Smashing Magazine mérite de figurer dans votre liste de liens ou dans votre blogmarks préféré.
Vous découvrirez la crème de la crème en matière de liens vers des galeries de sites sur les CSS tous plus intéressants les uns que les autres, suivie par une liste de 50 designs web classés par ambiance : vibrant designs, dark designs et light designs.
Des sets d’icônes à télécharger librement de même que des liens vers des polices de caractère de qualité à télécharger, une galerie de formulaires CSS…
Tous ceci n’est bien évidemment que la partie visible de l’iceberg tant le site est riche de liens et d’exemples.
Joyeuses fêtes à toutes et à tous 
Votre palette de couleurs avec Color Palette Generator
Le choix d’une palette de couleur est déterminant dans l’élaboration et la réussite d’une charte graphique. Pour cela, Je m’inspire souvent des couleurs d’une image en les choisissant avec la pipette de Photoshop.
Détourer les cheveux avec Photoshop
Le web design est aussi fait de photo, et Photoshop est un logiciel fascinant. Deux bonnes raisons pour vous proposer ce tutoriel qui expose une des techniques que j’utilise pour détourer un personnage en vue de le placer sur un autre fond. J’ai souvent obtenu de bons résultats en utilisant les outils Plume, Lasso, Masque de fusion et Pinceau. Le filtre Flou gaussien, toujours vaillant, sera de la partie pour ajouter du naturel. Dans le monde des effets spéciaux ça s’appelle du mate painting. Mais restons simple, c’est un photomontage
Exercice de style CSS et HTML : table vs div
Lire l’article »
Publié le 26 octobre 2006 par Bruno Bichet. 7 commentaires »