Rechercher une formation et ses disponibilités
Formation Responsive Design Web
La formation Responsive Design Web a pour objectif de vous permettre de créer des sites qui s'adaptent à n'importe quelle résolution.
Nous commencerons par une présentation des évolutions du mobile et du responsive avant d'entrer dans le vif du sujet : l'ensemble des techniques pour créer un site dont les performances d'affichage sont optimales, quel que soit le support. De l'exploitation des médias en CSS aux astuces du Responsives, nous aborderons tous les points indispensables à l'utilisation du Responsive Design dans les règles de l'art.
Pour finaliser cette formation très complète, nous traiterons de l'optimisation des performances. Cette formation est un must pour toute personne souhaitant créer des sites répondant aux attentes de tous les utilisateurs.
Objectifs de cette formation Responsive Design Web
- Maîtriser les techniques d'adaptation des résolutions
- Être en mesure d'optimiser les performances d'affichage
- Maîtriser les bonnes pratiques
Public de cette formation Responsive Design Web
- Développeur
- Intégrateur HTML
Pré-requis de cette formation Responsive Design Web
- Bonnes connaissances HTML 5 / CSS 3
Programme de cette formation Responsive Design Web
Etat de l'art de la mobilité
- Les supports, les OS, les navigateurs, les technologies
- Les statistiques d'usage
- Les standards, le HTML5 et CSS3
- Ressources utiles : les outils disponibles en ligne et quelques galeries de sites mobiles
Présentation du Responsive
- Les principes et la philosophie du Responsive Web Design
- Définir les tailles d'écran
- Les unités pixel, em et % : pour quel usage ?
- Les contraintes ergonomiques et fonctionnelles
- Les modes portrait et paysage
Un contenu fluide sous contrainte
- Faire face aux débordements de contenus (césures et autres coupures)
- Faire face aux débordements de médias (images, vidéos, flash, etc.)
Les tailles standards d'un mobile
- Les tailles indiquées sont erronées: la différence entre la taille d'écran, la taille de fenêtre virtuelle et la taille déclarée
- Forcer le Viewport en HTML et en CSS
Présentation des CSS3 Media Queries
- Exploiter les médias en CSS
- Utiliser les opérateurs logiques avec Media Queries
- Les critères pour mobiles (width, height, device-width, device-pixel-ratio, orientation, etc.)
- Compatibilité Media Queries
- Menu horizontal
- Tableaux et éléments à risques
Adoptez les astuces pour le Responsive
- Exploiter le HTML 5
- Séparer les scripts js
- Adapter la taille du Viewport
- Redimensionner les éléments
- Réordonner les contenus
Optimisation des performances
- Les bonnes pratiques
- Optimisez vos requêtes et les temps de chargement
- Améliorez votre feuille de style
- Utiliser les Mediaqueries exclusifs
- Utiliser les principes de minification
- Compresser les images et les sprites
- Exploiter le Javascript et configurer son utilisation
