Voici quelques liens qui vous permettront de choisir les couleurs de vos sites web. J’ai volontairement laissé de côté les outils en ligne spécialisés dans la création de palettes de couleur dont j’ai déjà eu l’occasion de parler dans Choisir sa palette de couleur. →
0 to 255 — Trouvez les variations autour d’une couleur de base
0 to 255 est un outil en ligne très pratique pour afficher et copier les variations autour d’une couleur de base par palier de 3% ou 4%. On peut sélectionner une couleur parmi celles qui sont proposées ou saisir la couleur de son choix au format hexadécimal. C’est l’outil idéal pour choisir les couleurs secondaires d’un site web, comme les effets `:hover`, les bordures, les dégradés, etc. →
Guide stylistique — Exemple de charte graphique et éditoriale
Lorsqu’on réalise le design d’un site web, il est d’usage de formaliser les choix créatifs retenus en répertoriant les éléments qui composent l’identité graphique et éditoriale dans un guide stylistique. Son objectif est de garantir à l’utilisateur final une expérience visuelle et intellectuelle cohérente tout au long de la navigation. Ce guide stylistique s’adresse généralement aux professionnels chargés de la réalisation technique du site (développeurs, intégrateurs web, etc.) et à ceux qui devront intégrer les contenus au quotidien, qu’il s’agisse des textes et de tout élément graphique ou multimedia. Il peut également préciser les valeurs de la marque et son positionnement vis-à-vis de ses concurrents. C’est dire l’importance de ce guide qui servira souvent de référence dans l’entreprise. →
Support du RGBa pour « jQuery Color Animations »
Le plugin jQuery Color Animation permet d’effectuer des animations en jouant plus particulièrement sur les transitions entre les couleurs. Malheureusement, le plugin ne s’occupe pas le canal Alpha qui permet de gérer la transparence indispensable lorsque l’animation a lieu sur une image en arrière-plan. →
CSS Color Editor remplace automatiquement les couleurs dans vos CSS
CSS Color Editor est une application en ligne qui permet de modifier légèrement ou radicalement votre palette de couleurs en trois étapes : indiquez l’emplacement de votre fichier CSS ; modifiez les anciennes couleurs grâce à un Color Picker complet et intuitif ; téléchargez le fichier CSS modifié. →
Le principe de proximité dans le webdesign
Le « principe de proximité » est un concept issu de la Psychologie de la forme (Gestalt) qui énonce que le cerveau a tendance à regrouper des éléments qui sont placés à proximité pour former un ensemble cohérent. Des éléments placés côte à côte sont perçues comme des éléments ayant un rapport entre eux. Ils forment dans notre esprit des sous-ensembles qui vont alors fonctionner comme un tout
. Pour appliquer ce principe de proximité dans le cadre de la conception d’un site web, on rassemblera les éléments qui partagent un destin sémantique commun au sein d’un ensemble visuellement identifiable. →
15 outils en ligne pour créer des palettes de couleur
Pour le webdesigner d’aujourd’hui comme pour le peintre d’hier, le choix d’une bonne palette de couleur est déterminant pour la réussite d’une oeuvre, fut-ce un site web. Pour y parvenir, voici quelques ressources en ligne pour obtenir rapidement des palettes de couleurs de qualité, tout en s’amusant. →
BIC, framework CSS orienté couleur et typographie
BIC est un meta framework CSS basé d’une part sur le reset CSS d’Eric Meyer pour la remise aux valeurs par défaut des éléments HTML (`clean.css`) et le framework 960.gs pour la partie grille de mise en page (`layout.css`), et d’autre part sur de bonnes idées en ce qui concerne le traitement de la typographie et de la couleur (`typography.css` et `color.css`). →
[résolu] Les folles journées de l’intégrateur HTML et ses petits tracas…
Le quotidien de l’intégrateur HTML est parfois assombri par la survenance de bugs plus ou moins gênants. Ces derniers jours, je me suis débattu avec un décalage de couleur entre une image au format png et un fond spécifié en hexadécimal. Et comme si ça ne suffisait pas, Internet Explorer et Firefox n’ont pas aimés que je débute l’intitulé d’un identifiant avec un underscore ! Pfff… Pour finir si l’utilisation de overflow: hidden pour clearer les float est une bonne idée, cette propriété peut avoir des effets de bord indésirables. Enfin, voyons ça de plus près : →
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. →