Un formateur RWD pour vos missions en entreprises : comprendre le viewport et les medias queries, créer une mise en page flexible avec CSS3 et les frameworks

Mon support de cours formateur :

1 - Comprendre les enjeux du RWD

Panorama et diversité des terminaux, compatibilité des navigateurs, référencement Google

2 - Caractériser un site responsive

Flux du web, flexibilité des blocs, navigation, lisibilité, espaces vides, menus toogle et off-canvas, contrôles

3 - Comprendre le Viewport

Surface réelle et surface "pixel CSS" des mobiles. Interfaces haute résolution "retina". Balise meta viewport

4 - Utiliser les outils du responsive

Interfaces de vérification et d'affichage en ligne, inspecteurs des navigateurs (Firefox, Chrome)

5 - Exploiter les CSS medias queries

Syntaxe CSS, points de rupture smartphone, tablettes et bureau. Optimisation grâce au Mobile first

6 - Afficher les médias pour le RWD

Flexibilité des images, démultiplication des images avec HTML5, flexibilité des iframe intégrées (Youtube...)

7 - Optimiser avec la technologie RESS

Détection du terminal, outils JS et PHP, redirection URL

8 - Utiliser les grilles et les frameworks

Les classes XS, SM, en 12 colonnes. Nouveaux CSS (flexbox). Bootstrap, Materialize, Starter kit, Foundation

9 - Exploiter les API du navigateur

Attributs de formulaires et moyens de saisie, changement d'orientation, état de la connexion et de la batterie