Check your <body> avec le W3C

Suite à l’arrivée W3C mobileOK Checker sur mon écran radar (merci @flashxman), je me suis dit qu’il pourrait être utile de faire une liste des outils proposés par le W3C pour vérifier la conformité de nos sites web par rapport aux standards, aux bonnes pratiques ou aux performances web. D’une manière générale, ces outils œuvrent pour l’amélioration de la qualité web.

10 principes de design pour les sites du gouvernement anglais

Le gouvernement de Sa Majesté a produit, après un long congrès sur la question, le document Government Digital Service Design Principles — actuellement en version bêta — pour expliciter les principes qui devraient régir la conception des services en ligne en direction du public. Il ne s’agit pas de règles à prendre au pied de la lettre ni d’une liste des mauvaises pratiques à éviter. Il s’agit simplement d’un ensemble de 10 recommandations accompagnées d’exemples d’application pour inspirer les éditeurs de sites et les inciter à mieux travailler pour les citoyens.

SMACSS — Architecture évolutive et modulaire pour CSS

Il n’existe pas de méthode universelle pour faire un site web. Tout au plus peut-on dégager de la pratique quelques principes de conception pour organiser le code HTML et CSS d’un projet à l’autre. Dans cette optique, Jonathan Snook (@snookca) nous fait profiter de son expérience avec SMACSS. Vous l’aurez compris, SMACSS fait la part belle aux règles CSS que l’auteur a divisé en quatre parties : base, maquette (structure), module et état. Cet article est un bref aperçu de la première partie du livre pour vous donner l’eau à la bouche.

Moodular — Fabrique de Carousel avec jQuery

Moodular — Ce plugin jQuery créé par @GouZ permet de créer des carousels (aussi appelés : diaporama ou slider) très facilement. Le nom du script est la contraction de mood (humeur, ambiance) et de modular (modulaire) : tout un programme ! Moodular est composé de nombreuses options que vous pouvez activer depuis la page du site via un formulaire. Il est également possible de créer vos propres effets.

Le petit journal du web : PHP, WordPress, Javascript, CSS, Ruby, Responsive Webdesign

Au menu de ce petit journal du web de Pâques : un mini framework pour gérer les fonctions CRUD en PHP avec un système de pagination en prime, un article pour mieux gérer le chargement des ressources Javascript ou CSS selon le contexte dans WordPress, une série de site sur HTML5 / Javascript / PHP et Ruby à garder sous la souris, un framework HTML / CSS / Javascript qui risque de faire de l’ombre à Bootstrap, from Twitter, un guide stylistique généraliste qui servira en toute occasion, une réflexion sur la navigation dans un contexte mobile avec le Responsive Webdesign, etc.

Framework HTML : Bootstrap, Fondation et HTML5 Boilerplate

Dans la catégorie des frameworks HTML permettant de faciliter la mise en place d’un projet web, Bootstrap, from Twitter s’est rapidement fait une place de choix à côté de HTML5 Boilerplate et de Zurb Fondation. (Je ne parle pas de Blueprint, 960.gs ou de 940.css version fixe ou fluide qui sont plutôt des frameworks CSS pour aligner des blocs sur une grille de mise en page.) Mais au fait, c’est quoi un framework HTML ? Un tel outil devrait inclure une structure de fichiers normalisée, quelques trucs pour mettre les navigateurs au garde-à-vous et des fichiers HTML servant de fondations pour des projets différents.

DyLay — Tri et maquette dynamiques avec jQuery

DyLay est un plugin jQuery de 1ko seulement créé par Sylvain Gougouzian (@GouZ) dont les fonctionnalités risquent de vous ébouriffer les yeux. DyLay permet de créer des maquettes dynamiques selon les actions de l’utilisateur. Il est possible d’animer la réorganisation de blocs de contenus selon des critères de tris avec les méthodes position, filter, sort et reverse.

940.css version fluide — Grille de mise en page en pourcentage

La grille de mise en page 940.css — issue de la technique Calculer une grille de mise en page « typo » avec le nombre d’Or — existe désormais en version fluide avec des valeurs exprimées en pourcentage à la place des pixels. J’ai choisi des pourcentages permettant d’utiliser la grille de 940.css «version fixe» lorsque le .container est réglé sur 940px. Ceci permet de caler les blocs sur la grille fixe placée en background et de remettre une valeur en pourcentage sur le container lorsque la mise en page est terminée.

Bacon : alignement de texte «exotique» avec jQuery

Bacon est un plugin jQuery qui offre de nouvelles possibilités d’alignement de texte en dehors du centrage ou de l’alignement en drapeau à droite ou à gauche. Il s’agit de mettre les techniques d’habillages de texte par une forme que l’on rencontre dans les magazines papier dans une page web.