Créer des sites "responsive" (responsive web design)
Formation
À Paris
Avez-vous besoin d'un coach de formation?
Il vous aidera à comparer différents cours et à trouver la solution la plus abordable.
Description
-
Typologie
Formation
-
Lieu
Paris
-
Durée
2 Jours
-
Dates de début
Dates au choix
comprendre les problématiques ergonomiques et graphiques liées à la diversité des terminaux d’affichage de sites web actuels créer un site web s’adaptant à différents terminaux cibles utiliser conjointement CSS et JavaScript pour le responsive web design tester et assurer des solutions de repli afin d’obtenir un maximum de compatibilité
Les sites et dates disponibles
Lieu
Date de début
Date de début
À propos de cette formation
intégrateurs et développeurs, webmestres, concepteurs de sites web
maîtriser HTML et CSS (IIN03) et connaître JavaScript (IIN80)
Les Avis
Le programme
Introduction
Chronologie du HTML
XHTML/CSS/JavaScript, les langages du web
Organismes de standardisation : WHATWG et W3C, standards et validation
Standards actuels (HTML5, CSS3)
Diversité des terminaux d’affichage
Différence entre résolution et taille d’affichage
Séparation entre contenu et presentation
Interface utilisateur (UI) et expérience utilisateur (UX)
Approche Mobile First
Détection du navigateur
Détection du terminal
Détection de fonctionnalité
Orientation du terminal
Conception d’une interface adaptative
Considérer les terminaux tactiles
Gabarits responsives
Différence entre viewport et screen
Principe des media queries
Règles conditionnelles (device-width, orientation…)
Points de rupture
Cibler la résolution Retina
Mise en page fluide vs. mise en page fixe
Conception en grille CSS
Unités de mesure fluides (% et em)
Multi colonnage
Marges et points de rupture
Module flexible box CSS3
Calculateurs en ligne
Images HTML flexibles
Element HTML5 "picture" et media queries
Attributs srcset et sizes
Images de fond CSS3 : images multiples, tailles d’images adaptatives (background-size)
Menu adaptatifs
Vidéos adaptatives
Tableaux et formulaires flexibles
Tester les medias queries
Tester le viewport
Tester le navigateur
Modification dynamique des contenus
Optimisation du chargement par cookies
Redirection par JavaScript
Frameworks HTML (HTML5 boilerplate, Bootstrap, Skeleton)
Frameworks JavaScript (jQuery mobile, response.js, yepnope.js, modernizr.js, touchswipe.js)
Frameworks CSS (Bootstrap, Foundation, 960 Grid, Gumby, Skeleton)
Solutions en ligne
Solutions hors ligne : Adobe Edge Inspect, Dimensions
Optimisation des contenus
Informations complémentaires
Avez-vous besoin d'un coach de formation?
Il vous aidera à comparer différents cours et à trouver la solution la plus abordable.
Créer des sites "responsive" (responsive web design)