Google Doctype est une encyclopédie ouverte (wiki) écrite par des développeurs web pour des développeurs web. Google Doctype contient des articles sur la sécurité sur le web, la manipulation du DOM en Javascript, des trucs et astuces CSS. Une section présente les balises HTML avec leur compatibilité inter-navigateur.
Après Francis Chouquet et Amaury Balmer qui nous ont gâté avec leur DVD de formation WordPress, c’est au tour de Florent Verschelde de commettre un DVD de formation sur XHTML et CSS :
> Adoptez les bons réflexes pour concevoir des sites Web actuels et créatifs ! Cette formation animée par Florent Verschelde est conçue pour répondre à vos besoins quel que soit votre niveau. Débutants, découvrez toutes les bases grâce à de nombreux exercices pratiques et liens utiles fournis. Vous êtes de niveau intermédiaire, trouvez toutes les clefs nécessaires pour implémenter vos designs et concevoir des pages conformes aux standards du Web (W3C) en mettant à profit les richesses des feuilles de styles CSS. Des gabarits présentés avec Alsacreations.com vous permettront de trouver de nouvelles bases solides pour enrichir vos projets.
Florent Verschelde lance le projet de rédiger un guide stylistique (charte rédactionnelle ou conventions de codage) pour les langages HTML et surtout CSS sous l’égide d’Alsacreations. Une description de ce projet est disponible dans ce document. Voici ma modeste contribution à cette première étape du projet qui consiste en deux séries de questions pour sonder les professionnels du web sur leurs habitudes de travail en matière de mise en forme du code. →
Vous le savez certainement, les fichiers Javascript ou CSS sont placés dans le cache du navigateur pour être réutilisés sans devoir aller chercher les mêmes informations sur le serveur. C’est assez pratique car les fichiers en question ne sont téléchargés qu’une fois. Mais si vous modifiez ces fichiers après la mise en ligne, c’est la version placée en cache qui continuera de s’afficher jusqu’à ce que l’utilisateur vide son cache d’une façon ou d’une autre.
Pour y remédier, Damien Ravé nous propose une utilisation judicieuse de la fonction PHP filemtime() qui renvoie la date de la dernière modification d’un fichier pour recharger le cache CSS ou JS :
<script type="text/javascript" src="js/script.js?v=<?php echo filemtime('js/script.js'); ?>">
<link rel="stylesheet" type="text/css" href="css/ecran.css?v=<?php echo filemtime('css/ecran.css'); ?>">Après la présentation du script PNGHack, voici une nouvelle présentation de Yves Van Goethem concernant l’organisation et l’optimisation de nos chères feuilles de style CSS : application des conventions de développement à l’écriture des CSS ; structuration des CSS selon la complexité des documents à styler et pour terminer, une bonne dose de bonnes pratiques !
Le format PNG autorise jusqu’à 256 niveaux de transparence qui ne sont pas pris en charge par Internet Explorer 6. La dégradation grâcieuse n’étant pas toujours possible, je me suis rafraichis la mémoire sur les différentes manières d’utiliser le filtre *AlphaImageLoader*. J’ai fini par tomber sur une solution globale pour gérer cette transparence même en présence d’un *background-repeat* ou d’un *background-position* ! (Cet article est en quelque sorte la suite de Opacité CSS et effet de trame avec GIF/PNG transparent.) →
Lorsqu’on donne une hauteur height à un champ input, il arrive que le texte saisi à l’intérieur ne s’aligne pas correctement avec la base du texte présent dans le label. Dans ce cas, je diminue la hauteur et je distribue un soupçon de padding en haut et/ou en bas selon l’alignement souhaité. →
Les bonnes pratiques de développement web font leur chemin et l’intégrateur web prend l’habitude de séparer le fond (code HTML) de la forme (feuille de style CSS et Javascript) dans des fichiers distincts pour une saine séparation des pouvoirs et une maintenance aisée. Malgré tout, quand je regarde mes feuilles de styles, je trouve une palanquée de valeurs redondantes ou dépendantes d’autres valeurs. En attendant qu’une prochaine génération de CSS gère les variables, voici plusieurs manières d’ajouter du code PHP dans vos fichiers CSS. →
Yves Van Goethem annonce la création du groupe de discussion webdevfr sur Google Groups pour rassembler les professionnels francophones du développement web afin qu’ils échangent en toute simplicité.
Je vous ai rapidement parlé de The HTML Framework Project qui propose de réfléchir ensemble à la mise en place d’un environnement de travail pour rendre le démarrage d’un projet de site web moins ennuyeux. Le projet en est à la phase 1.1 : définir. Il est évident que produire un bon code HTML est un métier, un art qui peut difficilement se faire comme on élève des poules en batteries. Pour autant, il doit être possible de dégager parmi les bonnes pratiques de travail, quelques concepts récurrents que l’on pourrait utiliser au démarrage d’un projet. →