Podcast dotyczący projektowania e-maili #60: Jak CodePen podchodzi do projektowania i marketingu e-maili z Chrisem Coyier

W 60. odcinku The Email Design Podcast gospodarze Kevin Mandeville i Jason Rodriguez rozmawiają z guru CSS Chrisem Coyierem, aby omówić, w jaki sposób CodePen podchodzi do projektowania i marketingu wiadomości e-mail oraz przemyślenia na temat tworzenia wiadomości e-mail w HTML z perspektywy projektantów stron internetowych. Pamiętaj, aby śledzić i dołączać do dyskusji na Twitterze za pomocą #EmailDesignPodcast.

Obejrzyj cały film powyżej lub posłuchaj poniżej wersji tylko dźwiękowej.

Pobierz MP3

W tym odcinku:

• (1:44) Jak nauczyłeś się HTML i CSS? Chris faktycznie uczęszczał na zajęcia z programowania w liceum, a potem studiował je w college'u. Ostatecznie nie lubił programowania zaplecza i przeszedł na specjalizację ze sztuki. W końcu wszedł w HTML i CSS, budując witryny WordPress, w tym jego słynną witrynę CSS Tricks.
• (8:05) Czy były jakieś wcześniejsze materiały, których się uczyłeś? Chris jest wielkim fanem Dana Cederholma i jego książki Bulletproof Web Design.
• (9:27) Co było twoją główną inspiracją przy tworzeniu sztuczek CSS i jaka była twoja wizja? Chris mówi, że pierwotnym pomysłem było uruchomienie całej masy witryn WordPress z zawartością w oparciu o popularną technologię, taką jak InDesign Help, w celu generowania ruchu i zarabiania na nich pieniędzy. Sztuczki CSS nie były początkowo popularne, ale Chris naprawdę je lubił i chciał zachować jako osobisty dziennik swoich doświadczeń z tworzenia tych wszystkich różnych witryn.
• (11:48) Co to jest CodePen? CodePen to „plac zabaw dla sieci front-end”. Działa, umożliwiając tworzenie „długopisów”, które są zestawami HTML, CSS i JavaScript, a także jest siecią społecznościową dla programistów, podobną do Dribbble do kodu, a nawet Litmus Builder do programowania front-end. Niedawno uruchomili Projekty, które umożliwiają pracę w lokalnym środowisku programistycznym typu front-end.
• (14:30) Jaka jest wizja CodePen? To balansowanie. CodePen chce się rozwijać jako firma, ale musi także utrzymywać silną, szczęśliwą i zdrową społeczność. Zwłaszcza jako mały, ośmioosobowy zespół z ograniczonymi zasobami, naprawdę muszą skoncentrować się na kluczowych priorytetach.
• (17:15) Jak wygląda e-mail marketing w CodePen? Jakie rodzaje e-maili wysyłasz? Ostatnim przedsięwzięciem w poczcie e-mail był CodePen Spark, cotygodniowa kolekcja najfajniejszych najnowszych długopisów. CodePen faktycznie zbudował niestandardowy CMS, aby pomóc w zarządzaniu i tworzeniu wiadomości e-mail, który jest również publikowany na stronie internetowej CodePen dla archiwów. Wiadomość e-mail jest zbudowana z szablonów Rails, które są wbudowane w CSS i kompilowane z danych CMS. Następnie Chris wprowadza wiadomość e-mail do programu Litmus, aby przetestować i wprowadzić niezbędne poprawki. CodePen używa Sparkpost do wysyłania swoich e-maili. Ostatnie projekty, które Chris ma nadzieję wykonać dla poczty e-mail w CodePen, polegają na połączeniu ich preferencji e-mail w aplikacji internetowej CodePen i tworzeniu e-maili onboardingowych i wyzwalanych w oparciu o aktywność użytkownika.
• (23:53) Jak porównałeś tworzenie niestandardowych rozwiązań z kupowaniem innych platform i usług e-mail? Chris uważa, że ​​większość dostawców usług pocztowych jest zbyt droga, by to uzasadnić. CodePen ma wyjątkowe wyzwanie, jakim jest posiadanie małego zespołu, ale dużej ponad milion użytkowników, gdzie koszty są naprawdę wysokie. Dlatego obecnie dla CodePen bardziej sensowne jest inwestowanie czasu w tworzenie narzędzi.
• (28:31) Jak planujesz e-maile, które musisz wysłać? CodePen używa Google Docs do planowania działań e-mail marketingowych.
• (32:47) Czy wiesz, jak wygląda skład Twoich subskrybentów? CodePen nie zwraca obecnie zbytniej uwagi na swoich subskrybentów i po prostu skupia się na tym, aby e-mail był renderowany we wszystkich popularnych klientach pocztowych. Do tworzenia wiadomości e-mail podchodzą, stosując podejście mobile-first.
• (35:00) Jakie są główne problemy związane z projektowaniem i tworzeniem wiadomości e-mail? Jak mogłoby być ci łatwiej? Chris zmaga się z ustaleniem, jaka jest właściwa warstwa abstrakcji dla e-maili HTML. Nie chce ręcznie tworzyć wiadomości e-mail w formacie HTML, ale nie chce być tak abstrakcyjny, że staje się zbyt trudny do wykrycia lub edycji błędów podczas rozwiązywania problemów. Uważa, że ​​jedynym źródłem prawdy powinien być lakmus w procesie testowania.
• (36:59) Jak próbujesz rozwiązać problemy z renderowaniem, które napotykasz? Chris niedawno natknął się na błąd Outlooka z losowym blokiem przestrzeni ~100px. Chris nie widział żadnych błędów w samym kodzie i nie wiedział, jak szukać tego konkretnego rodzaju błędu w Internecie – po prostu użył Litmusa, aby wypróbować kilka rzeczy do rozwiązywania problemów, dopóki nie zostanie poprawnie zrenderowany.
• (39:10) Jaki jest najdziwniejszy błąd, z jakim się spotkałeś? Chris miał problemy z używaniem obrazów siatkówki w wiadomościach e-mail, głównie z powodu zachowania programu Outlook i prawidłowego działania w przypadku responsywnej poczty e-mail.
• (41:13) Jak oceniasz sukces e-maili CodePen? Biorąc pod uwagę charakter tego małego zespołu i brak w zespole dedykowanej osoby zajmującej się marketingiem e-mail lub analitykiem, nie analizują oni analizy każdego e-maila. Podchodzą do tego z bardziej jakościowego spojrzenia na opinie użytkowników.
• (45:00) Dlaczego świat projektowania stron internetowych ma negatywny obraz wiadomości e-mail w formacie HTML? Chris mówi, że nie jest tajemnicą, dlaczego internet nienawidzi e-maili: ponieważ nie jest nowoczesny i nie mogą kodować tak, jak chcą. Wskazuje również na fakt, że nawet przy projektowaniu stron internetowych ludzie nie lubią testowania w różnych przeglądarkach. Testowanie renderowania nie jest dla większości przyjemną częścią pracy, a to jest jeszcze lepsze, jeśli chodzi o pocztę e-mail.
• (48:54) Jak możemy bardziej edukować świat sieci na temat poczty e-mail? Chris uważa, że ​​dobrze byłoby uświadomić sobie, jak wiele poczty e-mail ewoluowało w renderowaniu wsparcia i jak proste może być. Możliwość stwierdzenia, że ​​nie musisz wstawiać CSS ani używać tabel, miałaby ogromny wpływ na postrzeganie wiadomości e-mail.

Śledź podcast dotyczący projektowania e-maili

• Śledź na SoundCloud
• Subskrybuj w iTunes
• Subskrybuj na YouTube

OTRZYMAJ NAJNOWSZE DOSTARCZONE PROSTO DO SWOJEJ SKRZYNKI

Chcesz uzyskać więcej wskazówek i porad, takich jak ta? Zapisz się do naszego cotygodniowego biuletynu i otrzymuj najnowsze treści dla profesjonalnych projektantów e-maili dostarczane prosto do Twojej skrzynki odbiorczej. Co tydzień.