Podcast #60 sur la conception d'e-mails : comment CodePen aborde la conception et le marketing d'e-mails avec Chris Coyier

Publié: 2017-05-05

Dans le 60e épisode de The Email Design Podcast, les hôtes Kevin Mandeville et Jason Rodriguez s'assoient avec le gourou CSS Chris Coyier pour discuter de la façon dont CodePen aborde la conception et le marketing des e-mails et des réflexions sur le développement d'e-mails HTML du point de vue des concepteurs de sites Web. Assurez-vous de suivre et de participer à la discussion sur Twitter en utilisant #EmailDesignPodcast.

Regardez la vidéo complète ci-dessus ou écoutez la version audio uniquement ci-dessous.

Télécharger le MP3

Dans cet épisode :

  • (1:44) Comment avez-vous appris le HTML et le CSS ? Chris a en fait suivi un cours de programmation au lycée et l'a étudié à l'université. Il n'aimait finalement pas la programmation back-end et s'est tourné vers une majeure en art. Il a fini par se lancer dans le HTML et le CSS en créant des sites WordPress, y compris son célèbre site CSS Tricks.
  • (8:05) Y a-t-il eu des premières ressources que vous avez utilisées pour apprendre ? Chris est un grand fan de Dan Cederholm et de son livre Bulletproof Web Design.
  • (9:27) Quelle a été votre inspiration principale pour créer des astuces CSS et quelle était votre vision pour cela ? Chris dit que l'idée originale était de créer tout un tas de sites WordPress avec du contenu sur une technologie populaire, telle que InDesign Help, pour générer du trafic et en tirer de l'argent. CSS Tricks n'était pas vraiment populaire au départ, mais c'était celui que Chris aimait vraiment et voulait garder comme un journal personnel de ses apprentissages de la construction de tous ces différents sites.
  • (11:48) Qu'est-ce que CodePen ? CodePen est un « terrain de jeu pour le Web frontal ». Il fonctionne en vous permettant de créer des « stylos », qui sont des ensembles de HTML, CSS et JavaScript, et est également un réseau social pour les développeurs, semblable à un Dribbble pour le code ou même à un Litmus Builder pour le développement frontal. Plus récemment, ils ont lancé des projets, qui vous permettent de travailler dans un environnement de développement frontal local.
  • (14:30) Quelle est la vision de CodePen ? C'est un exercice d'équilibre. CodePen veut se développer en tant qu'entreprise, mais doit également maintenir sa communauté forte, heureuse et en bonne santé. Surtout en tant que petite équipe de huit personnes avec des ressources limitées, ils doivent vraiment se concentrer sur les priorités fondamentales.
  • (17:15) À quoi ressemble le marketing par e-mail chez CodePen ? Quels types d'e-mails envoyez-vous ? Un effort récent dans le courrier électronique a été le CodePen Spark, une collection hebdomadaire des stylos récents les plus cool. CodePen a en fait créé un CMS personnalisé pour aider à gérer et à créer l'e-mail, qui est également publié sur le site Web CodePen pour les archives. L'e-mail est construit à partir de modèles Rails qui sont intégrés au CSS et compilés à partir des données du CMS. Chris saisit ensuite l'e-mail dans Litmus pour le tester et apporte les modifications nécessaires. CodePen utilise Sparkpost pour envoyer ses e-mails. Les projets récents que Chris espère réaliser pour les e-mails chez CodePen consistent à fusionner leurs préférences de messagerie dans l'application Web CodePen et à créer des e-mails d'intégration et déclenchés en fonction de l'activité de l'utilisateur.
  • (23:53) Comment avez-vous évalué la création de solutions personnalisées par rapport à l'achat d'autres plateformes et services de messagerie ? Chris pense que la plupart des fournisseurs de services de messagerie sont trop chers pour être justifiés. CodePen a le défi unique d'avoir une petite équipe mais une grande base d'utilisateurs de 1M+ où les coûts sont vraiment élevés. Donc, pour CodePen pour le moment, il est plus logique d'investir son temps dans la création de ses outils.
  • (28:31) Comment prévoyez-vous les e-mails que vous devez envoyer ? CodePen utilise Google Docs pour planifier des activités de marketing par e-mail.
  • (32:47) Savez-vous quelle est la composition de votre audience d'abonnés ? CodePen ne prête pas beaucoup d'attention à son audience d'abonnés pour le moment et se concentre simplement sur l'affichage de l'e-mail dans tous les clients de messagerie populaires. Ils abordent leur développement de messagerie en utilisant une approche mobile first.
  • (35:00) Quels sont vos principaux problèmes avec la conception et le développement d'e-mails ? Comment cela pourrait-il être plus facile pour vous? Chris a du mal à déterminer quelle est la bonne couche d'abstraction pour les e-mails HTML. Il ne veut pas créer manuellement des e-mails HTML, mais ne veut pas devenir si abstrait qu'il devienne trop supprimé et difficile à identifier ou à modifier les erreurs lors du dépannage. Il pense que la seule source de vérité devrait être Litmus dans le processus de test.
  • (36:59) Comment essayez-vous de résoudre les problèmes de rendu que vous rencontrez ? Chris a récemment rencontré un bogue Outlook avec un bloc d'espace aléatoire d'environ 100 pixels. Chris n'a vu aucun bogue dans le code lui-même et ne savait pas comment rechercher ce type particulier de bogue en ligne - il a juste utilisé Litmus pour essayer un tas de choses pour le dépannage jusqu'à ce qu'il s'affiche correctement.
  • (39:10) Quel est le bug le plus étrange que vous ayez rencontré ? Chris a eu des problèmes avec l'utilisation d'images de rétine dans les e-mails, principalement à cause du comportement d'Outlook et de leur bon fonctionnement pour les e-mails réactifs.
  • (41:13) Comment évaluez-vous le succès des e-mails CodePen ? Compte tenu de la nature de sa petite équipe et de l'absence d'une personne dédiée au marketing par e-mail ou à l'analyse dans l'équipe, ils n'examinent pas l'analyse des e-mails de chaque e-mail. Ils l'abordent d'un point de vue plus qualitatif à partir des retours des utilisateurs.
  • (45:00) Pourquoi le monde de la conception Web a-t-il une vision négative des e-mails HTML ? Chris dit que ce n'est pas un mystère quant à la raison pour laquelle le Web déteste les e-mails : parce que ce n'est pas moderne et qu'ils ne peuvent pas coder comme ils le souhaitent. Il souligne également le fait que même dans la conception de sites Web, les gens n'apprécient pas les tests inter-navigateurs. Les tests de rendu ne sont pas une partie agréable du travail pour la plupart et cela est amplifié lorsqu'il s'agit de courrier électronique.
  • (48:54) Comment pouvons-nous éduquer davantage le monde du Web sur le courrier électronique ? Chris pense qu'il serait bénéfique de comprendre à quel point les e-mails ont évolué dans la prise en charge et à quel point cela peut être simple. Pouvoir dire que vous n'êtes pas obligé d'insérer du CSS ou d'utiliser des tableaux aurait un impact énorme sur la perception de l'e-mail.

Suivez le podcast sur la conception d'e-mails

  • Suivez sur SoundCloud
  • Abonnez-vous sur iTunes
  • Abonnez-vous sur YouTube

OBTENEZ LES DERNIÈRES LIVRAISONS DIRECTEMENT DANS VOTRE BOÎTE DE RÉCEPTION

Vous voulez obtenir plus d'astuces et de conseils comme celui-ci? Abonnez-vous à notre newsletter hebdomadaire et recevez le dernier contenu pour les professionnels de la conception d'e-mails directement dans votre boîte de réception. Toutes les semaines.