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. →
jQuery Masked Input — Masque de saisie pour les champs input
jQuery Masked Input Plugin est un script qui devrait vous servir un jour ou l’autre : il crée des masque de saisie sur les champs de formulaires. Très utile pour limiter la saisie à des chiffres ordonnés d’une certaine manière comme (___) ___-____ x_____
par exemple.
Masked Input est disponible sur Github.
Via @SebastienMenu o/
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. →