Responsive Design

1. La formation en résumé
La formation "Responsive Design" vise à fournir une compréhension approfondie du Web mobile actuel, en abordant les standards, systèmes, navigateurs et les enjeux spécifiques liés à la mobilité. Elle propose une découverte complète des techniques concrètes pour adapter un design aux terminaux nomades modernes tout en optimisant les performances et les temps d’affichage. Son plus réside dans l’approche pratique et technique qui permet aux participants de maîtriser les méthodes de design fluide et responsive adaptées aux diverses contraintes du Web mobile.

2. Les thèmes abordés
- État des lieux du Web mobile : périphériques, systèmes d’exploitation, navigateurs, moteurs et langages, marché mobile et statistiques, fragmentation Android.
- Techniques de design fluide : typographie fluide (unités em et rem), design fluide et élastique (float, BFC, table-cell, calc(), Flexbox), unités de viewport (vw, vh, vmin, vmax), box-sizing, CSS3 Flexbox et grilles fluides (Bootstrap, CSS3 Grid Layout).
- Gestion d’un contenu fluide : maîtrise des débordements de contenus (césures, coupures) et médias (images, vidéos, flash).
- CSS3 Media Queries : utilisation des médias en CSS, ajout de conditions, critères spécifiques pour mobiles, cumul de critères, compatibilité et prise en compte de l’orientation, repenser le design pour petits écrans.
- Compréhension des tailles des devices mobiles : pixels réels et virtuels, viewport, screen-width, device-width, pixel-ratio, forçage du viewport en HTML et CSS, choix des breakpoints.
- Performances et Web mobile : méthodes de test et astuces spécifiques (sprites, SVG, font-icon, polices, animations, boutons sociaux).
- Navigation responsive : structure HTML, déclencheurs CSS/JavaScript/jQuery, gestion des boutons et événements.
- Images responsive : images fluides, images de décoration (cover, image-set()), images de contenu (srcset,