Video mailing: gdzie działa i jak umieścić go w kodzie?

Video marketing cieszy się ogromną popularnością. Internauci dużo częściej sięgają po video-tutoriale niż instrukcje pisane. Video zapada w pamięć, jest łatwe do przyswojenia i może wzbudzić u odbiorcy silne emocje. Dlaczego w takim razie nie wykorzystać by tego w e-mail marketingu? Ograniczeniem może być nadal dość mała ilość klientów pocztowych, u których video działa. Z tego artykułu dowiesz się na jakich konkretnie pocztach działa video mailing, jak należy go umieścić oraz jak w prosty sposób poradzić sobie z pocztami, gdzie ta technologia jeszcze nie funkcjonuje?

Na początek: gdzie działa video mailing?

Grono klientów pocztowych pozwalających na odtworzenie wideo w mailingu nadal jest niewielkie. Wśród nich są takie portale jak Onet i Wirtualna Polska oraz poczta Mozilla Thunderbird. Przewagę w tej technologii mają również poczty i urządzenia firmy Apple (iPhone, iPad, Mac). Z urządzeń mobilnych wpisuje się w to również aplikacja Email na Androidzie. Wideo jest odtwarzane na prawie każdej z popularnych przeglądarek (Mozilla Firefox, Google Chrome, IE, Edge, Opera). Jedynie przeglądarka Safari nie obsługuje wideo.

Poniżej znajduje się zestawienie:

+ działa
– nie działa
* Video pokaże się dopiero po kliknięciu w link „Odblokuj” w pasku narzędzi widocznym u góry kreacji
** Grafiki o rozszerzeniu .gif wyświetlają się jedynie w postaci zamrożonej pierwszej klatki animacji
*** Nie na każdym iPhonie działa opcja autoplay

Skoro już wiemy, gdzie wideo mailing zadziała powstaje drugie pytanie:

Jak umieścić video w mailingu?

Z pomocą przychodzi nam HTML5 i jego znacznik <video>. Dzięki temu, że znacznik ten można rozpisać osobno na otwarcie i zamknięcie, pozwala to na umieszczenie pomiędzy nimi znacznika <img> z grafiką, która ma zastąpić video, gdy jego odtworzenie będzie niemożliwe. Ewentualnie, w tym miejscu można również umieścić sam tekst. Grafikę lub tekst można wówczas podlinkować do miejsca, gdzie ten filmik się znajduje, aby osoby, które nie widzą go w treści wiadomości mogły i tak go obejrzeć. Taki sposób umieszczenia grafiki uniemożliwi jej wyświetlenie równocześnie z filmikiem. Mailing z tak zamieszczonym video i grafiką staje się uniwersalny, więc nie trzeba przygotowywać osobnych wersji wiadomości dla poszczególnych poczt.

<video><a href=”http://grafika.mp4”><img src=”grafika.gif”/></a></video>

Sam znacznik <video> można dodatkowo wzbogacić o kilka funkcji modyfikując jego wyświetlenie. Tak na przykład filmik może być zapętlony, czyli odtwarzać się od początku od razu po zakończeniu poprzedniego odtwarzania.

<video loop=”loop”></video>

Następny atrybut pozwala na autoodtworzenie się video od razu po otwarciu wiadomości.

<video autoplay=”autoplay”></video>

Istnieje również możliwość pozostawienia kontroli nad sposobem odtworzenia się filmiku użytkownikowi umieszczając w wideo panel kontrolny z takimi przyciskami jak start/pause, volume itp.

<video controls=”controls”></video>

Warto stosować powyższe atrybuty, ponieważ domyślny wygląd okna z filmem jest różny dla innych poczt. Najlepszym formatem pliku video jest .mp4, ponieważ działa on na każdej wymienionej wyżej poczcie. Taki plik z filmem może być umieszczony w paczce .zip razem z plikiem index.html. Wówczas należy pamiętać, że takie pliki dużo „ważą”, a zbyt ciężka kreacja może powodować problem z jej dostarczeniem.

W kodzie można również zamieścić video przy pomocy ścieżki bezwzględnej, a plik zawiesić na jakimś serwerze (najlepiej o dobrej przepustowości). Tutaj waga może być już nieco wyższa. Należy mieć na uwadze, że zbyt ciężki plik dłużej się konwertuje, co wydłuża oczekiwanie na obejrzenie filmu, a może również prowadzić do problemów z jego wyświetleniem. Ścieżka do takich serwisów jak YouTube czy Vimeo nie działa.

<video src=”https://sciezka_do_filmu/filmik.mp4”></video>

Powracając do treści alternatywnych (grafiki i tekstu, które mają zastąpić wideo), dobrą praktyką jest umieszczenie tutaj pliku .gif. Może on przedstawiać fragmenty z filmu zachęcające do kliknięcia i obejrzenia całego filmu. Grafiki w rozszerzeniu .gif są odtwarzane niemalże wszędzie. Wyjątkiem jest poczta Outlook, gdzie taka grafika jest wyświetlana jako statyczny pierwszy kadr animacji.

Film umieszczony. Co dalej?

Wiemy już gdzie działa i jak należy w poprawny sposób umieścić video w kodzie mailingu. I co dalej? Myślę, że warto postawić się w miejscu użytkownika oraz zadać sobie pytanie, co chcemy osiągnąć video mailingiem. Pamiętajmy, że na zainteresowanie użytkownika mamy niespełna 5 sekund. Jest parę wskazówek i dobrych praktyk przy przygotowywaniu tego typu wiadomości.

Jedną z nich jest umieszczenie w temacie wiadomości informacji o tym, że wiadomość posiada video warte obejrzenia. Tym sposobem wyróżni się ona spośród masy innych wiadomości na skrzynce użytkownika. Może to również ustrzec wiadomość przed sklasyfikowaniem jej jako spam lub/i wirus.

Sam filmik nie może posiadać dźwięków, które mogą stać się irytujące ani za długi. Przy dużej dynamice na filmie warto umieszczać ostrzeżenie dla osób z epilepsją.

Video, które ma ustawiony atrybut autoplay najlepiej jest umieścić w górnej części wiadomości, aby odbiorca nie musiał za długo szukać źródła usłyszanego dźwięku. W samym mailingu najlepiej jest zamieścić jedynie krótki spot kierujący do zapoznania się z całością oferty. Nie znudzi to odbiorcy, a może i nawet wzbudzi zainteresowanie i chęć dowiedzenia się czegoś więcej o przedstawianym produkcie. To tylko kilka wskazówek. Aktualnie jest dużo firm specjalizujących się w przygotowywaniu treści wideo.

Co wideo mailing może dać nadawcy?

Firma, która posługuje się najnowszą technologią musi być na bieżąco z nowinkami, czyli jest nowoczesna i na czasie.    
Hubert

Pamiętasz ten filmik? Wzruszył mnie. Jaka to była firma?   
Zofia

To przykładowe, zmyślone wypowiedzi, ale czy nie działają na wyobraźnię? Czy takich reakcji nie należy się spodziewać po odbiorcach video mailingu? Myślę, że jest to całkiem prawdopodobne. A przecież o to tu chodzi: o wywołanie pozytywnego wrażenia na kliencie i budowanie lojalności wobec naszej marki.

Chcesz dowiedzieć się więcej na ten temat?
Napisz do nas!

Słówko o autorce:

Ewa Kaczyńska Z wykształcenia grafik komputerowy. Z SARE związana od 2013 roku, gdzie na stanowisku Junior Web Developera odpowiada za przygotowywanie techniczne newsletterów, Landing Page’y oraz ankiet. Wspiera klientów w zakresie poprawnego wyświetlania się kreacji. Testuje i wprowadza nowe rozwiązania związane z mailingami. Prywatnie fanka książek oraz filmów fantasy. Miłośniczka Marvela i kocich łapek. Wieloletnia woodstockowiczka i bywalczyni Escape Room’ów.