La syntaxe BEM, pour “Block Element Modifier”, est une convention de nommage CSS qui permet de structurer, hiérachiser implicitement les éléments nommés. Je l’ai découverte il y a quelques mois maintenant – à travers un plugin CSS, et j’avoue que j’ai été charmé tout de suite par le concept, sans toutefois m’y intéresser plus avant. L’ayant recroisé...
La fonction calc() en CSS 3
Parmi les apports des nouvelles spécifications CSS on retrouve la fonction calc(), qui va apporter de (très) belles simplifications dans la résolution de cas pratiques. Pour l’instant, elle est supportée par les navigateurs récents pour la plupart des mises en application qu’on peut en faire. Cette fonction est actuellement au stade de recommandation candidate Cet article est un bref résumé, si...
Système d’auto-complétion avec AJAX
L’expérience utilisateur est chaque jour rendue plus fluide et plus conviviale, particulièrement grâce à l’apport de JavaScript. De nombreux sites proposent par exemple un système d’auto-complétion sur leurs champs de recherche. C’est ce procédé d’auto-complétion que je vous propose de décortiquer pas à pas en développant un champ de recherche des grandes villes du...
Get Webplate : framework front-end
On ne compte plus les frameworks CSS qui permettent tout et n’importe quoi, j’en relève au moins 5 nouveaux par mois, tous plus ou moins bien fichus. De fait, j’ai pris le parti de ne partager que ceux chez qui j’ai trouvé un réel intérêt. C’est ainsi qu’il y a quelques temps, je vous parlais de Pure CSS ou encore KnaCSS, deux bons outils pour designer web...
KnaCSS, mini-framework CSS léger et puissant
Knacss est un concentré d’essentiel d’essence de CSS 3. Si, si. Plus techniquement, il s’agit d’un framework CSS qui implémente pas mal de fonctionnalités intéressantes pour un poids qui reste très léger, variable en fonction des modules que vous décidez d’utiliser. Alors, KnaCSS, c’est quoi ? Juste un framework de plus dans l’immensité frameworkienne...
Pure CSS, un framework CSS responsive simple et efficace
Pure.css est un framework responsive développé par Yahoo!. A l’instar de frameworks bien trempés comme Foundation, Unsemantic, Skeletton ou encore Yaml, avec Pure, vous pourrez ajouter des fonctionnalités responsives à vos projets web, sans aucun ajout de Javascript/jQuery. L’ensemble de 5 modules (base, grilles, formulaires, boutons, tableaux et menus) peut être utilisé conjointement...
Hint.css : tooltips 100% CSS
Les tooltips et autres effets de rendu visuels sont à la mode. Anciennement, on passait par Javascript pour obtenir ce type d’effet. Aujourd’hui, CSS 3 réduit peu à peu la frontière avec l’interaction client. Démonstration avec la librairie hint.css. Avec CSS3, les possibilités d’intégration se font plus nombreuses et il est dorénavant assez facile d’obtenir des...
Medias Queries et navigation nomade
Web mobile et responsive design : retour rapide sur l’utilisation des medias queries. Techniques CSS 3 pour les navigateurs mobiles. Le sujet de la navigation nomade mériterait un ouvrage à lui seul, inutile donc de réinventer la roue ni de développer un article en long en large et en diagonale sur tout ce qu’il est possible de mettre en place pour faire en sorte qu’un site...
CSS3 et backgrounds multiples
CSS3 apporte son lot de nouveautés qui changent la donne en offrant de nombreuses possibilités d’intégration. Parmi ces nouveautés, on trouve la possibilité d’afficher plusieurs images d’arrière-plan à un même élément. Le résultat obtenu est similaire à ce que peut produire un logiciel graphique ayant recours au système de calques : la première image déclarée dans la liste sera...