Post on 24-May-2015
description
RESPONSIVE DESIGN&
LESS CSS
APPLIQUÉS AUMOTEUR DE TEMPLATE
DE 42STORES
mardi 23 octobre 12
POINT DE DÉPART
•2 conf tech sur responsive et less css
•40 thèmes (+) ou (-) standardisés
•5 feuilles de styles / thème
•1 thème dédié smartphone
mardi 23 octobre 12
mardi 23 octobre 12
PASSAGE AU RESPONSIVE• choix du layout fluide
• passage en % / taille en EM / position absolute et %
• développement des média queries
• minimiser les queries , test multi device (écrans normaux, mobiles classiques, mobiles retina, tablettes)
• double CSS pour IE 7/8
• transformation menu déroulant en select
mardi 23 octobre 12
MEDIA QUERIES ECRANS
mardi 23 octobre 12
MEDIA QUERIESIPHONE 4
mardi 23 octobre 12
RÉSULTATS RESPONSIVE
mardi 23 octobre 12
PASSAGE AU LESS
mardi 23 octobre 12
Découpe du CSS&
ré-écriturecomplète
mardi 23 octobre 12
Compilation (php)
<link type="text/css" rel="stylesheet" href="/styles/main.css" />
1 seul fichier CSS
mardi 23 octobre 12
AVANTAGES LESSLES VARIABLES
mardi 23 octobre 12
AVANTAGES LESSLES FONCTIONS
mardi 23 octobre 12
RESPONSIVE DESIGN+
LESS CSS=
50 JOURS HOMME+
AVENIR RADIEUX
mardi 23 octobre 12