Lyhyesti
- Bannerit ovat leveitä: blogi- ja sähköpostibannerin kuvasuhde on noin 2:1, LinkedIn-yrityskannen noin 6:1.
- Leveässä bannerissa silmä kulkee vasemmalta oikealle. Sanojen kannattaa olla yhtenä tiiviinä lohkona, ei koko leveydelle hajotettuina.
- Useimmat somebannerit jäävät osin profiilikuvan alle tai rajautuvat puhelimissa. Tärkeä sisältö kuuluu keskialueelle.
- YouTube-kanavan banneri on 2560 × 1440 pikseliä, mutta vain noin 1546 × 423 pikselin keskikaistale näkyy kaikilla laitteilla.
- Roll upien kaltaiset painetut bannerit luetaan metrien päästä, joten ne tarvitsevat paljon vähemmän sanoja ja suuremman tekstin kuin verkkobannerit.
Tällä sivulla
Hyvä bannerin suunnittelu hyödyntää muotoa. Banneri on leveä ja matala, joten anna sille yksi tiivis tekstilohko: lyhyt otsikko ja ehkä tukirivi paikassa, jota mikään ei peitä. Tausta kantaa värin muulle leveydelle. Tarkista ensin alustan koko ja turva-alue. LinkedIn-profiilibanneri on 1584 × 396 pikseliä, ja profiilikuva peittää vasemman alakulman. YouTube-banneri on 2560 × 1440, mutta puhelimessa näkyy vain keskikaistale.
Bannerikoot verkkoon ja someen
Koko (px)
Muoto
Mikä peittää sitä
Koko (px)
Muoto
Mikä peittää sitä
Muoto
Mikä peittää sitä
Koko (px)
Muoto
Mikä peittää sitä
Koko (px)
Muoto
Mikä peittää sitä
Koko (px)
Muoto
Mikä peittää sitä
Koko (px)
Muoto
Mikä peittää sitä
Koko (px)
Muoto
Mikä peittää sitä
Koko (px)
Muoto
Mikä peittää sitä
Blogibanneri 2:1
1200 × 600
X-otsake 3:1
1500 × 500
LinkedIn-banneri 4:1
1584 × 396
LinkedIn-yrityskansi 6:1
2256 × 382
Tekstin taitto leveään banneriin
Banneria luetaan tekstirivin tavoin: nopeasti vasemmalta oikealle. Koko leveydelle hajautettu teksti pakottaa silmän kulkemaan liian pitkälle. Ryhmittele sanat yhteen, noin kolmanneksen levyiseen lohkoon. Tee otsikosta luettava silloinkin, kun koko banneri pienenee puhelimen levyiseksi.
LinkedIn-profiilibanneri, jonka sanat pysyvät poissa vasemman alakulman profiilikuvan alta.
X-otsake: yksi rivi, yksi tieto, ei mitään tärkeää avatarin kulmassa.
Näin matalassa muodossa hierarkian pitää olla yksinkertainen. Kaksi tasoa on yleensä enimmäismäärä: otsikko ja pieni rivi sen yllä tai alla. Kolmas kuuluu luultavasti itse profiiliin. Visuaalinen hierarkia kertoo, miten koko ja välit hoitavat työn ilman lisäkoristeita.
Turva-alueet ja rajaus
Jokainen alusta rajaa tai peittää bannerinsa eri tavoin tietokoneessa ja puhelimessa. Varma tapa on kaikkialla sama: anna taustan ulottua reunasta reunaan ja pidä sanat ja logot keskialueella poissa avatarin kulmasta.
- 1
Etsi peittyvä kulma
LinkedInissä, X:ssä ja Blueskyssa profiilikuva peittää vasemman alakulman. Jätä siihen vain taustaa.
- 2
Varaudu puhelinrajaukseen
Facebook ja Etsy leikkaavat sivuja puhelimissa. Pidä sanat leveyden keskimmäisessä kahdessa kolmanneksessa.
- 3
Käytä YouTuben keskikaistaletta
2560 × 1440-kehyksestä vain noin 1546 × 423 pikselin keskiosa näkyy kaikilla laitteilla. Sijoita nimi ja sanat siihen.
- 4
Tarkista oikeassa koossa
Lataa kuva ja katso sitä puhelimessa ja kannettavalla. Suunnittelutyökalun esikatselu ei näytä alustan käyttöliittymää. Alustat myös muuttavat asettelujaan, joten tarkista niiden ohjesivut ennen suurta lanseerausta.
Painetut bannerit: roll upit ja tapahtumakyltit
Tavallisesti 850 × 2000 mm:n roll upissa ongelma on päinvastainen: se on korkea ja sitä katsotaan metrien päästä ohikulkiessa. Logo ja otsikko kuuluvat yläkolmannekseen silmien tasolle. Alakolmannekseen tulee hyvin vähän, sillä se jää pöytien ja jalkojen taakse. Tekstin pitää erottua huoneen toiselta puolelta. Kysy painolta tarkkuusvaatimus. Suuret bannerit painetaan yleensä selvästi alle 300 dpi:n tiedostoista, koska niitä ei katsota läheltä.
Vältä
- Kappaletta, joka selittää toimintasi
- Sanoja koko leveydelle levitettynä
- Pientä tekstiä avatarin peittämässä kulmassa
- Levotonta kuvaa otsikon takana
- Tärkeitä tietoja roll upin alareunassa
Tee näin
- Neljästä kahdeksaan sanaa, jotka kertovat kuka olet
- Yksi tiivis tekstilohko
- Vain taustaa käyttöliittymän kohdalla
- Rauhallinen värialue sanojen takana
- Logo ja otsikko silmien tasolle
Messuosastoihin ja lavoille katso tapahtumataustan suunnittelu, suuriin paperiformaatteihin julistekoot.
Yksi ilme kaikkiin bannereihin
Useimmat tarvitsevat viisi tai kuusi banneria kerralla: LinkedIniin, X:ään, YouTubeen, sähköpostiin ja verkkosivun pääkuvaksi. Ne näyttävät yhdeltä brändiltä, kun tausta, typografia ja väri pysyvät ja vain taitto muuttuu. Liukuväri sopii tähän hyvin, koska siinä ei ole rajattavaa kohdetta, kunhan se piirtyy kuhunkin muotoon venyttämisen sijaan.
linear-gradient(100deg, #0e1a2b 0%, #183b56 40%, #2a7f8f 75%, #9fd8cb 100%)Gradientlyssä Mark piirtyy uudelleen joka bannerikokoon, siirtää rauhallisimman alueensa sanojen taakse ja antaa Automaattisen musteen valita vaalean tai tumman tekstin riveittäin. Prolla yksi suunnitelma muuttuu kaikkiin kokoihin kerralla, joten LinkedIn-, X- ja YouTube-bannerit syntyvät yhdessä. Yhtä tunnistettavaa taustaa käsittelee brändin oma ilme.
Usein kysyttyä
Minkä kokoinen bannerin pitäisi olla?
Käyttökohteen mukaan: 1584 × 396 LinkedIn-profiiliin, 1500 × 500 X:ään, 2560 × 1440 YouTubeen ja 1200 × 600 blogiin tai sähköpostiin.
Mihin teksti sijoitetaan somebannerissa?
Yhteen tiiviiseen lohkoon keskelle tai oikealle, poissa vasemmasta alakulmasta, jossa profiilikuva yleensä on.
Mikä on YouTube-bannerin turva-alue?
Noin 1546 × 423 pikseliä 2560 × 1440-kuvan keskellä. Vain tämä alue näkyy kaikilla laitteilla.
Kuinka monta sanaa bannerissa pitäisi olla?
Otsikossa neljästä kahdeksaan ja korkeintaan yksi pieni tukirivi. Bannerit nähdään lyhyesti ja usein pieninä.
Minkä tarkkuuden painettu banneri tarvitsee?
Kysy painolta. Kaukaa katsottavat suuret bannerit painetaan yleensä selvästi alle 300 dpi:n tiedostoista lopullisessa koossa.
Kirjoittanut Gradiently
Gradientlyn tiimi. Gradiently on Markien ympärille rakennettu suunnittelutyökalu: eläviä liukuvärejä, joiden ansiosta kaikki suunnittelemasi näyttää omaltasi.
Katso profiilimme