Formation Responsive Web Design

Introduction à la formation Responsive Web Design

Principe

Vocabulaire(ecran, dimensions,résolution, grid, scan,…)

supports (mobile, tablette, ordinateur,…)

Point de rupture

Standards HTML, HTML5, CSS3

Design: Static, Liquid, Adaptative, Rivesponsive

Conception et approches

Responsive degradation

Mobile first

Media queries CSS 3

Syntaxe des medias queries

Atelier pratique : Adapter une page web en fonction des dimensions d’ecran

Le concept de grille fluide

Les unités pixel, em, %,….

points de rupture

les multicolonnes en RWD (CSS3 columns)

Gérer les débordements de contenus (texte, image,,,,,)

Adaptive Images

Quelques solutions : L’attribut srcset, Network Switching, Art Direction

Les règles à respecter: sémantique de la balise , adapter la qualité des images,….;

La méthode des 3 couches

la librairie externe AdaptiveImages

Direction artistique

Les techniques avancées ET outils

Découvrir FlexBox CSS3 et ses possibilités pour le Web mobile

Bootstrap

HTML shiv

Respond.js

Les plugins jQuery: ResponseJs, Flexslider,