Le HTML Framework Project se donne pour mission de rassembler les idées des développeurs d’interface utilisateur et des webdesigners pour poser les bases d’une spécification de framework HTML. Le projet s’étalera sur une durée de 18 semaines de réflexion : →
Voici un tutoriel vidéo consacré à la conception d’une page web en XHTML 1.0 strict et en CSS. Créer un site web : codage envoyé par JojoRatonLaveur
Vous pouvez désormais utiliser la syntaxe Markdown dans la zone des commentaires. Cette syntaxe est très facile à utiliser et également très complète, mais tout n’est pas indispensables pour écrire un commentaire. Voici donc les éléments les plus utiles : →
Tiens, ça faisait longtemps que je n’avais pas participé à une chaine de blog. Suite à l’invitation de Darklg à livrer les conventions que j’utilise en programmation, voici mes secrets avec un exemple PHP et CSS à la clé. →
Le framework CSS Blueprint propose une grille par défaut de 950 pixels de large, divisée en 24 colonne de 30 pixels chacune, séparée par une gouttière de 10 pixels. Contruire sa propre grille est assez fastidieux mais Blueprint Generator est là pour vous demander le nombre de colonne, leur largeur, la gouttière qui les sépare ainsi que la largeur totale que vous voulez.
Vous saurez ensuite combien de pixels vous manquent (ou de combien vous dépassez) pour arriver à la bonne largeur. Reste à jouer sur les différentes valeurs pour générer le code CSS qui remplacera les valeurs de grid.css inclus à l’origine dans Blueprint.
Cerise sur le gâteau, une version compressée est proposée, ainsi que l’image grid.png qui sert à afficher la grille de base pour le placement des colonnes lors de la phase de conception.
Suite à mon dernier billet sur les différentes manières d’aborder le balisage HTML d’une hCard, Neovov et burningHat ont soulevé la question de la sur-sémantisation du code d’une manière générale et de la sur-utilisation des listes en particulier. Neovov, par exemple, ne voit pas pourquoi on devrait mettre des listes partout. burninHat quant à lui, se demande si l’on ne n’accorde pas trop d’importance à la description de notre code HTML… Magneto ! →
En lisant ce billet de Frédéric de Villamil sur le compte rendu du troisième WASP café France dans lequel il présente un exemple de structuration du microformat hCard, je n’ai pu m’empêcher d’ajouter mon grain de sel pour remplacer la divite et la spanite par une structure à base de listes imbriquées que je trouve comment dire… plus sémantique… →
Après A comme Allons-y et B comme Bêtise, Je continue à égrener l’alphabet qui me sert de fil conducteur pour la création d’un thème de type magazine, selon la formule consacrée. C comme Cahier des charges parce que si lors de la première étape, j’ai noté quelques idées pour savoir dans quelle direction aller, il est temps de fixer le cap avec la liste des fonctionnalités dont j’ai besoin. Cette phase, indispensable lorsqu’on doit développer les fonctionnalités d’un site from scratch, peut sembler un peu formelle pour un blog, où sauf exception, tout est déjà codé dans le moteur du blog ; il reste néanmoins à déterminer celles que l’on va intégrer, de quelle manière et avec quelles options. →
En général, j’utilise la notation .ma-classe-css pour nommer les classes réutilisables par n’importe quel élément HTML. Cette notation est en fait un raccourci pour *.ma-classe-css où * est utilisé comme joker universel (les tirets ne sont là que pour le référencement).
Me souvenant que le reset * { margin: 0; padding: 0; } n’était pas optimum en terme de performances, je me suis dit que l’utilisation de div.ma-classe-css (en préfixant le nom de la classe avec la balise HTML à laquelle elle s’applique) permettrait certainement au navigateur de parcourir le DOM plus rapidement en raison du nombre réduit d’éléments sur lesquels boucler.
Les hacks CSS, c’est pas bien ; les commentaires conditionnels, c’est mieux. Pour autant, je ne vois pas d’inconvénient à utiliser quelques hacks à l’intérieur d’une feuille de style réservée à Internet Explorer à l’aide des commentaires conditionnels. En effet, pourquoi ajouter une requête inutile en ciblant chaque version de IE quand on peut régler le problème une fois pour toute ? →
