Newsletter / E-mailing Créer un e-mailing ou une newsletter en HTML

Maîtriser l'intégration du HTML et des CSS dans un e-mailing

Objectifs

→ Définir la place de l’intégration HTML dans le flux de production d’un e-mailing
→ Connaître les bases du HTML pour l’e-mailing
→ Préparer et optimiser les images d’un e-mailing avec Photoshop
→ Réaliser une mise en pages élaborée

Public concerné

Webdesigners, chargés de communication ou de marketings ou toute personne devant concevoir une newsletter ou un e-mailing.

Pré-requis

Il est nécessaire d’avoir suivi le stage “Les fondamentaux de l’e-mailing” pour accéder à cette formation. Une connaissance minimum de Photoshop facilitera l’accès à cette formation.

Programme

Définir la place de l’intégration HTML dans le flux de production d’un e-mailing

  • Connaître le flux de production d’un e-mailing (cahier des charges, wireframe, design visuel, intégration HTML, mise en ligne, tests, envoi)
  • Identifier les grandes contraintes de production et leur incidence sur la délivrabilité d’un e-mailing
  • Connaître les principaux outils permettant de coder un e-mailing
  • Connaître les principaux outils permettant de tester l’affichage d’un e-mailing dans les outils de messagerie

 

Étude de cas : analyse d’exemples d’e-mailing / Panorama d’outils

Connaître les bases du HTML pour l’e-mailing

  • Organiser et nommer ses fichiers
  • Choisir l’encodage des caractères
  • Choisir le Doctype HTML
  • Connaître la syntaxe de base du langage HTML (élément, attribut et valeur)
  • Coder la structure de base de l’e-mailing
  • Appréhender la structure HTML de base d’un tableau
  • Insérer du texte et coder les caractères spéciaux
  • Créer un lien
  • Vérifier la validité du code HTML
  • Identifier les techniques HTML à éviter dans un contexte e-mailing

 

Exercice : réaliser un e-mailing d’invitation (une colonne)

Préparer et optimiser les images d’un e-mailing avec Photoshop

  • Connaître les formats d’image pour l’e-mailing
  • Extraire les images avec la fonction Exporter sous de Photoshop
  • Utiliser l’outil Tranche de Photoshop
  • Optimiser le poids des images

 

Exercice : extraire des images à partir d’une maquette graphique créée dans Photoshop

Réaliser une mise en pages élaborée

Mettre en place la structure tabulaire

  • Imbriquer les tableaux HTML
  • Utiliser les tableaux en pourcentage
  • Ajouter des fonds de couleur

 

Placer et enrichir le texte grâce aux styles intégrés (CSS inline)

  • Choisir la police de caractère et sa taille
  • Modifier la couleur du texte
  • Modifier l’interlignage et l’alignement
  • Modifier la couleur des liens

 

Intégrer les images

  • Ajouter un texte alternatif et le styliser (attribut alt)
  • Ajouter un lien et supprimer la bordure bleue
  • Créer un “faux arrière-plan”

 

Créer des boutons en HTML

  • Créer la structure tabulaire
  • Styliser (bordure, arrondi, ombre)

 

Vérifier le code et tester le rendu

  • Vérifier le code avec HTMLHint et HTML Validator

 

Optimiser un e-mailing pour les principaux clients de messagerie

  • Résoudre les bugs de rendu dans les principaux clients de messagerie et solutions
  • Rendre un e-mailing ou une newsletter “mobile friendly”

 

Mettre en ligne la page miroir et les images

  • Utiliser un logiciel FTP
  • Configurer le serveur distant
  • Publier la page miroir et des images sur un serveur distant
  • Modifier des liens relatifs en absolus

 

Envoyer la newsletter pour test

  • Envoyer avec l’outil en ligne gratuit PutsMail
  • Tester le rendu dans les principaux outils de messagerie grâce aux outils de test-rendering (Email on Acid, Litmus)

 

Exercice : réaliser une newsletter complète comportant des images, du texte et plusieurs colonnes

Méthodes pédagogiques

Alternance de théorie, de démonstration par l’exemple et de mise en pratique grâce à de nombreux exercices.

Moyens techniquesMoyens spécifiques à cette formation :

→ Logiciels: Brackets, Dreamweaver, Photoshop


Moyens génériques :

  • d’un poste de travail Mac ou PC de dernière génération équipé d’un écran plat 21” ou 27”
  • d’une tablette graphique
  • d’un iPad sur demande
  • d’une connexion très haut débit à Internet
  • d’une clé USB de 8 Go offerte en début de formation
  • Le poste du formateur est relié à un système de vidéo projection
  • 8 participants maximum par stage
  • 9 participants pour les formations certifiantes
  • Toutes les formations sont dispensées sur les dernières versions officielles de chaque logiciel
  • Un support de cours ou un livre est remis à l’issue des principaux stages
Suivi
  • Chaque apprenant bénéficie d’une hotline gratuite et illimitée par e-mail
  • Fiche d’évaluation, feuille d’émargement et attestation de présence
Profil du formateur

Webdesigner / E-mail designer ayant plus de 10 ans d'expérience en enseignement.

Marketing Digital
Web
Médias sociaux
Voir toutes les formations

Créer un e-mailing ou une newsletter en HTML

3 jours 21 heures 1 500 € HT

Sélectionner une date dans la liste :

Vous devez sélectionner une date

Sélectionner votre profil :

Vous devez sélectionner votre profil

Créer un e-mailing ou une newsletter en HTML

3 jours 21 heures 4 770 €HT*

* À partir de

Organisez cette formation dans votre entreprise selon vos plannings et les disponibilités de nos intervenants (dates continues ou discontinues).

Cliquez ici pour plus d'informations

Ce tarif inclut :

  • La préparation pédagogique de la formation par notre équipe (validation des pré-requis, définition des objectifs et des compétences visées
  • Un entretien téléphonique avec le formateur
  • L’animation de cette formation dans vos locaux pour 3 stagiaires maximum
  • Les supports de cours (si prévus)
  • La gestion administrative de la formation (frais de dossier, devis, conventions…)

Ce tarif n’inclut pas :

  • La mise à disposition du matériel nécessaire au bon déroulé de la formation (ordinateurs, vidéo-projecteur, logiciels…),
  • De rendez-vous de préparation avec le formateur,
  • La conception de supports spécifiques,
  • Les éventuels frais de déplacement et d’hébergement du formateur.

Important :

  • Ces formations peuvent également être organisées dans nos salles de formation exclusivement pour vos collaborateurs (dans ce cadre, nous nous chargeons de tous les aspects logistiques).
  • Dans le cadre de formations « intra / sur mesure », la durée des formations peut bien sûr être modifiée selon vos impératifs et objectifs

Fermer

Demander un devis
L'avis des participants
Très constructif, pro et dans la bonne humeur, c'est parfait !
Lucie R. - Service Communication de Genius & Co (session du 30 septembre au 2 octobre 2015)