Урок как правилно да включите GIF изображения в имейли

В тази статия
След най-добрите практики, ето насоките за вмъкване на анимиран GIF във вашия имейл, безопасно и оптимизирано за мобилни устройства.
Забелязали ли сте как анимираните имейли и имейлите с движение са все по-чести във входящата поща? Ние правим. Като професионалист или дизайнер по имейл маркетинг, може би сте се опитали да ги използвате, за да увеличите конверсиите по имейл. Но също така забелязахме, че търговците не винаги включват Анимирани GIF файлове в съобщения използвайки най-добрите дизайнерски практики.
Интересното е, че анимираните GIF файлове всъщност са много лесни за използване в имейл: те могат да се използват като всеки друг файл с изображения и са напълно съвместими с повечето имейл клиенти. Проблемът с много GIF файлове в имейлите е, че призивите за действие в съобщенията често са в рамките на GIF, както в този имейл от Ан Тейлър:
Подканващата фраза „GO“ всъщност не е бутон: тя е част от изображението. Всяко щракване, горе, отдолу или около "бутона" ще има същия ефект: ще ви отведе до целева страница на сайта на Ан Тейлър, защото връзката се простира до целия анимиран GIF. Това улеснява читателите да получат повече информация (и евентуално да направят покупка), като просто докоснат или щракнат върху почти всяка точка. Но това също може да бъде проблематично. Ако анимираният GIF не се изобрази правилно по една или друга причина, съобщението губи цялата си функция. Това може да се случи, ако ...
- На мобилното устройство за четене има изкривявания на размера на изображението
- Показването на изображения не е активирано на клиента, където се чете имейл.
- Програма за блокиране на реклами блокира GIF.
- GIF е голям файл и четецът не чака да завърши зареждането
Също така, потребителите на Outlook най-вероятно ще видят само неподвижно изображение, тъй като анимацията няма да работи. По тези причини и други, Винаги препоръчваме да се възприеме подход към дизайна на имейли, който оптимизира HTML и не разчита единствено на изображения. Искате ли да знаете как да използвате страхотните си анимирани GIF файлове в имейла, като същевременно гарантирате, че вашите призиви за действие винаги се показват? Продължавай да четеш.
Днешната работилница
Днес ще пресъздадем следното съобщение от Banana Republic и ще ви покажем как да оптимизирате използването на анимирани GIF файлове в имейл, за да сте сигурни, че съдържанието ви се появява.
Ето нашето резюме във видео урок:
И за справка, ето пълното съобщение от Banana Republic:
В имейла на Banana Republic ключовото съобщение, което включва призив за действие, е в един блок с изображения, както в имейла на Ан Тейлър, видян по-горе. По-голямата част от съобщението - цялата черна част - е анимиран GIF:
Това означава, че ако показването на изображения е деактивирано или GIF виси или не се зарежда, цялото съобщение се губи.
Нека поправим това.
Стъпка 1: Изолирайте анимирания GIF
Анимираният GIF в тази публикация е страхотен. Така че дори и да се появи във входящата поща, може да не се зареди или да не се зареди напълно, така че съобщението се оказва непрочетено. За да избегнете тези проблеми, добра практика е да изрежете GIF анимацията, като изрежете частите на изображението, които не се нуждаят от анимация. В съобщението Banana Republic това означава, че искаме да изолираме средната част на изображението, частта, която се движи - в розовото поле отдолу - и да пресъздадем останалото с текст и HTML.
За да изрежем бързо изображението, използваме ezGIF.com. И тук имаме нашия нов анимиран GIF: