# Uutiskirjeen brändäys: otsakkeet ja tunnistettava numero

[Canonical HTML page](https://gradiently.design/fi/guide/newsletter-branding)

Postilaatikko on pelkkä nimien ja aiherivien lista, kunnes lukija avaa kirjeesi. Silloin sinulla on yhden otsakkeen verran aikaa osoittaa, että tämä on hänen tilaamansa uutiskirje.

## The short version

- Uutiskirjeen brändäys tarkoittaa yhtenäistä nimeä, nimiötä, palettia ja typografiaa sähköpostissa, verkkoarkistossa sekä numeroita mainostavissa korteissa.
- Sähköpostiotsake suunnitellaan yleensä 1200×600 pikselin kokoiseksi ja näytetään noin 600 pikselin levyisenä, joten tekstin pitää olla suurta ja vähäistä.
- Substack-julkaisun otsake on 1456×816 pikseliä ja toimii myös numeron esikatselukuvana jaettaessa.
- Luotettavin nimiöjärjestelmä pitää nimen ja asettelun samoina ja vaihtaa yhtä asiaa numeroittain, esimerkiksi numeroa, otsikkoa tai kauden väriä.
- Jokainen numero ansaitsee kaksi tai kolme somekokoista esittelykorttia, jotka tehdään samalla asettelulla muutamassa minuutissa.

**Uutiskirjeen brändäys** saa lukijan tunnistamaan numerosi ennen lukemista: sama nimiö jokaisen sähköpostin yläosassa, verkkoarkistossa jatkuva paletti ja kirjasin sekä samaan julkaisuun kuuluvilta näyttävät somekortit. Suunnittele sähköpostiotsake kokoon 1200×600 ja Substack-otsake kokoon 1456×816. Pidä asettelu samana ja vaihda vain numeron tiedot. Lukijat palaavat vakaalta tuntuviin julkaisuihin, ja yhtenäinen ilme nopeuttaa jokaisen numeron tekemistä.

## Uutiskirjeen kuvakoot

| Aineisto | Koko | Huomio |
| --- | --- | --- |
| Sähköpostiotsake | 1200×600 px | Näkyy useimmissa postilaatikoissa noin 600 px leveänä |
| Substack-julkaisun otsake | 1456×816 px | Myös numeron jakamisen esikatselukuva |
| Linkin esikatselu (Open Graph) | 1200×630 px | Omalle arkistolle tai laskeutumissivulle |
| Medium-artikkelin kuva | 1400×788 px | Jos julkaiset sisällön myös siellä |
| X-julkaisu | 1600×900 px | Esittelykortti jokaiselle numerolle |
| Instagramin ja LinkedInin pystykuva | 1080×1350 px | Esittely- ja sitaattikortit |
| Sähköpostiallekirjoitus | 600×200 px | Pieni tilauslinkin sisältävä banneri |

Suunnittele otsake kaksinkertaisena näyttöleveyteen nähden, jotta se pysyy terävänä suuren pikselitiheyden näytöillä.

- Sähköpostiotsake 1200×600: 1200 × 600
- Substack-otsake 1456×816: 1456 × 816
- Esittelykortti 1080×1350: 1080 × 1350
- X-kortti 1600×900: 1600 × 900

Neljä muotoa, yksi julkaisu. Sähköpostiotsake on levein ja matalin, joten siihen mahtuu vähiten tekstiä.

Tarkemmat alustakohtaiset mitat löytyvät oppaista [Substack-otsakkeen koko](https://gradiently.design/fi/guide/substack-header-size) ja [sähköpostiotsakkeen suunnittelu](https://gradiently.design/fi/guide/email-header-design). Jos julkaiset myös LinkedInissä, sen uutiskirjekannella on omat sääntönsä, joita käsittelee [LinkedIn-uutiskirjeen kansi](https://gradiently.design/fi/guide/linkedin-newsletter-cover).

## Suunnittele joka numerolle toimiva nimiö

Nimiö on uutiskirjeesi pysyvä yläosa: nimi, mahdollinen lyhyt kuvaus ja numeron tiedot. Painetut lehdet ovat käyttäneet ajatusta reilusti yli vuosisadan, koska se toimii. Lukija löytää nimen joka kerta samasta paikasta ja sen alla sisältö voi vaihtua vapaasti.

Leveä uutiskirjeotsake, jossa lukee The Slow Kitchen, numero 48, sunnuntai sekä lyhyt kuvaus

Sähköpostiotsake: suuri nimi, pieni numero ja päivä yläpuolella sekä yksirivinen lupaus alla.

1. **Pidä nimi ja paikka samoina** Sama kirjasin, koko ja sijainti joka numerossa. Tämän osan lukijat oppivat tunnistamaan.
2. **Valitse muuttuva asia** Valitse yksi muuttuja: numero, päivämäärä, otsikko tai kauden väri. Yksi riittää.
3. **Pidä teksti poissa reunoilta** Jotkin sähköpostisovellukset rajaavat tai skaalaavat otsakkeita. Pidä sanat keskimmäisellä 80 prosentilla.
4. **Kirjoita kunnollinen vaihtoehtoinen teksti** Osa lukijoista pitää kuvat oletusarvoisesti pois päältä. Vaihtoehtoinen teksti, kuten ”The Slow Kitchen, numero 48”, säilyttää nimiön tehtävän ilman kuvaa.

Jos vaihdat yhden asian numeroittain, valitse merkityksellinen asia. Viikoittaisen ruokakirjeen väri voi seurata vuodenaikoja. Kuukausittainen talouskirje voi nostaa otsakkeeseen kuukauden tärkeimmän luvun.

- Kevään numerot: `linear-gradient(120deg, #fef3c7 0%, #a7f3d0 100%)`
- Kesän numerot: `linear-gradient(120deg, #fde68a 0%, #fb923c 100%)`
- Syksyn numerot: `linear-gradient(120deg, #fed7aa 0%, #9a3412 100%)`
- Talven numerot: `linear-gradient(120deg, #e0e7ff 0%, #475569 100%)`

Neljä vuodenaikataustaa saman nimiön takana. Lukija tuntee vuoden kuluvan, vaikka julkaisu pysyy samana.

## Postilaatikossa luettava paletti ja typografia

Uutiskirje on enimmäkseen tekstiä, joten typografia on otsaketta tärkeämpää. Käytä yhtä luettavaa leipätekstikirjasinta, erottuvaa otsikkokirjasinta nimelle ja yhtä tehosteväriä linkeille ja painikkeille. Pidä leipäteksti tummana vaalealla: moni käyttää tummaa tilaa, ja sähköpostisovellukset kääntävät värejä tavoilla, joita et voi täysin hallita.

- Paperi: #fbf7f0
- Muste: #1f1a17
- Ruosteinen otsikko: #7c2d12
- Meripihkalinkki: #d97706
- Jakaja: #e7dccb

Lämmin toimituksellinen paletti. Paperi ja muste hoitavat lukemisen, ruoste kuuluu nimeen ja meripihka vain linkkeihin.

### Hajoaa postilaatikossa

- Tärkeät sanat kuvassa ilman vaihtoehtoista tekstiä
- Ohut vaaleanharmaa leipäteksti
- Pelkkää tekstiä täynnä oleva otsake ilman väljyyttä
- Taustakuvat leipätekstin takana

### Kestää postilaatikossa

- Kaikki tärkeä oikeana tekstinä
- Vahvakontrastinen leipäteksti vaaleassa ja tummassa tilassa
- Otsake, jossa nimi on selkeä ja sen ympärillä on tilaa
- Liukuvärit vain otsakekuvassa

Sähköpostiohjelmat suhtautuvat CSS:ään tiukasti, joten liukuvärit kuuluvat otsakekuvaan eikä koodiin. [Liukuvärit sähköpostissa](https://gradiently.design/fi/guide/gradients-in-email) selittää, mitkä ratkaisut toimivat missäkin sovelluksissa.

## Esittelykortit jokaiselle numerolle

Useimmat uutiskirjeet kasvavat jakamisten ja somejulkaisujen kautta. Pelkkä linkki yleiskuvalla jää helposti huomiotta. Tee joka numerolle kaksi tai kolme korttia samasta pohjasta: yksi numeron otsikolla, toinen sisällöstä poimitulla rivillä ja toistuvasti käytettävä tilauskortti.

Pystyesittelykortti, jossa lukee Miksi leipäsi maistuu lattealta ja The Slow Kitchen, numero 48

Numeron kortti Instagramiin ja LinkedIniin: otsikko, numero ja lukupaikka.

Vaakasitaattikortti, jossa lukee Suola on ajoituskysymys ja Tämän viikon numerosta

Poimittu rivi X:ään ja Blueskyhin. Lyhyt, täsmällinen ja hieman yllättävä toimii parhaiten.

- **Numerokortti:** otsikko ja numero, julkaistaan ilmestymispäivänä.
- **Sitaattikortti:** yksi rivi sisällöstä, julkaistaan päivän tai kahden kuluttua. Katso [sitaattikortin suunnittelu](https://gradiently.design/fi/guide/quote-card-design).
- **Tilauskortti:** mitä lukijat saavat ja kuinka usein, kiinnitettynä profiiliin.
- **Merkkipaalukortti:** numero 50, 100 tai vuosi kirjeitä.

Jos kirjoitat viikoittain, tämä osuus kannattaa automatisoida. Gradiently Prossa voit pitää numerot taulukossa ja luoda jokaisesta rivistä kortin joukkoluonnilla. Voit myös suunnitella yhden kortin ja muuttaa sen kaikkiin kokoihin kerralla. Automaattinen muste valitsee kullekin riville vaalean tai tumman tekstivärin taustan omista väreistä, joten otsikko pysyy luettavana kauden väristä riippumatta. [Tekstien kirjoittaminen kuviin](https://gradiently.design/fi/guide/writing-copy-for-visuals) auttaa itse sanojen kanssa.

## Tee ilmeestä vain sinun

Uutiskirjealustat tarjoavat kaikille samoja harvoja teemoja, joten erottuva otsake on niitä harvoja paikkoja, joissa voit erottua. Gradientlyn Mark on elävä tausta, jolla kukaan muu ei voi viedä tiedostoja lunastettuasi sen. Se sopii julkaisulle, jonka nimiön pitää säilyä tunnistettavana kasvun aikana.

## FAQ

### Minkä kokoinen uutiskirjeen sähköpostiotsakkeen pitää olla?

Suunnittele se kokoon 1200×600 pikseliä. Useimmat postilaatikot näyttävät sen noin 600 pikselin levyisenä, ja suurempi tiedosto pitää sen terävänä suuren pikselitiheyden näytöillä.

### Minkä kokoinen Substackin otsakekuva on?

Substack-julkaisun otsake on 1456×816 pikseliä. Se toimii myös esikatselukuvana julkaisua jaettaessa.

### Miten teen uutiskirjeestäni ammattimaisen näköisen?

Pidä nimiö ja nimen sijainti samana joka numerossa, käytä yhtä otsikkokirjasinta ja yhtä luettavaa leipätekstikirjasinta sekä rajaa linkkien väri yhteen tehosteeseen.

### Pitäisikö otsake vaihtaa joka uutiskirjenumerossa?

Pidä nimi ja asettelu samoina ja vaihda vain yksi osa, kuten numero, otsikko tai kauden väri. Lukija tunnistaa pysyvän osan.

### Toimivatko liukuvärit sähköpostiuutiskirjeissä?

Laita liukuvärit otsakekuvaan CSS:n sijaan, koska monet sähköpostisovellukset sivuuttavat CSS-liukuvärit. Pidä leipäteksti oikeana tekstinä ja sen kontrasti vahvana.