conférence #nwxtech4 : responsive web design et préprocesseurs css par benjamin quédeville
DESCRIPTION
Retour d'expérience sur ces technologies abordées lors des précédentes conférences et leur implémentation pour la nouvelle version de 42 Stores.TRANSCRIPT
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