# Instagram-mainosten suunnittelu: syöte, tarinat ja Reels [Canonical HTML page](https://gradiently.design/fi/guide/instagram-ad-design) Instagramissa mainos tulee ystävän loman ja sisällöntuottajan aamurutiinin väliin. Toimiva mainos kuuluu joukkoon ja saa oman sommittelun joka sijoitteluun. ## The short version - Instagram-mainokset näkyvät syötteessä, tarinoissa ja Reelsissä, ja jokainen sijoittelu tarvitsee oman sommittelun. - Käytä syötemainoksiin 1080×1350-pystykuvia ja tarina- sekä Reels-mainoksiin 1080×1920-kuvia. - Pidä tarinoissa teksti ja logot poissa noin 250 ylimmästä ja alimmasta pikselistä. Reelsissä vältä myös alinta kolmannesta ja oikeaa reunaa. - Brändin omien julkaisujen ilmettä seuraavat Instagram-mainokset tuntuvat syötteeseen kuuluvilta häiritsevien sijaan. - Kun teet samasta työstä useita versioita säilyttäen ilmeen ja vaihtaen viestin, Metan jakelujärjestelmä saa vertailtavia vaihtoehtoja. Vahva **Instagram-mainosten suunnittelu** alkaa sijoittelusta. Syötemainokset ovat 1080×1350-pystykuvia muiden julkaisujen joukossa. Tarina- ja Reels-mainokset ovat 1080×1920-kokoisia koko näytön kuvia, joiden päällä Instagramin käyttöliittymä peittää ylä- ja alareunaa sekä Reelsissä oikeaa reunaa. Tee versio jokaiseen, pidä sanat turva-alueella ja anna mainokselle omien julkaisujesi ilme, jotta se tuntuu syötteen osalta eikä keskeytykseltä. ## Instagram-mainoskoot eri sijoitteluihin | Sijoittelu | Koko | Kuvasuhde | Pidä sanat poissa | | --- | --- | --- | --- | | Syöte | 1080×1350 px | 4:5 | Reunoilta, tykkäys- ja kuvatekstipalkki on kuvan alla | | Syöte, neliö | 1080×1080 px | 1:1 | Reunoilta | | Tarinat | 1080×1920 px | 9:16 | 250 ylimmästä ja alimmasta pikselistä | | Reels | 1080×1920 px | 9:16 | Yläkaistaleesta, alimmasta kolmanneksesta ja oikeasta reunasta | Pystymuoto voittaa syötteessä, koska se vie eniten korkeutta. [Instagram-julkaisun koko](https://gradiently.design/fi/guide/instagram-post-size) selittää syyn. - Syöte 1080×1350: 1080 × 1350 - Neliö 1080×1080: 1080 × 1080 - Tarinat ja Reels 1080×1920: 1080 × 1920 Syötteen ja koko näytön muodot eroavat niin paljon, ettei yksi sommittelu palvele molempia. ## Syötemainosten suunnittelu Syötemainokset nähdään samassa rytmissä julkaisujen kanssa. Parhaat näyttävät ensin hyvältä julkaisulta ja vasta sitten mainokselta. Aloita kuvasta, jonka kohdalla ihmiset pysähtyisivät: tuote, tulos tai vahva tekstirivi omalla taustallasi. Pidä logo pienenä. Meta merkitsee mainoksen sponsoroiduksi ja näyttää nimesi sen yläpuolella, joten brändi näkyy jo. Karusellimainokset seuraavat samoja sääntöjä sivu kerrallaan: ensimmäinen kortti pysäyttää selauksen, seuraavat kertovat kukin yhden asian. [Instagram-karuselli](https://gradiently.design/fi/guide/instagram-carousel-design) käsittelee järjestystä. ## Tarinamainosten suunnittelu Tarinamainokset ilmestyvät katselijan tarinoiden väliin ja täyttävät näytön. Ne ohitetaan nopeasti napauttamalla, joten viestin on toimittava ensimmäisessä ruudussa. Käytä [Instagram-tarinan kokoa](https://gradiently.design/fi/guide/instagram-story-size) ja turva-alueita: profiili ja etenemispalkki ovat ylhäällä, toimintakehotus alhaalla. Sijoita otsikko keskiosan yläpuolelle ja jätä keskiosan alaosa vapaaksi lähelle mainospainiketta. Instagram-syötteen pystymainos, jossa lukee Kesäpellavaa, 4 väriä ja sen yläpuolella Uusi kausi Syöteversio: ensin julkaisu, jossa on yksi lause ja yksi lisätieto. Sama pellavamainos pystymuodossa, sanat keskiosan yläpuolella Tarina- ja Reels-versio on sommiteltu uudelleen. Sanat ovat korkealla alareunan käyttöliittymän ulottumattomissa. ## Reels-mainosten suunnittelu ja turva-alue Reels-mainoksilla on sama 1080×1920-muoto, mutta Instagramin raskain käyttöliittymä: tilin nimi, kuvateksti ja painike alhaalla sekä tykkäys-, kommentointi- ja jakokuvakkeet oikealla. Tarinassa turvassa olevat sanat voivat peittyä Reelsissä. Pidä teksti ylempänä ja enemmän vasemmalla. Jätä alin kolmannes taustaksi. [Somen turva-alueet](https://gradiently.design/fi/guide/social-media-safe-zones) näyttää ne rinnakkain. ### Tarinamainos - Käyttöliittymä vain ylhäällä ja alhaalla - Ohitetaan napauttamalla, näkyy hetken - Viestin on toimittava ensimmäisessä ruudussa - Keskiosan alaosa jää painikkeen lähelle ### Reels-mainos - Käyttöliittymä alhaalla ja oikealla - Toistuu videona, usein silmukkana - Liike herättää huomion, sanat pysyvät paikallaan - Jätä alin kolmannes ja oikea reuna vapaiksi Reels suosii liikettä. Paikallaan pysyvä työ, jossa tausta liikkuu hitaasti tai tekstirivi nousee esiin, sopii videoiden joukkoon ilman kuvauksia. Pidä sanat riittävän paikallaan luettaviksi. [Animoitu Instagram-julkaisu](https://gradiently.design/fi/guide/animated-social-posts) näyttää sopivan määrän. ## Instagramiin luontevasti sopivat mainokset ### Näyttää mainokselta - Suuri logo hallitsee kuvaa - Useita tarjouksia ja tekstilohko ehtoja - Valmispohjan värit ja fontit - Teksti aivan reunoissa - Omista julkaisuistasi poikkeava ilme ### Näyttää luontevalta - Tuote tai ajatus pääosassa - Yksi viesti, lisätiedot kuvatekstissä - Oma tausta, värit ja fontit - Väljät marginaalit ja turva-alueiden noudattaminen - Jatkuu siitä, mitä ihmiset jo seuraavat ## Versioiden tekeminen ilmettä kadottamatta Metan jakelu toimii parhaiten muutamalla valittavalla mainosversiolla. Samaan mainokseen kyllästytään, kun se pyörii viikkoja. Ratkaisu on vaihtelu kiinteän ilmeen sisällä: sama taustaperhe ja typografia, mutta muuttuva viesti, tuote tai valo. Tässä neljä saman reseptin versiota. - Versio A: hiekka: `linear-gradient(160deg, #f5efe6 0%, #e7d8c3 45%, #c9b18f 100%)` - Versio B: salvia: `linear-gradient(160deg, #f5efe6 0%, #d9e2d0 45%, #9fb08a 100%)` - Versio C: savi: `linear-gradient(160deg, #f5efe6 0%, #e8d3cf 45%, #c29489 100%)` - Versio D: taivas: `linear-gradient(160deg, #f5efe6 0%, #d6dde6 45%, #8fa0b5 100%)` Yksi pellavanvalkoinen pohja, neljä pehmeää väriversiota neljälle tuotevärille. Mainokset eroavat, brändi pysyy samana. 1. **Lukitse ilme** Taustaperhe, fontit, logon sijainti ja marginaalit eivät muutu versioiden välillä. 2. **Valitse yksi muuttuva asia** Viesti, tuote, väritys tai aloitusruutu. Vaihda yhtä asiaa versiota kohden, jotta opit, mikä vaikutti tuloksiin. 3. **Tee syöte- ja pystyversiot yhdessä** Jokainen versio saa erikseen sommitellut 1080×1350- ja 1080×1920-muodot. 4. **Lataa yhtenä sarjana** Ryhmittele kunkin version sijoittelumuodot, jotta Meta näyttää oikean muodon oikeassa paikassa. Gradientlyssä suunnittelet syöteversion kerran ja muutat Prolla sen tarina- ja Reels-kokoon yhdellä kertaa. Mark piirtyy uudelleen jokaisessa muodossa ja siirtää rauhallisen alueensa sanojen taakse, joten mikään ei päädy vilkkaaseen kohtaan. Monista sivu jokaiselle versiolle ja muuta vain lausetta. Testausmenetelmä löytyy oppaasta [mainosversioiden testaus](https://gradiently.design/fi/guide/ad-creative-testing), ja saman kampanjan Facebook-osuus oppaasta [Facebook-mainosten suunnittelu](https://gradiently.design/fi/guide/facebook-ad-design). ## FAQ ### Minkä kokoisia Instagram-mainosten pitäisi olla? Käytä syötemainoksiin 1080×1350 ja tarina- sekä Reels-mainoksiin 1080×1920. Myös neliö 1080×1080 toimii syötteessä. ### Mikä on Instagram-tarinamainoksen turva-alue? Pidä teksti ja logot poissa noin 250 ylimmästä ja alimmasta pikselistä 1080×1920-kuvassa, jossa profiilipalkki ja toimintakehotus sijaitsevat. ### Ovatko Reels-mainokset samoja kuin tarinamainokset? Niillä on sama 1080×1920-muoto, mutta Reelsissä on enemmän käyttöliittymää alhaalla ja oikealla. Sanojen on siis oltava ylempänä ja enemmän vasemmalla. ### Miten teen Instagram-mainoksista vähemmän mainosmaisia? Suunnittele ne parhaiden julkaisujesi tapaan: oma tausta ja fontit, yksi viesti, pieni logo ja väljät marginaalit. ### Kuinka monta versiota Instagram-mainoksesta kannattaa tehdä? Alkuun riittää muutama, esimerkiksi kolme tai neljä. Vaihda jokaisessa yhtä asiaa ja säilytä sama ilme.