Une hirondelle ne fait pas le printemps parait-il, mais la sortie de HTML5 Boilerplate en version finale 1.0 pourrait bien redonner le sourire et réchauffer le cœur des intégrateurs HTML & CSS et des développeurs web à l’affut des bonnes pratiques. HTML5 Boilerplate est un concentré des meilleurs techniques du moment : classes CSS conditionnelles pour IE6, IE7 et IE8 ; Javascript (jQuery) ; configuration de différents serveurs (.htaccess, web.config, nginx.conf) ; prise en compte des mobiles (Handheld) ; HTML5 et CSS3 (Modernizr ou html5shiv) ; Google Analytics. Grosse cerise sur le gâteau, tout est optionnel et configurable via à un générateur en ligne. →
Créer son site web avec WordPress de A à Z… avec le Codex
La saga Créer son site web avec WordPress de A à Z… avec le Codex — et quelques ressources supplémentaires, ne boudons pas notre plaisir –, débutera avec «A, comme : Allons-y !» et se terminera avec «Z, comme Z’ai fini !». Cet article est un prologue, un galop d’essai, qui me permets de présenter rapidement les ressources essentielles concernant WordPress. Lors de la création d’un site (ou d’un blog, soyons fou !) avec WordPress, il m’arrive souvent de chercher des informations en dehors du Codex. Or, sept fois sur dix, le Codex propose la même chose, souvent en mieux. C’est une véritable mine d’information qu’il est profitable de consulter en première intention avant d’aller voir ailleurs si le code est plus vert. A ce propos, de nombreuses ressources ne font que reprendre le Codex avec plus ou moins de bonheur, alors autant puiser la connaissance directement à la source. Voici le sommaire complet des 26 articles de WordPress de A à Z. →
Mise en page typographique avec CSS3 et Lettering.js
Ce tutoriel écrit par Nikola Lazarevic montre comment mettre en forme un texte de type «article» à l’aide de CSS3 et de Lettering.js. L’auteur nous prend par la main et détaille chaque étape : reset.css, styles de base, typographie avec Font-face, mise en forme des paragraphes. Le tout saupoudré d’une pincée de box-shadow et d’une segmentation des mots composant les titres à l’aide de Javascript pour débrider notre créativité en jouant sur les mots. →
PHPCrossRef — Bibliothèques de référence pour projets PHP Open source
PHPCrossRef est un véritable carrefour des références des variables, des fonctions, des classes et des constantes utilisées dans les projets Open Source réalisé avec PHP. A ce jour, quatre CMS dont Drupal, Joomla!, Textpattern et WordPress ainsi qu’un framework PHP avec Zend Framework sont disponibles. L’idée est de permettre de naviguer parmi les fichiers sources. Un clic sur chaque élément référencé redirige vers la liste des fichiers qui l’utilise. →
CSS Warp — Aligner du texte le long d’un tracé irrégulier avec CSS3
CSS WARP est un générateur CSS3 conçu par Eleqtriq dont les expérimentations font reculer d’un cran les limites du monde réel. En effet, CSSWARP permet d’afficher du texte le long d’une forme vectorielle irrégulière (courbe de bézier, cercle) avec la possibilité d’ajouter des points d’ancrage pour modifier le tracé, à la manière d’Illustrator. →
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. →
yepnope.js — Chargement conditionnel de scripts pour vos « Polyfills »
yepnope.js permet de charger un script de manière asynchrone selon qu’une fonctionnalité est disponible ou non dans le but de ne charger que l’essentiel. C’est le compagnon idéal de Modernizr qui se charge de détecter les fonctionnalités en question (cf. Modernizr — Détection des fonctionnalités CSS3 et HTML5). Un Polyfills est une fonction (généralement en Javascript) qui émule une fonctionnalité pour les navigateurs ne la prenant pas en charge (cf. What is a Polyfill?). Grâce à Modernizr et yepnope.js il est possible d’utiliser les fonctionnalités HTML5 et CSS3 en première intention tout en ménageant une porte de sortie pour les navigateurs plus anciens. →
Un diaporama pleine-page avec jQuery
Full background image slider est un script qui permet d’afficher un diaporama occupant toute la fenêtre du navigateur (ou le container que vous voulez). Outre le changement de background de votre site — ce qui pourrait s’avérer fatiguant pour les yeux –, ce script pourra se rendre utile pour présenter des visuels sur une page séparée. →
CSS3 pour les web designers : voyez grand, codez petit !
Dans la nouvelle collection A Book Apart lancée par les éditions Eyrolles, je demande CSS3 pour les web designers. Cet ouvrage — écrit par Dan Cederholm et préfacé par Jeffrey Zeldman — paru aux éditions Eyrolles fait partie « des livres de ceux qui font le web ». La concision et la précision qui font partie des préoccupations quotidiennes des professionnels du web est la marque de fabrique de cette collection de petits livres. →
Minify — Accélérez l’affichage des pages en réduisant le nombre de requêtes HTTP
Minify est un script PHP5 dont l’objectif est d’aider les webmasters à atteindre un des objectifs les plus importants des règles de hautes performances pour les sites web proposées par Yahoo! : diminuer le nombre de requêtes HTTP. Pour y parvenir, Minify combine (concatène) les fichiers CSS ou Javascript. En prime, il supprime les commentaires et les espaces en trop. Minify se charge même de l’encodage gzip tout en envoyant les bons en-têtes (headers) au navigateur. →