Formation collective "Maîtriser le Responsive Web Design"

Journée 1

1. Panorama du web Mobile

• Les différents types de terminaux
• Evolution navigateurs, os, technologique
• Les chiffres clés du marché
• Lexique : périphériques, OS, navigateurs
• Fréquences et usages de l'internet mobile
• L'approche contenu / contenant
• Les standards actuels (HTML5, CSS3)
• Différence entre résolution et taille d'affichage
• Différence entre viewport et screen

Synthèse : panorama complet du web mobile

PAUSE (15min) 11h - 11h15

2. Définitions du Responsive Web Design

• Définition du RWD
• Les impacts sur le web design classique
• Expérience Utilisateur (UX) & Interface Utilisateur (UI)
• Rapprochement mobile-desktop : vers un seul développement ?
• Les contraintes ergonomiques et fonctionnelles

Synthèse : l'UX Design au service de la conception responsive

DEJEUNER (1H) 12h30 / 13H - 14h00

3. Les principes fondamentaux du RWD

• La notion de points de rupture « breakpoints »
• Définition
• Ou se situent les points de rupture ?
• La notion de Mobile First
• Définition
• « Progressive enhancement »
• Les méthodes de développement
• Optimiser la performance de chargement
• Requêtes et chargements superflus
• Bande passante et bonnes pratiques

Atelier : créer un wireframe responsive

PAUSE (15min) 16h - 16h15

4. Créer une grille d'affichage flexible 

• Grille fixe en pixels
• Grille flexible en pourcentage
• Les unités de mesures fluides (% et em)
• La formule cible / contexte = résultat
• Box layout avec CSS3

Atelier : réaliser un affichage en grille flexible



Conclusion 

• Questions / réponses