Tous les articles dans HTML, CSS & SVG

Cours d’Initiation HTML et CSS – Apprendre les bases du langage pour créer des sites web

Cours d’Initiation HTML et CSS – Apprendre les bases du langage pour créer des sites web

Il y a 5 ans je proposais le PDF de mon cours de HTML/CSS. Il n’est plus vraiment à jours sur la partie CSS (pas de flexbox ni de grid layout). A la place je vous proposer plusieurs ressources pour apprendre le HTML/CSS, gratuitement, en ligne et en français.

Un menu Responsive et Retina-Friendly sur Codrops

Un menu Responsive et Retina-Friendly sur Codrops

Ce contenu a été rédigé il y a 10 ans. Il se peut qu’il ne soit plus à jour.Pour mon dernier article sur Codrops, j’ai voulu jouer avec les font-icons et les media-queries pour créer un menu responsive qui s’adapte aux tailles d’appareil et de navigateur. Les couleurs sont inspirées des armes Maliwan de Borderlands et le menu proposé a 3 différentes mises en pages : une navigation en  blocs en ligne avec une animation de box-shadow sur les différentes …

[A lire] « L’intégration web, cette leçon d’humilité » par Marie Guillaumet

[A lire] « L’intégration web, cette leçon d’humilité » par Marie Guillaumet

Ce contenu a été rédigé il y a 10 ans. Il se peut qu’il ne soit plus à jour.Un superbe article et une leçon d’humilité par Marie Guillaumet qui nous parle du métier d’intégrateur aujourd’hui, avec tous nos doutes et nos incertitudes. Pas de réponse figée, de moins en moins de certitude dans nos métiers et un besoin de remise en question quotidien et d’humilité. La meilleure réponse que l’on puisse aujourd’hui généralement donner à nos collègues et nos client est …

[mobile] Charger des ressources de manière conditionnelle avec matchMedia()

[mobile] Charger des ressources de manière conditionnelle avec matchMedia()

Ce contenu a été rédigé il y a 10 ans. Il se peut qu’il ne soit plus à jour.A ParisWeb, suite à une réflexion de Vitaly Friedman sur les ressources chargée en web et  mobile first, nous avions avec Raphaël Goetter fait quelques tests de chargement conditionnel, notamment pour ne pas charger du tout une police @font-face sur la version mobile. Ces tests se basent sur window.matchMedia(). Christian Heilmann dans son article (en anglais) « Conditional loading of resources with mediaqueries » pousse cette méthode encore …

Sur Codrops : formulaire de login et sign up  en HTML5 et CSS3

Sur Codrops : formulaire de login et sign up en HTML5 et CSS3

Ce contenu a été rédigé il y a 11 ans. Il se peut qu’il ne soit plus à jour.La pseudo classe CSS3 :target permet d’utiliser des propriétés CSS en fonction de l’ancre ciblée avec un < a href = « #monancre » > . J’ai donc utilisé cette propriété, accompagnée de quelques transitions CSS3 et animations pour créer une démonstration de double formulaire de login / souscription en pure CSS3 et HTML5. Le principe est assez simple : deux formulaires, on propose …

Sur Noupe : tutoriel jQuery Mobile création d’une application web de choix de restaurant

Sur Noupe : tutoriel jQuery Mobile création d’une application web de choix de restaurant

Ce contenu a été rédigé il y a 11 ans. Il se peut qu’il ne soit plus à jour.Noupe m’a demandé d’écrire pour eux au moment où je préparais mes cours pour les étudiants du Master2 Caweb qui portaient sur la mobilité et jQuery Mobile. J’ai donc décidé de reprendre un des exercices proposés durant ce cours, de l’améliorer un peu, pour le publier sous forme de tutoriel sur Noupe. La démo est une mini web-application créée en utilisant jQuery …

Formulaire de contact pur css3 html5 sans images

Formulaire de contact pur css3 html5 sans images

Ce contenu a été rédigé il y a 11 ans. Il se peut qu’il ne soit plus à jour.J’avais envie de m’amuser avec les nouvelles fonctionnalités des formulaires html5 et les gradients css3, et l’idée qui m’est venue est est assez simple : créer un formulaire pure html5 Css3 sans utiliser une seule image. Voici le résultat, que vous pouvez voir dans une démo live ici. Attention, ce formulaire utilisant des techniques de css3 et html5 pas encore répandues dans …