Css Sans Stress — Auto-formation HTML & CSS avec les Frameworks CSS

Rigueur. Et passion !

Ne dites pas à ma mère que je suis artisan en architecture de l'information appliquée aux sites web : elle croit que je suis webdesigner, intégrateur HTML & CSS, rédacteur web, formateur NTIC et consultant en webmarketing depuis 2001 ! Voulez-vous en savoir plus ?

Le blog de l'intégrateur web

Css Sans Stress — Auto-formation HTML & CSS avec les Frameworks CSS

Les langages du web comme HTML et CSS sont structurés autour de concepts qui n’ont pas forcément de rapport avec la manière dont ils seront utilisés. Les concepteurs ne sont pas les auteurs ; il appartient à ces derniers de tâtonner puis d’en parler avec leurs voisins pour connaitre les bonnes pratiques du jour. Les spécifications sont très utiles pour comprendre la nature des balises HTML et des propriétés CSS mais ne suffisent pas pour réaliser un site Internet. Et pour cause : il n’existe pas de recette toute faite. Les ingrédients (les contenus) sont uniques et demandent un traitement graphique et un marquage HTML particulier.

Toutefois, on ne peut pas ne pas constater que les sites Web partagent dans leur grande majorité les éléments suivants :

  1. En-tête de page (header),
  2. Une ou plusieurs barres latérales (aside),
  3. Zone de contenu (article) à droite, à gauche ou au milieu,
  4. Pied de page (footer) généralement situé en bas de page.

La plupart des tutoriels que l’on trouve sur le web reprennent un découpage par thématique : après les bases concernant l’insertion de la balise style, on attaque généralement par la mise en forme du texte, les listes, les images, les bordures, le modèle de boite, le positionnement, etc. C’est le découpage proposé par les spécifications du W3C et la majorité des tutoriels CSS qui permet de retrouver rapidement une propriété. Il s’agit avant tout de servir de référence… mais a-t-on jamais appris à rédiger des phrases avec un dictionnaire ?

J’évoque souvent le potentiel didactique des frameworks CSS :

  • Le Reset CSS (reset.css) permet de faire le point sur les balises HTML les plus utilisées,
  • Le fichier typographie (typography.css) redéfinit le comportement des balises et permet d’acquérir un solide vocabulaire CSS,
  • Le système de grille (grid.css) propose les éléments fondamentaux du positionnement en quelques déclarations,
  • La prise en compte des derniers de la classe (ie6, ie7 et bientôt IE8) permet d’aborder la notion de compatibilité cross-browser.

→ Lectures complémentaires conseillées :

A côté des frameworks on trouve un grand nombre de proposition de feuilles de style prenant en compte une grande partie des balises HTML sans pour autant inciter à l’utilisation d’un reset CSS ou d’un système de grille de mise en pages. Ces feuilles de style de base ont souvent été longuement pensées par leur auteur et les choix effectués nous éclairent sur les subtilités des CSS.

→ Parmi les «kits de démarrage» existants, je trouve souvent mon bonheur dans :

L’idéal étant bien sûr de prendre ça et là ce dont on a besoin pour se constituer son propre fichier CSS tout terrain !

Articles sur le même sujet

PS : Le respect de la vie privée sur internet est important : j'ai décidé d'échanger mon bouton Like de Facebook par un bouton Faire un don de Paypal car
Il n'y pas d'amour, il n'y a que des preuves d'amour (Jean Cocteau) ;) Merci d'avance.



6 commentaires pour “Css Sans Stress — Auto-formation HTML & CSS avec les Frameworks CSS”

  1. Briegel02 dit :

    Salut,

    Je vais faire le mec chiant, mais la balise qui contient le contenu (tiens, j’ai cru voir Lapalisse), ne peut pas être la balise article, qui sémantiquement, se définit comme suit : « The tag specifies independent, self-contained content. An article should make sense on its own and it should be possible to distribute it independently from the rest of the site. » (w3c).

    J’ai aussitôt vérifié s’il n’existait pas une alternative crédible, mais la plus sensée reste une triste

    <

    div id= »content »>. Autant dire rien !

    Je ne sais pas pourquoi avoir laissé un tel trou au milieu d’un océan de sémantique, mais les voies du w3c sont décidément impénétrables…

  2. [...] Ne dites pas à ma mère que je suis artisan en architecture de l'information appliquée aux sites web : elle croit que je suis webdesigner, intégrateur HTML & CSS, rédacteur web, formateur NTIC et consultant en webmarketing depuis 2001 ! Voulez-vous en savoir plus ? Css Sans Stress — Auto-formation HTML & CSS avec les Frameworks CSS [...]

  3. savoir plus dit :

    La plupart des tutoriels que l’on trouve sur le nike free run web reprennent un découpage par thématique

  4. cross-browser dit :

    Cela m’est bien utile, juste avant de me jeter à l’eau à mon tour y nike air max compris organisationnels

  5. plombier dit :

    se définit comme suit : « The tag specifies independent, self-contained content. http://www.plombier-chauffagiste-besancon.fr Ne dites pas à ma mère que je suis artisan en architecture de l’information appliquée aux sites web : elle croit que je suis webdesigner,

  6. elle croit que je suis webdesigner, intégrateur HTML & CSS, rédacteur web, formateur NTIC et consultant en webmarketing depuis 2001 ! http://www.backtothetrees.fr Voulez-vous en savoir plus

Laissez un commentaire

Vous pouvez utiliser les balises HTML suivantes : <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Les commentaires sont publiés sous votre pleine et entière responsabilité et ne doivent pas contrevenir aux lois et règlementations en vigueur. Les propos racistes ou antisémites, diffamatoire ou injurieux, divulguant des informations fausses, relatives à la vie privée d'une personne ou utilisant des oeuvres protégées par les droits d'auteurs ne sont pas les bienvenus et seront modérés sans modération.

Merci d'être constructif et n'oubliez pas : « sans la liberté de ramer il n'est point d'éloge flotteur ! »



Colophon

CSS & Webdesign est une publication irrégulomadaire à tendance hebdomadaire
éditée par Bruno Bichet qui carbure à WordPress et au café équitable.
Tous droits réservés © 2006 - 2011.

Contactez l'auteur du site