blog

Vestiges d’un CSS Guru

Catégorie : Tutoriaux

Billet

Comprendre le line-height

Le line-height est une propriété de base très importante mais trop souvent mal utilisée. En fait, elle est très souvent ignorée, ou bien définie approximativement parce qu’elle concerne l’espace qu’occupe le texte. Et visuellement, le texte est difficile à mesurer. Néanmoins, le line-height est essentiel au confort de lecture ainsi qu’à l’équilibre spatial d’une page web.

Je vais essayer d’expliquer le peu qu’il y à comprendre en m’appuyant sur un élément que vous venez de lire : le titre de mon billet.

Lire la suite →

Billet

Colonnes, marges et nth-child en CSS 3

Mail d’une amie :

J’ai une colle pour toi :

1 – 4 colonnes de 240px => largeur totale 960px
2 – je rajoute un margin-right de 5px et soustrais 5px de la largeur de la colonne => largeur totale 960px
Et pourtant dans le 2ème cas, visuellement la largeur totale est inférieure à 960px.
How is it possible ?

Elle n’était vraisemblablement pas bien réveillée parce qu’elle connaissait la réponse, mais je vais développer la méthode ici pour ceux qui auraient des soucis.

Lire la suite →

Billet

WordPress : le Tutoriel pour créer un site de A à Z

Après mon tutoriel CSS : l’Art et la Science, voici un tutoriel sur l’autre partie importante de mon expérience d’intégrateur : WordPress le Tutoriel.

Je considère mes connaissances comme étant open-source. Et, de peur de les voir perdues à jamais, je préfère les écrire et les faire partager gratuitement avec la communauté des intégrateurs que nous sommes.

Ce tutoriel WordPress vous aidera à créer vous-même votre propre thème WordPress, mais contient aussi un thème WordPress vide gratuit sur lequel vous pouvez vous baser.

Billet

CSS : l’Art & la Science

Il est des connaissances que l’on veut transmettre telles qu’on les ressent. Celle des CSS que j’ai acquise au fil des ans est celle que je souhaite à présent léguer à travers une histoire peu commune mais très ludique.

Que vous soyez novice ou qualifié, l’Art & la Science saura je l’espère vous apporter un savoir mais aussi (et peut-être avant tout) une conception des CSS. Mon intention est de vous faire parvenir la perception clairvoyante d’une compétence vivante et expressive qui saura séduire celui qui l’embrassera.

Billet

Introduction à WordPress 3 : custom post type et custom taxonomy

J’ai écrit un tutoriel complet pour réaliser un thème WordPress de A à Z.
Il est plus récent et parle aussi des Custom Post Type et Custom Taxonomy. Du coup, je vous invite à aller le lire.

WordPress vient d’annoncer une Release Candidate pour la version 3. J’ai pour ma part installé et mis en prod la version Beta 2 qui, ma foi, est très stable. Si vous comptez l’installer, allez-y! Les mises à jour se font comme les WP actuellement, c’est à dire automatiquement. Et le système de template pour les thèmes est identique donc vos thèmes marcheront sans souci! Le seul souci est qu’il n’y a pas de version française encore mais bon, c’est uniquement pour l’admin qui est vraiment très simple en anglais.

Nouveautés WordPress 3

Dans les nouveautés, il y a :

  • choisir son login et son mot de passe : au lieu d’avoir “admin” et un mot de passe généré automatiquement, on peut les choisir soi-même.
  • un nouveau thème par défaut, bourré de nouvelles fonctions et qu’on va customiser dans ce tutoriel
  • custom background : un outil dans l’admin pour pouvoir choisir un fond pour le site. Si vous développez des thèmes vous même, ça vous est inutile.
  • Multi-sites! En fait, WordPress et WordPress µ ont fusionné : il est donc possible avec 1 seule installation WP de mettre en place autant de blogs différents que l’on veut. Par exemple : css.bbxdesign.com pour un blog de CSS, inspiration.bbxdesign.com pour un blog d’inspiration etc.
  • Custom Post Types
  • Custom Taxonomies

Je vais développer ces 2 derniers points car ils sont les plus intéressants.
Lire la suite →

Billet

bbxtut01 = menu 100% CSS vert

Pour un premier tutoriel je vais reprendre celui que j’ai fait pour un autre site ( CSS Only Design ). C’est un menu totalement en CSS, histoire de montrer ce dont les CSS sont capables. Evidemment, il fonctionne sur les 5 principaux navigateurs, à savoir : IE6, IE7, FF, Opera et Safari. Vous pouvez l’utiliser pour votre site si vous le voulez, j’apprécierais cependant un lien vers l’auteur. Voici le résultat obtenu.
Lire la suite →