# Bluesky-bannerin koko: 3000 × 1000 ja postauskuvat

[Canonical HTML page](https://gradiently.design/fi/guide/bluesky-banner-size)

Bluesky-bannerisi on profiilin levein osa ja ensimmäinen asia, jonka uusi seuraaja näkee. Tässä koko, profiilikuvan peittämä kulma ja postauskuvien mitoitus.

## The short version

- Bluesky-bannerin koko on 3000×1000 pikseliä eli profiilin yläreunan 3:1-otsakekuva.
- Pyöreä profiilikuva peittää bannerin vasenta alakulmaa, joten älä laita sinne sanoja tai logoja.
- Bannerin rajaus vaihtelee hieman puhelimella ja tietokoneella, joten tärkeät yksityiskohdat kuuluvat keskelle.
- Suositeltu Bluesky-postauskuvan koko on 1600×900 pikseliä eli 16:9-vaakakuva.
- Blueskyssä voit lisätä vaihtoehtoisen tekstin jokaiseen kuvaan. Selkeä kuvaus tekee kuvapostauksesta hyödyllisemmän.

**Bluesky-bannerin koko** on 3000×1000 pikseliä. Leveä 3:1-otsakekuva kulkee profiilisi yläreunassa. Pyöreä profiilikuva peittää sen vasemman alakulman, ja näkyvä rajaus vaihtelee hieman puhelinsovelluksen ja sivuston välillä. Pidä siis sanat ja logot kuvan keskellä ja oikealla, erossa profiilikuvasta. Postausten sisäisiin kuviin käytä 1600×900 pikselin 16:9-vaakamuotoa tai pystykuvaa, kun sisältö on korkeaa.

## Bluesky-bannerin mitat

| Kuva | Koko | Kuvasuhde |
| --- | --- | --- |
| Profiilibanneri | 3000×1000 px | 3:1 |
| Postauskuva, vaaka | 1600×900 px | 16:9 |
| Postauskuva, pysty | 1080×1350 px | 4:5 |
| Postauskuva, neliö | 1080×1080 px | 1:1 |

Banneri on ainoa Bluesky-kuva, jonka muoto on kiinteä. Postauskuvilla voi olla muitakin suhteita.

- Bluesky-banneri 3:1: 3000 × 1000
- X-otsake 3:1: 1500 × 500
- LinkedIn-banneri 4:1: 1584 × 396

Bluesky-bannerilla on sama 3:1-muoto kuin X:llä mutta kaksinkertaiset pikselimitat, joten yksi suunnitelma palvelee molempia. LinkedInin banneri on paljon kapeampi.

Koska Bluesky-bannerin ja [X-otsakkeen](https://gradiently.design/fi/guide/x-header-size) suhde on 3:1, suunnittele kerran kokoon 3000×1000 ja vie X:ää varten 1500×500-kopio. Lisäresoluutio pitää hienon tekstin ja liukuvärit terävinä suurilla tarkkapikselisillä näytöillä. Vie grafiikka ja teksti PNG:nä, valokuvat JPEG:nä.

## Missä profiilikuva peittää banneria

Profiilissa pyöreä kuva sijaitsee bannerin alareunassa vasemmalla. Tähän kulmaan suunniteltu sisältö peittyy osittain tai kokonaan näytöstä riippuen. Muu banneri on avoin, mutta oikeaa reunaa saatetaan rajata kapeilla puhelimilla. [Somen suoja-alueet](https://gradiently.design/fi/guide/social-media-safe-zones) kartoittaa saman ongelman kaikilla alustoilla.

| Alue | Likimääräinen sijainti | Sijoita tähän |
| --- | --- | --- |
| Profiilikuvan kulma | Vasen kolmannes, alempi puolisko | Vain taustaa |
| Keskiosa | Keskimmäinen kolmannes, koko korkeus | Otsikko, logo tai pääkuva |
| Oikea | Oikea kolmannes | Tukitietoa, ei mitään olennaista |
| Ylä- ja alareuna | Noin 100 px kumpikin | Vain taustaa, sillä rajaukset vaihtelevat |

Käytännön kartta, ei virallisia pikseliarvoja. Esikatsele banneri puhelimella ja verkossa ennen päätöstä.

3000×1000-Bluesky-banneri, jonka keskellä lukee Muistiinpanoja hitaasta designista ja vasen alakulma on vapaa profiilikuvalle

Sanat keskellä, vasen alakulma profiilikuvalle ja tausta reunasta reunaan.

## Bluesky-banneri-ideoita

Banneri ei tarvitse paljon sisältöä. Se on nimesi ja esittelysi takana, joten parhaiten toimii tunnelma ja yksi ajatus: mitä teet, mitä julkaiset tai pelkkä omaksi tunnistettava väri. Levoton banneri kilpailee profiilikuvan ja heti alla olevan esittelytekstin kanssa.

- **Pelkkä tunnelma.** Liukuväri tai materiaali omissa väreissäsi ilman sanoja. Rauhallinen eikä vanhene.
- **Yksi rivi.** Mitä seuraaja saa: ”Päivittäisiä typografiamuistiinpanoja”, ”Kenttä-äänityksiä rannikolta”.
- **Työsi.** Leveä rajaus valokuvasta, kuvituksesta tai tuotteesta, kohde keskimmäisessä kolmanneksessa.
- **Ajankohtainen asia.** Kirja, julkaisu tai näyttely päivämäärineen. Muista vaihtaa se tapahtuman jälkeen.

- Taivaasta syvään siniseen: `linear-gradient(100deg, #0a1a3f 0%, #1d4ed8 50%, #7dd3fc 100%)`
- Myöhäinen aurinko keskellä: `radial-gradient(ellipse at 60% 40%, #fde68a 0%, #fb923c 40%, #7c2d12 90%)`
- Yövioletti: `linear-gradient(100deg, #111827 0%, #312e81 55%, #a78bfa 100%)`
- Aamu-utu: `linear-gradient(100deg, #f8fafc 0%, #e0f2fe 50%, #bae6fd 100%)`

Neljä banneripohjaa. Jokainen pitää tummimman tai rauhallisimman alueensa vasemmalla, jossa profiilikuva tarvitsee kontrastia erottuakseen.

Huomaa jokaisen vasen reuna. Profiilikuva tarvitsee kontrastia banneriin erottuakseen. Tummempi tai yksinkertaisempi vasen reuna auttaa vaaleaa profiilikuvaa, vaalea taas tummaa. Sama periaate koskee [logoa liukuväritaustalla](https://gradiently.design/fi/guide/logo-on-gradient-background).

### Vältä

- Logo tai nimi vasemmassa alakulmassa profiilikuvan alla
- Pieni teksti, joka kutistuu puhelimella olemattomaksi
- Valokuva, jonka kohde on aivan reunassa
- Levoton kuvio esittelytekstin takana
- Kokoon venytetty 1500×500-tiedosto

### Tee näin

- Tärkeä sisältö keskimmäiseen kolmannekseen
- Yksi suuri tekstirivi tai ei sanoja lainkaan
- Kohteet keskelle, reunoille taustaa
- Rauhallinen alue alareunaan
- Täysi 3000×1000-vienti

Useimmat banneriongelmat syntyvät, kun suunnitellaan kannettavalla eikä koskaan tarkisteta puhelinta. Lataa banneri, avaa profiili sovelluksessa ja sitten tietokoneen selaimessa. Katso molemmissa profiilikuvan alla oleva kulma ja oikea reuna. Jos tärkeää sisältöä leikkautuu, siirrä sitä kohti keskikohtaa ja lataa uudelleen. Minuutin työ estää banneria näyttämästä huolimattomalta jokaiselle uudelle kävijälle.

## Bluesky-postauskuvan koko

Postauskuvan varma koko on 1600×900: se näkyy kokonaan puhelimen ja tietokoneen syötteessä. 1080×1350-pystykuvat ovat sallittuja ja vievät enemmän pystysuuntaista tilaa, mikä sopii julisteille ja kaavioille. Syöte voi silti näyttää lyhyemmän esikatselun, kunnes kuvaa napautetaan. Voit liittää postaukseen useita kuvia, jotka järjestetään ruudukoksi, joten pidä sarjan kuvasuhteet samoina.

1600×900-Bluesky-postauskuva ilmoittaa uutiskirjeen numeron 40 ilmestyneen

Vaakapostauskuva koossa 1600×900, Blueskyn turvallisin muoto.

1080×1350-pystypostauskuva lauantain painotuotemessuista

Pystyjuliste koossa 1080×1350. Se vie enemmän tilaa syötteessä, mutta esikatselu on joskus lyhyempi.

> **Kirjoita vaihtoehtoinen teksti** Jokaisessa Blueskyyn liitetyssä kuvassa on vaihtoehtoisen tekstin painike, ja monet verkoston käyttäjät lukevat ja arvostavat sitä. Kuvaa kuvan viesti: ”Juliste: painotuotemessut lauantaina, osasto 14, 10:00-17:00”. Jos kuvassa on sanoja, niiden pitäisi olla myös vaihtoehtoisessa tekstissä.

## Pidä Bluesky-profiili brändisi mukaisena

Banneri, profiilikuva ja postauskuvat muodostavat yhden profiilin, joten anna niille sama taustaperhe. Sama väri tai materiaali bannerissa, ilmoituskuvissa ja sitaattikorteissa saa selaavan kävijän tunnistamaan sinut ennen käyttäjänimen lukemista. Muiden alustojen koot löytyvät oppaasta [somekuvien koot](https://gradiently.design/fi/guide/social-media-image-sizes), ja yhteisen ilmeen säilyttämistä käsittelee [brändin johdonmukaisuus](https://gradiently.design/fi/guide/brand-consistency).

Gradientlyssä valitset Markin, suunnittelet 3000×1000-bannerin kerran ja muutat sen Pro-tilauksella X-otsakkeeksi, LinkedIn-banneriksi ja postauskokoihin yhdellä kertaa. Jokainen renderöidään uudelleen omaan muotoonsa rajaamisen sijaan. Markille asetetut sanat pysyvät luettavina, koska se rauhoittuu niiden takana. Jos haluat vain sinulle kuuluvan ilmeen, selaa [Markkinoita](/market).

## FAQ

### Minkä kokoinen Bluesky-banneri on?

3000×1000 pikseliä, kuvasuhde 3:1.

### Minkä kokoisia Bluesky-postauskuvien pitäisi olla?

1600×900 pikselin 16:9-vaakakuva näkyy syötteessä luotettavasti. Myös 1080×1350-pystykuva ja 1080×1080-neliö toimivat.

### Voinko käyttää X-otsakettani Blueskyssä?

Kyllä. Molemmat ovat 3:1, joten 3000×1000-suunnitelma palvelee X:ää pienennettynä kokoon 1500×500 ja Blueskyä täydessä koossa. Tarkista profiilikuvan sijainti kummassakin.

### Missä profiilikuva on Bluesky-bannerissa?

Se peittää vasenta alakulmaa. Pidä sanat ja logot siis poissa kulmasta ja sijoita ne keskelle.