Embed Size (px)
Citation preview
KATY TUUPANEN / ART DIRECTOR
UUTISKIRJEmiten luot visuaalisesti näyttävän uutiskirjeen
UUTISKIRJEET
(Digital) Art Directorvisuaalisen tiimin vetäjä[email protected]+358 50 599 3356
https://www.linkedin.com/in/katy-tuupanen
https://fi.pinterest.com/katynen
https://www.instagram.com/katy_nen
Vinkkejä ja ajatuksia uutiskirjeiden teosta
Katy Tuupanen
UUTISKIRJEET
• uutiskirje on nopea, kätevä ja tehokas
• 4,1 biljoonaa sähköpostitiliä (2015). Tilien määrä arvioidaan nousevan 5,2 biljoonaan vuoteen 2018 mennessä (Radicati Group)
• 61 % kertoo saavansa yrityksiltä viikottain uutiskirjeen, ja 28 % haluaisi sen jopa useammin
• 66 % myöntää tehneensä ostoksia uutiskirjeen vaikutuksesta
In case you hadn’t heard, email marketing isn’t dead!
Huom! luvut ovat suuntaa-antavia
UUTISKIRJEET
Yleistä uutiskirjeistä• uutiskirje on jopa 40 kertaa tehokkaampaa uusien asiakkaiden saavuttamisessa kun esim. Facebook tai Twitter
• 57 % uutiskirjeiden tilaajista käyttää 10-60 min. viikossa uutiskirjeiden selailuun
• 41 % avaa uutiskirjeen kännykällään (responsiivisuus on siis erittäin tärkeää)
• 19 % kertoo lukevansa jokaisen uutiskirjeen koska etsivät niistä tarjouksia
• uutiskirje ei siis ole kuolemassa, päinvastoin!
Huom! luvut ovat suuntaa-antavia
UUTISKIRJEET
Uutiskirjettä avattiin (2013)
28 % pöytäkone
Mobiilinkäyttö nousi 2011-2013 välisenä aikana +30%
CTR-luvut3,8 % 2011
3,3 % 2012
3,1 % 2013
-10 % 2012-2013
Klikkaukset
Mobiilin klikkausprosentit ovat selkeästi alhaisimmat
41 % mobiili
22 % webmail
14 % pöytäkone
11 % mobiili
19 % webmail
Mobiili vs pöytäkone• responsiivisuus ei ole enää luksusta vaan välttämättömyys uutiskirjeissä (41 % avattiin mobiililla/2013)
• n. 6 miljoonasta eri email-kampanjasta kerätty data kertoo, että mobiilin kautta on vaikeampi saada käyttäjät aktivoitumaan = konversio
• 87 % klikkauksista tapahtuu välittömästi uutis- kirjeen avaamisen jälkeen (ensimmäisellä kerralla)
• mobiilin CTR-luvut ovat selkeästi pienemmät kuin esim. webmailin
Huom! luvut ovat suuntaa-antavia
UUTISKIRJEET
Vinkkejä uutiskirjeensuunnitteluun
UUTISKIRJEET
Yleisiä vinkkejä...• uutiskirjeen tarkoitus on saada käyttäjät aktivoitumaan (klikkaamaan). Suunnittele uutiskirje kuin kyseessä olisi kotisivu= yksinkertainen, visuaalisesti tyylikäs sekä focus käyttäjän aktivoinnissa (konversiossa)
• älä suunnittele itsellesi
• tärkeimmät asiat ylimmäiseksi = konversio
• aloita lyhyemmillä jutuilla (teksteillä). Uutiskirjeen loppuun voi sitten taittaa hieman pidemmät (ei niin tärkeät) asiat, muista kuitenkin kohtuus
UUTISKIRJEET
• liiallinen tieto hämmentää käyttäjät. Kerro siis vain välttämättömät tiedot tuotteesta/palvelusta ja johda heidät tutustumaan lisää
• muista valkoisen tilan käyttö (white space) = sommittelutapa joka antaa muille elementeille huomioarvoa. Esim. CTA-nappi tarvitsee aina valkoista tilaa ympärilleen = parempi konversio
• toista CTA-nappia jos eDM on pitkä (kukaan ei halua scrollata takai-sin ylös klikkaamaan sitä). Muista, että CTA-nappi ei saa olla kuvana
• älä käytä taustakuvia = eivät toimi
Yleisiä vinkkejäuutiskir-jeen suunnit-teluun
UUTISKIRJEET
Yleisiä vinkkejäuutiskir-jeen suunnit-teluun
• muista ettei tärkein asia ole ilmaistu kuvana (sähköpostiohjelmat piilottavat ne usein)
• optimoi aina kuvat (latausnopeus)
• lisää kuviin alt-tekstit
• max. 2-3 fonttia ja muutama väri
• liitä uutiskirjeeseen yrityksen logo = tunnistettavuus/luottamus
• tuplatarkista otsikot, lähettäjä ja uutis-kirjeen aihe. Jos ne ovat epäselvät/oudot merkataan se nopeasti roska-postiksi
• lukija “skannaa” uutiskirjettä. Muista, että otsikot, CTA:t ym. tärkeät asiat nousevat esiin (käytä väriä, boldausta, ikoneita...)
UUTISKIRJEET
Yleisiä vinkkejäuutiskir-jeen suunnit-teluun
• älä tee uutiskirjeestä yli 600 px leveämpää
• muista sosiaalisen median jakonapit = n. 27 % jakaa
• muista footerin tiedot (osoite, linkki postituslistalta poistumiseen sekä muistutus miksi sai tämän uutiskirjeen)
• hae jatkuvasti inspiraatiota maailmalta:http://inspiration.mailchimp.com/#allhttp://www.htmlemailgallery.com/http://htmlemaildesigns.com/
UUTISKIRJEET
Vinkkejä uutiskirjeenvisuaaliseen
suunnitteluun
UUTISKIRJEET
• kaunis suunnittelu ei tarkoita vain “visuaalisesti nätiksi tekemistä”, vaan suunnittelu yhdistää muodot ja toimin-nallisuudet niin, että käyttäjä aktivoituu (hänet johdatellaan konversioon)
• hyvällä visuaalisella ulkonäöllä luodaan käyttäjälle “tarve” palveluun/tuotteeseen = lähes aina ostopäätös tehdään tunteilla (rationaalisen päätöksen osuus on vain n. 5-15%)
• toimiva visuaalinen suunnittelu luo helpon tien konversioon
• mainoksen on tuotava tuotteen/palvelun hyöty ilmi, ts. minkä ongelman tuote/palvelu ratkaisee
Beautiful design brings form and function together to motivate a person to take action, reduce their anxiety towards the action and provide a clear, easy path to conversion.
Beautiful design
https://www.campaignmonitor.com/resources/guides/better-marketing-results/
UUTISKIRJEET
Sommittelu• sommittelu yhdistää mainonnassa käytetyt elemen-tit (typografian, kuvat, värit jne.) yhtenäiseksi toimivaksi kokonaisuudeksi (balanssi)
• löydä focus: kaikki suunnittelu on kommunikointia. Suunnittelu kertoo tarinaa, joten pidä huolta, että kerrot sen parhaimmalla mahdollisella tavalla = focus
• muista visuaalinen hierarkia (elementtien sijoittelua niin, että esim. isoimmat elementit ovat tärkeimpiä ja pienemmät vähemmän tärkeitä (esim. typografiassa otsikoiden selkeät kokoerot)
UUTISKIRJEET
Sommittelu• käytä mainoksessa elementtejä jotka täydentävät toisiaan = tunnistettava linja joka jatkuu koko mainonnan läpi. “Repetition makes for successful compositions.”
• muista myös, että kuvien pitää täydentää toisiaan (kuvauskulmat, värit, tunnelma, tyyli jne.)
• muista white space -tilan käyttö
• linjaa elementit toisiinsa (selkeyttää)
• testaa mainoksen 3 x 3 palstaan jakoa. Tärkeimmät asiat pitäisi sijoittaa keskeisiin risteytyskohtiin.
UUTISKIRJEET
Värien käyttö• varmista, että värien sanoma toimii brändin/ uutiskirjeen aiheen/tuotteen/palvelun kanssa + muista vastavärien käyttö huomioväreinä (esim. CTA:ssa)
• värit ovat yksi tehokkaimmista visuaalisista keinoista herättää huomiota/ohjata käyttäytymistä
• suosi flatcolor -paletteja (nykyaikaa)
• värien pitää toimia yhteen, mutta myös käytettyyn kuvamaailmaan (saako esim. kuvasta värit ilmoitukseen?)
UUTISKIRJEET
Värit• sukupuoli merkkaa myös värien valinnassa = naisilla ja miehillä on omat lempivärinsä.
• jos mainonta on tarkoin suunnattu esim. miehille hyödynnä heidän lempivärejään.
Tutkimus (impact of Color in Marketing) väittää, että jopa 90% ostopäätöksistä voisi perustua pelkästään tuotteen väriin!
https://blog.kissmetrics.com/gender-and-color/?wide=1
https://blog.kissmetrics.com/gender-and-color/?wide=1
UUTISKIRJEET
Keep it simple!• less is more!!
• sinulla on n. 5 sekuntia aikaa esittää uutiskirjeen hyödyt sekä tehdä siitä uskottava
• lukijat “skannaavat” uutiskirjettä = varmista siis että tärkeät asiat nousevat siitä esiin (testaa)
• muista tyhjän tilan käyttö (yksi tehokkaimmista sommittelumuodoista)
• yksinkertaisuus suunnittelussa ei kuitenkaan tarkoita tylsää mainontaa. Oikein toteutettuna se on hyvin tyylikäs ja toimiva
UUTISKIRJEET
White space• white space (negative space) on siis “tila” elementtien välissä
• nopeuttaa mainoksen “skannaamisessa” sekä erottamaan tärkeät elementit toisistaan (johdattelee toimintaan)
• negatiivinen tila tuo esiin positiivisen tilan sisällön (se ei siis vain ole tila johon emme keksineet mitään sisältöä)
• ja vielä varmistuksena, valkoinen tila ei ole aina valkoinen (se voi olla myös harmaa, oranssi...)
Valkoisen tilan käyttö:Kumpi näistä toimii mielestäsi paremmin?
UUTISKIRJEET
Kuvat• “kuva kertoo tuhat sanaa” ei ole turha lause
• kuvia halutaan mainontaan, mutta niiden pitää olla merkityksellisiä (aitoja ihmisiä, tuotekuvia)
• jos kuva on tarpeeksi mielenkiintoinen, se toimii
• oikein valittu kuva/kuvat vetoavat tunteisiin ja on myös järkiperäinen (näyttää esim. tuotteen hyödyt kiinnostavalla ja uniikilla tavalla)
• kuvien rajauksilla voidaan luoda aivan uusi tunnelma + tuoda yksityiskohdat esiin. Samoin muista kuvien kokojen + kuvakulmien merkitys (esim. ihmisen katseen suunta)
UUTISKIRJEET
Kuvat• muista käyttää laadukkaita, merkityksellisiä kuvia
• käsittele kuvat aina huolellisesti
• optimoi aina kuvat sekä lisää niihin alt-tekstit
• älä koskaan taita uutiskirjettä pelkästään kuvien avulla (sähköpostiohjelmien omat blokkaukset estävät niitä näkymästä = sanoma häviää)
• uutiskirjeen “sääntö” = 25% kuvaa ja 75% muuta sisältöä
• älä käytä taustakuvia (eivät toimi)
UUTISKIRJEET
Typografian lukuja• 74 % käyttää sans-serif (groteski, päätteetön) kirjasinta uutiskirjeen otsikoihin
• 64 % käyttää päätteetöntä (sans-serif) kirjasinta uutiskirjeen leipäteksteihin
• suosituimmat fontit otsikoissa (päätteettömät) ovat Arial ja Helvetica - päätteelliset Georgia ja Merriweather
• leipäteksissä suosituimmat Helvetica ja Helvetica Neue ja Arial (päätteettömät), ja päätteellisissä Georgia, Merriweather sekä Times
• suosituin leipätekstin koko on 16 px (44 %)
UUTISKIRJEET
Typografia
http://www.smashingmagazine.com/2015/08/ typographic-patterns-in-html-newsletter-email-design/
http://www.smashingmagazine.com/2014/09/ balancing-line-length-font-size-responsive-web-design/
• älä unohda typografian tärkeyttä
• muista/tunne fontin persoonallisuus
• 2 fonttia riittää hyvin uutiskirjeeseen (otsikko- ja leipis-fontti). Joskus jonkun lisäfontin käyttö on ihan ok = haetaan huomiota
• muista, että boldaukset, rivivälistykset, fonttien koot, värit ym. ovat tehokkaita huomion kerääjiä. Muista, että otsikoiden täytyy erottua aina selkeästi leipätekstistä
• muista aina valinnoissasi luettavuus
UUTISKIRJEET
Typografia
http://www.smashingmagazine.com/2015/08/ typographic-patterns-in-html-newsletter-email-design/
http://www.smashingmagazine.com/2014/09/ balancing-line-length-font-size-responsive-web-design/
• älä käytä liian pientä fonttikokoa (16 px hyvä keskiarvo) + muista mobiili
• tarkasta kontrasti (ohuet fontit esim. tummalla taustalla eivät näy kunnolla)
• yhden palstan käyttö toimii teksteissä parhaiten, mutta älä tee taitosta tylsää
UUTISKIRJEET
CTA (call to action) • toimiva CTA vaatii loistavan ytimekkään tekstin, joka kertoo mitä tapahtuu kun painiketta klikataan. Tämän huomiotta jättäminen laskee tutkimusten mukaan konversiota huomattavasti
• tarjoa CTA:ssa jokin hyöty/etu
• painikkeeksi muotoiltu CTA kerää jopa 28% enemmän klikkauksia kuin pelkkänä linkkinä oleva kehoite
• tee CTA-painikkeesta tarpeeksi suuri (ei liian), että se on helppo klikata mm. mobiililaitteella
• muista hyödyntää valkoisen tilan käyttö
• suosi flatcolor-paletteja
• mallin vihreää (go) sekä punaista (stop) nappia testattiin A/B-testauksella. Kumman uskot toimineen paremmin?
• toinen näistä keräsi jopa 21% paremman konversion
90% parempi konversio
• muista hyvä huomioväri CTA:ssa (vastaväri, sillä aivot/silmät toimivat niin, että ne haluavat löytää vastavärin mainoksesta)
• liian suuri painike vie huomioarvoa kehotteelta + laskee konversiota. CTA ei saisi olla ainut asia, (eikä ensimmäinenkään) minkä käyttäjä huomioi. Hänen tarvitsee ensin vakuuttua tuotteesta/palvelusta = vasta sen jälkeen tulee mahdollinen konversio (uskallus)
• CTA-painikkeen paikka uutiskirjeessä on myös tärkeää. Jos tuote/palvelu on helppo ymmärtää/tuttu asia voi napin sijoittaa heti ylös. Muissa tapauksissa tarvitaan ensin vakuuttelua ennenkuin käyttäjä on mahdollisesti valmis konversioon
CTA (call to action)
34 % parempi konversio pelkästään värin vaihdon avulla!
Hyvä värivalinta saa CTA:lle hyvän huomiarvon
