Web Mobile et Responsive Design

15
Site web mobile : Parlons du responsive design

description

Pour sa 4e conférence live gratuite sur le site internet http://www.pouldesign.com le conférencier Fabien Pelissier vous a concocté une présentation sur les sites web mobiles et le responsive design. Conférence à ne pas manquer dans l'ère du M-Commerce !

Transcript of Web Mobile et Responsive Design

Page 1: Web Mobile et Responsive Design

Site web mobile :Parlons du responsive

design

Page 2: Web Mobile et Responsive Design

221 000 000 pages mobiles vues en mars 2012

Page 3: Web Mobile et Responsive Design

Beaucoup plus d’accès par les téléphones/tablettes

Ventes de PCs =

Ventes des dispositifs mobiles

Page 4: Web Mobile et Responsive Design

OrdinateursTablettesTéléphonesTélévisions…

Page 5: Web Mobile et Responsive Design

Des tailles d’écrans à l’infini !

Page 6: Web Mobile et Responsive Design

Sortez du cadre et devenez flexibles

Page 7: Web Mobile et Responsive Design

Responsive web design

Page 8: Web Mobile et Responsive Design

Un seul site pour tout contrôler

Page 9: Web Mobile et Responsive Design

3 Fondations du responsive web design

Grille flexibleImages flexiblesMedia Queries

Page 10: Web Mobile et Responsive Design

Designer une

grille réactive

Pensez « flexible »

Page 11: Web Mobile et Responsive Design

Des images responsive ?

Le choix est difficile !

OU

Page 12: Web Mobile et Responsive Design

Les bases du responsiveWeb design

Media Queries

Page 13: Web Mobile et Responsive Design

Les choses à penser

Points de contrôle des media queriesBlocs et zone de « widgets »Menus et zones de navigation

Page 14: Web Mobile et Responsive Design

Pourquoi l’utiliser ?

Compatibilité infinie (adapté aux largeurs)

Design basé sur le contenu

Evolutif à loisir

Page 15: Web Mobile et Responsive Design

Pourquoi l’utiliser NE PAS L’UTILISER ?

Design bien plus complexe à effectuer

Temps de développement nettement plus long

Prix final du projet à flexible lui aussi ;-)