Le site formation des professionnels du marketing, de la communication et des médias
FORMATION

Responsive design pour marketeur

S’adapter aux nouveaux usages de consommation des parcours client digitaux
N° de réf : ZA32

Lieu de la formation : Paris
Dates :
24-25 avril 2017 ; 29-30 juin 2017 ; 13-14 décembre 2017
Tarif formation : 1795 € HT (2154.00 € TTC)
Durée formation : 2 jours (14 heures)

Partager sur :   Email
Objectifs de la formation

- Comprendre les contraintes du responsive design dans un projet marketing digital
- Mettre en place une stratégie responsive design en cohérence avec la navigation multi-écrans
- Maitriser les enjeux du responsive design afin de cadrer son projet

Le(s) formateur(s)

Naimeric VILLAFRUELA, Directeur technique - chez Webredacteurs, créateur du Fablab Moebius

Les plus de la formation

- Une journée de mise en pratique pour maîtriser les enjeux techniques du responsive design dans un projet marketing
- Les participants devront se munir de leur PC portable, tablette ou smartphone

Programme de la formation

JOUR 1


LE RESPONSIVE DESIGN AU SERVICE DE VOTRE STRATEGIE DIGITALE ET CLIENT

Définition et enjeux du Responsive design
- Qu'est-ce que le responsive design ?
- Pourquoi a-t-on besoin du responsive design ? usage web et la mobilité
- Qu'est-ce qui rend un site internet responsive ?

Analyse d'exemples de sites actuels responsive : de site média et e-commerce

Comprendre les principaux concepts du responsive design
- Contrôle du viewport
- Comprendre la densité écran et l'impact sur la lecture pour l'internaute/mobinaute
- Designer son projet pour des densités d'écran différentes
- Media queries
- Points pivots
- Grilles fluides
- Rendre les images responsive
- Le futur pour les images responsive : 5K et 8K
- Proposer des formulaires responsive
- Optimiser les performances offertes par le responsive : taux de rebond, clics, conversion

Mettre en place une stratégie responsive
- Les stratégies en fonction des contextes
- Mockups / Schémas
- Planifier un responsive design : budget, planning
- Construire sa stratégie de contenu pour un site responsive
- Le contexte mobile
- Designer spécifiquement pour mobile
- Assumptions / Mythes / Réalité
- La flexibilité du code
- Frameworks : frameworks en grilles fluides
-Tester son projet responsive design
- Outils gratuits et payant pour le responsive design : Bootstrap

Etude de cas : analyse de la stratégie Responsive de Pixmania

Mettre en place une architecture responsive
- Maîtriser les avantages et inconvénients :
- responsive vs site dédié
- responsive vs application
- Responsive design & l'emailing

JOUR 2


JOURNEE DE MISE EN PRATIQUE : PILOTER UN PROJET RESPONSIVE DESIGN EN COHERENCE AVEC SA STRATEGIE MARKETING

Révision : définition et usages du HTML et CSS
- Qu'est-ce qu'une feuille de style ?
- Construire une page HTML
Exemples : le formateur analysera des exemples multi-sectoriels

Planifier son responsive design
- Planification du contenu
- Création des mockups
- Définir son Responsive UX
- Structurer les régions de sa page et les contenus pour du multi-device

Construire sa mise en page responsive
- Contrôle du viewport
- Styles par défaut
- Définition des points pivots
- Définition des medias queries
- Mise en page basique : pour desktop, tablette, mobile

Comprendre les enjeux de navigation et des utilisateurs
- Définir la stratégie de navigation et recenser l'ensemble de ses besoins marketing pour faciliter l'étape de mise en recette
- Structurer ses menus
o que faire en cas de menus complexes
- Designer ses menus
- Animation et frameworks Javascript (Jquery, scriptaculous, mootools..)
- Gérer les changements de taille
- Réduire un menu pour les petits appareils
- Gérer les sous-menus avec le tactile
o remplacer le roll-over
- Parer les conflits
- Fournir un échappement
- Remplacement dynamique
- Conversions
- menu to select
- select to menu

Richmedia : image, vidéo, son en responsive design
- Images et vidéo fluides
- CSS à la place des images
- Polices d'icônes
- Galerie d'images
- Son

Les fonctions spécifiques mobiles
- Formulaires
- Fonctions téléphones
- Icônes

Gérer les ressources
- Avec Modernizr
- Respond.js
- Gestion conditionnelle

Les participants devront se munir de leur PC, tablette et smartphone.
La partie révision HTML et CSS de la seconde journée, permet aux personnes débutantes de se mettre à niveau sur les fondamentaux et de suivre la journée de mise en pratique.

A qui s'adresse cette formation ?

Responsables e-marketing, e-communication, digital, communication et marketing - Responsable de marque - Chefs de produits , chef de marché, chef de projet digital

Les avantages des
formations Stratégies

6 mois de magazine Stratégies offert !

Pour toute inscription à une formation Marketing Communication ou Internet de 2 jours minimum, 6 mois d’abonnement au magazine Stratégies offert !

Abonnez-Vous à Stratégies