El Zahvaljujući različitim formatima, prilagodljivi dizajn danas je od vitalne važnosti s kojima se korisnik suočava sa svog tableta, mobitela, pa čak i računala. Ovaj responzivni dizajn u marketingu e-pošte i odredišnim stranicama više je nego važan za višekanalnu komunikaciju s našim klijentima.
Stoga morate ozbiljno shvatiti da li želite uzimati različite predloške različitih širina kako bismo stigli s najboljim dizajnom moguće one biltene ili onu odredišnu stranicu na koju će sletjeti budući klijenti koje želimo da pretvore iz naših oglasa na Googleu ili Facebooku.
Odzivni dizajn u marketingu e-poštom
Marketing putem e-pošte jedan je od načina na koji se mogu najaviti ponude proizvoda ili oni novi postovi stvoreni na našem blogu tako suziti na dublji način sa svim našim sljedbenicima.
Da ovi bilteni odgovaraju, to znači mogu se savršeno vidjeti s mobitela, tablet ili računalo. Stoga moramo pokušati imati potrebne alate kako bi svi vizualni elementi bili dovoljno skladni za lako čitanje biltena.
IKEA bilten
Odzivno znači da uvijek ispravite prikaz stranice na različitim uređajima. Za to imamo alate od e-mail marketing koji nam pomažu testirati bilten stvoren u različitim formatima i na taj način modificirati vrijednosti poput umetanja ili margine tako da se savršeno premještaju dok smanjujemo širinu preglednika.
U koriste se web dizajn sa CSS "Media Queries" dizajnirati web stranicu prema formatu. Do 360 piksela bilo bi za mobitel, a od 360 do 650 piksela mogli bismo napraviti izmjene za sve one korisnike koji vide našu web stranicu s tableta.
Neki od principa naših biltena o marketingu putem e-pošte su:
- Čista vizualna hijerarhija: naslov u H2 za ostavljanje teksta u formatu odlomka.
- Dva različita izvora: jedan za naslov i jedan za tekst čine naš bilten bolje čitljivim.
- El upotreba boje za razlikovanje naslova, teksta i ostalih elemenata: postupno možemo prelaziti iz tamno sive u svjetliju.
- Un CTA (poziv na akciju) jasan i prepoznatljiv: ako je logotip naše tvrtke u crvenoj boji, CTA može u ovoj boji, dok je ostatak u komplementarnoj boji.
Dajemo vam jasan primjer sjajnog responzivni dizajn u biltenu koji je izvodio Filmin i to možete vidjeti na priloženoj slici. Jasna tipografija u bijeloj boji, a tekst u vrlo svijetlo sivoj boji, ali to nam omogućuje da brzo vizualiziramo različite prostore u kojima smo pozvani čitati ako to želimo. CTA nije da je iz drugog svijeta, ali pomaže kod te ikone igre i čini nas da vidimo što nas čeka.
Dovoljno prostora na marginama, bijela kao glavna boja za tekst i koji se savršeno uklapa s logotipom Marke; okružen onom sivilom zbog koje se ističe. Privlačna slika koja postavlja poantu za bilten koji se zakači od prvog trenutka. Na bokovima su također ostavljeni razmaci kako se cijela širina zaslona ne bi "pojela".
u stolna verzija održava ta načela, čak ostavljajući više prostora u tekstovima i ostavljajući veliku marginu sa svake strane:
Odzivni dizajn na odredišnoj stranici
The isti se principi mogu koristiti u responzivnom dizajnu odredišne stranice. Izuzetno je važno uzeti svo vrijeme na svijetu kako biste pravilno odabrali predložak i slijedili neka pravila u dizajnu:
- Vizualna jednostavnost: Govorimo o zadržavanju praznih prostora kako bismo fokus stavili na CTA-ove.
- Lijepe i zanimljive slike čitatelju, ne zaboravljajući rezoluciju i da izgledaju savršeno.
- Važnost boje i to opet ističemo.
Moramo poraditi na responzivnom dizajnu odredišne stranice za mobitel, tablet i stolno računalo. Uzmi vrijeme potrebno za testiranje iznova i iznova kako se mijenjaju to se vidi u ta tri formata, budući da se možemo pouzdati i zaboraviti da će promjene napravljene u CSS-u na mobitelu izgledati užasno.
Odredišna stranica Hotjar
To je posao koji može biti naporan, ali od vitalne je važnosti da odvojimo vrijeme da testiramo svaku promjenu. The upotreba bočnih margina i pokušajte, koliko je to moguće, ne propustiti pravila u CTA-ovima ili akcijskim gumbima:
- Da udaljenost u odnosu na tekst i marginu gumba je progresivna u sva tri formata. Niti je mala niti velika i da je na istoj visini.
- La omjer u veličini CTA gumba s ostalim elementima na kojima se nalazi mora se osigurati.
Jasan primjer za to je posao koji je Shopify obavio na vašoj odredišnoj stranici na radnoj površini i u kojoj možete vidjeti u mobilnoj verziji. Pozornost na upotrebu boja, razmaka i onih tekstova s odgovarajućim veličinama i tipografijom:
Niz savjeta koje treba imati bolja odredišna stranica za vašu tvrtku ili internetsku trgovinu i one biltene toliko važne da svojim korisnicima dostavite ažuriranja i promocije.