RESPONSIVE WEB DESIGN Mixte : présentiel / à distance
Dernière mise à jour : 04/03/2026
Vous souhaitez optimiser l'affichage de vos sites sur tous les supports ? Inscrivez-vous dès maintenant !
M'inscrire à la formation
Public visé
- Web développeurs, Web designers, graphistes.
Prérequis
- Posséder les connaissances et compétences en langages HTML et CSS.
Objectifs de la formation
A l'issue de cette formation, l'apprenant sera capable de :
- Optimiser l'affichage des sites Internet pour tous supports (Smartphones, tablettes, PC).
Contenu de la formation
Jour 1 – Matin
Introduction
- Le Responsive Web design d'Ethan Marcotte
- Règles de colorimétrie adaptée aux terminaux
- Technologie Mobile First
- Penser grilles fluides
- Les différents terminaux
- Navigateurs PC, Smartphone, Tablettes
Â
Les tailles d'écran d'un mobile
- Les résolutions des principaux mobiles
- Taille réelle ou taille en pixels CSS ?
- Screen-width ou device-width
- Comment définir les points de rupture ?
- Le Viewport d'Apple !
- Initial-scale maximum-scale
- La recommandation W3C @viewport CSS
Â
Jour 1 – Après-midi
HTML5 - CSS3
- La nouvelle sémantique HTML5
- Compatibilité avec IE - Hack
- Compatibilité avec les anciens navigateurs
- Les nouveaux éléments
- Les nouvelles propriétés CSS3 (ombres, transitions, coins, bordures, dégradés)
Â
Jour 2 – Matin
Grilles Fluides :
- Unités de mesure : % em pixel !
- Mise en page avec les colonnesLes propriétés
- CSS3 des grilles fluides : position - float - clear - width - max-width - overflow
- Optimiser la taille et la résolution des images
Â
Média Queries CSS3
- Ajouter des conditions avec Media Queries
- Les critères pour mobiles (width, height, device-width, orientation, etc.)
- Compatibilité Media Queries IE - Hack
- Faire disparaître ou apparaître des éléments en fonction des points de bascule
- Gérer la taille de police
- Gérer les contrastes
Â
Jour 2 – Après-midi
Bibliothèques JavaScript
- Modernizr :
- Dépister les éléments non pris en charge par les navigateurs (HTML5, CSS3, MQ, Tactile …)
- Responsive avec Modernizr
- JQuery :
- Les composants UI
- JQuery responsive
Â
Concepteur : ENI SERVICE – Diffuseur : Groupe ARKESYS
Compétences acquises à l'issue de la formation
- Optimiser l'affichage des sites internet pour tous supports (Smartphones, tablettes, PC)
Modalités pédagogiques
- Explications théoriques suivies de pratiques guidées puis de mises en autonomie.
- Exercices autonomes et réguliers pour assurer l'assimilation
Moyens et supports pédagogiques
Votre formation a lieu en présentiel :
- 1 vidéoprojecteur par salle
- 1 ordinateur
Â
Votre formation se déroule à distance avec :
- 1 ordinateur
- 1 connexion Internet
- 1 adresse e-mail valide
- 1 équipement audio (micro et enceintes ou casque)
- 1 Webcam (facultatif – dans l'idéal)
- 1 deuxième écran (facultatif – dans l'idéal)
Â
Votre formation se déroule sur notre plate-forme de formation avec :
- 1 ordinateur
- 1 connexion Internet
- 1 adresse e-mail valide
- 1 équipement audio (micro et enceintes ou casque - facultatif)
Â
Support stagiaire :
À l'issue de la formation, les exercices et travaux pratiques réalisés, leurs corrigés ainsi qu'un support de cours dématérialisé sera fourni à chaque stagiaire par e-mail ou via la plate-forme FOAD.
Modalités d'évaluation et de suivi
L'acquisition des compétences de la formation se fait à travers le suivi du formateur tout au long de la formation (séquences synchrones et asynchrones). Elle s'appuie également sur la réalisation d'exercices et de TP. Enfin, des quiz s'ajoutent aux différents outils de validation de l'acquisition des compétences visées. Une évaluation est systématiquement réalisée par chaque stagiaire, à l'issue de la formation.
Profil du formateur
Nos formateurs sont certifiés à l'issue d'un parcours organisé par nos soins. Ils bénéficient d'un suivi de maintien et d'évolution de leurs compétences aussi bien au niveau technique que pédagogique.
Chacun de nos formateurs a bénéficié d'une formation spécifique à l'animation de classe virtuelle et à l'utilisation des solutions de formation à distance du Groupe ARKESYS.
Chacun de nos formateurs a bénéficié d'une formation spécifique à l'animation de classe virtuelle et à l'utilisation des solutions de formation à distance du Groupe ARKESYS.
Informations sur l'accessibilité
Cette formation est accessible à toute personne en situation de handicap. Notre référent handicap prendra contact avec les stagiaires concernés pour adapter l'animation à leurs besoins et rendre l'apprentissage accessible à tous. Enfin, nos centres de formation sont accessibles aux personnes à mobilité réduite.