Velký přehled rozměrů obrázků pro Facebook 2019

Proč to dělat jednoduše, když to jde udělat složitě. Asi to si říkal Facebook, když vytvářel design, respektive podobu příspěvků, coverů na profilu, ve skupinách, na telefonech, atd… Spousty rozměrů a všude je to tak trochu jinak. Ale ona by to nebyla žádná zábava…

Já jsem si tímto peklem prošel a hledal všemožné varianty tak, abych nakonec našel ty správné. Teď si možná říkáte „kouknu na Google a mám to!“, jenže je tu problém v tom, že Facebook každým rokem udělá ve formátech obrázků pár změn. Na Googlu se vám pak smíchávají staré rozměry s novými (nehledě na to, že některé tam jsou nesmyslné) a pak se v tom vyznejte… Pro sebe jsem si sestavil šablony, které mi pomáhají vytvářet covery na míru pro mé klienty. A proč by šablony měly sloužit jen mě. Na konci článku si šablony můžete stáhnout.

Profilová fotografie stránky

Začneme tím nejlehčím a to profilovou fotografií, kde stačí nahrát fotografii o velikosti minimálně 180x180px (doporučuji 600x600px pro lepší kvalitu), přičemž se nám zobrazuje velikost 160x160px. Z tohoto čtverce nám tedy poté Facebook udělá kolečko a woalá, máme profilovou fotku. V tomto naštěstí žádná záludnost není. Samozřejmě není nutné mít fotografii ve tvaru čtverce, protože Facebook vám nabídne oříznutí.

Úvodní fotografie stránky

Desktop zobrazení (pc)

Úvodní fotografie pro naší FB stránku je pro letošní rok (dokud zase nedojde k nějaké aktualizaci) definována na rozměry 827x315px (doporučuji 1200x457px). Můžete samozřejmě nahrát i větší fotografii, ale je důležité si držet stejný poměr stran 2,63:1.

Mobilní zobrazení

Jenže to není vše. Je spousta uživatelů, kteří si Facebook projíždí přes telefon a tam máme rozměr úvodní fotky jiný, tedy alespoň do šířky. Rozměry pro zobrazení na telefonu jsou 560x315px. Vtip je v tom, že můžete pro oba rozměry nahrát jen jeden obrázek a tak jednoduše musíte veškerý text a smysl obrázku situovat do prostoru 560px (pro rozlišení 1200x457px, platí prostor 812,6px) na šířku, aby to vypadalo dobře i na mobilech. Tomuto vyhrazenému místu se říká „Mobile safe area“, jde tedy o prostor, kde máte jistotu, že se obsah obrázku zobrazí, jak na telefonu, tak i na pc.

Úvodní fotografie skupiny

Na Facebooku můžete kromě stránek vlastnit také skupinu. Skupina nemá svou profilovou fotku, ale má svou úvodní fotku. Říkáte si, že to musí být stejný rozměr jako pro fotografii pro stránku? Ale kde že… Rozměry jsou jiné, mobilní zobrazení je jiné a aby tomu Facebook nasadil korunu, tak dokonce z této fotky čerpá „kolečko“ pro náhled skupiny. To si ale vše ukážeme.

Desktop zobrazení (pc)

Pro desktop zobrazení potřebujeme fotografii o rozměrech ideálně 1200x484px. I zde platí to, že můžeme nahrávat větší obrázek, avšak se stejným poměrem stran 2,48:1.

Mobilní zobrazení

Přemýšlel jsem dlouho jak toto napsat… Pro mobilní zobrazení úvodní fotografie pro skupinu potřebujete vyšší obrázek. Ano vyšší… S rozměry 1200x626px. To znamená, že pro telefony, které jsou obecně menší, potřebujete větší obrázek, než pro pc a zase samozřejmě platí to, že pro desktopy a mobily se používá jeden obrázek.

Náhled

  • A aby toho nebylo málo tak z mobilního rozměru se ještě čerpá náhled skupiny, který má tvar kružnice s rozměrem obvodu 626px, ale pozor! o kružnici jde jen v případě desktopu, tedy pc.
  • Na mobilu se totiž nově náhled zobrazuje jako čtverec se zakulacenými rohy, naštěstí šířka všech stran je 626px. Jde tedy o stejný rozměr.

Úvodní fotografie pro skupiny ale stále nejsou úplně doladěné pro telefony. Spousta telefonů má výřez, který dělá zobrazení úvodní fotografie problémy, protože se část fotografie schovává za výřez. Navíc některé telefony ještě nedostaly aktualizaci na nejnovější bílou verzi Facebooku a tam je pro změnu kus fotografie překrytý menu Facebooku. To se snad ale vyřeší až se aktualizace dostane do všech telefonů.

Osobní profilová fotografie stránky

Tady naštěstí není moc co řešit. Stačí mít fotografii o velikosti minimálně 180x180px (doporučuji 600x600px pro lepší kvalitu), přičemž Facebook si použije 160x160px. Pokud fotografii nemáte ve čtverci, jednoduše ji pomocí crop editoru Facebooku můžete oříznout.

Úvodní fotografie na osobním profilu

Mám pro vás dobrou zprávu! Ne, dělám si srandu. I tady je totiž formát úvodní fotografie rozdílný. Do této fotky navíc zasahuje profilová fotografie. Na desktopech vlevo, na telefonech uprostřed.

Desktop zobrazení (pc)

Ideální rozměr této fotografie pro Facebook je 851x315px. Jde o minimální rozměr a raději doporučuji udělat obrázek s rozměrem 1200x444px s poměry stran 2,7:1.

Mobilní zobrazení

Pro telefony tu máme opět „Mobile safe area“, u které je výška stejná a zmenšujeme se nám jen šířka na 560px ze středu a za předpokladu rozměru 851x315px. Pro rozměr 1200x444px platí rozměr mobile safe area 789,7px.

Umístění profilové fotografie

  • Část fotografie je navíc překryta profilovou fotografií. Na to je třeba myslet a nějaký ten text cpát raději do středu nebo nahoru, ale ne do dolní části. Na obrázku níže se můžete podívat, na kterých místech bude profilová fotografie překrývat „úvodku“. Pokud to chcete v číslech, tak kruh profilu má rozměr 237,6px, od levého rohu 21px a z vrchu 245px (Platí pro rozměr 1200x444px, pro druhý, menší, je třeba čísla dělit 2)
  • Pro telefony se profil posouvá do středu a trochu níže. Kruh se nám zvětšuje na 302px, z vrchu je třeba odměřit 306px a kruh vertikálně vystředit. No… bylo peklo to naměřit, a pokud se tomu chcete vyhnout, doporučuji si stáhnout šablonu na konci článku.

Úvodní fotografie pro události

I události potřebují svůj rozměr úvodní fotografie. Tady to naštěstí není nijak složité. Stačí nahrát fotku o rozměru minimálně 500x262px. Pro lepší kvalitu fotografie použijte raději rozměr 1200x629px. Poměr stran v tomto případě je 1,91:1.

Příspěvky Facebooku

A jsou tu na řadě příspěvky. Obyčejné příspěvky, které můžete kdykoli zveřejnit. Není tím myšlena placená reklama, ani sdílecí fotografie.

Tohle je asi nejlehčí část, co se týče obrázků, no i když… Stačí vědět, že maximální šířka obrázku je 500px. Samozřejmě můžete nahrát i rozměrově větší obrázky, avšak na zdi se zobrazí obrázek vždy tak, jak je uvedeno níže.

Pro fajnšmekry se ale i tady dá najít záludnost. Facebook se totiž musel ochránit před těmi, který by vymysleli třeba fotografii se šířkou 500px a výškou například 8000px. V takovém případě už totiž dojde k oříznutí a na zdi se zobrazí obrázek vždy maximálně v rozlišení 500x750px. Po rozkliknutí obrázku už ale najdeme neořezaný obrázek. Tento jev se děje pokaždé, pokud máme fotografii větší než je poměr stran 1:1.5, což odpovídá rozměru 500x750px.

Jestliže budeme mít obrázek například 500x600px nic se neděje a obrázek se tak zobrazí, stejně tak 3600x4000px (obrázek se jen zredukuje do velikosti 500x XYpx)

Oříznutí se děje i v momentě pokud nemáme obrázek se šířkou alespoň 500px. V takovém případě si facebook fotografii zvětší, aby splňovala pravidlo šířky obrázku 500px a se zachováním poměru stran dopočítá výšku. ALE, v momentě kdy po dopočítání přesáhne výška rozměr 750px, obrázek se na výšku ořízne.

Příklad 1: máme obrázek 300x400px. Po nahrátí na Facebook dojde ke zvětšení obrázku na rozměr 500x667px. Poměr stran je zachován.

Příklad 2: máme obrázek 300x700px. Po nahrátí na Facebook dojde ke zvětšení obrázku na rozměr 500x1167px, což už přesahuje maximální rozměr obrázku, který lze nahrát na Facebook, a tak se obrázek ořízne na konečných 500x750px.

Příklad 3: máme obrázek 3600x4000px. Po nahrátí na Facebook dojde k tomu, že se obrázek zmenší na rozměr 500x556px. Velké obrázky tedy nevadí, je třeba si dát ale pozor, abyste nepřesáhli poměr stran 1:1,5. Pokud ano, dojde k oříznutí obrázku viz. příklad 2

Shrnutí:

  • Maximální rozměr obrázku na zdi je v poměru 1:1.5. Například 500x750px nebo 2000x3000px
  • Maximální šířka obrázku je 500px
  • Jestliže má obrázek menší šířku než 500px, FB si obrázek zvětší tak, aby dosáhl šířky alespoň 500px se zachováním poměru stran obrázku.
  • Jestliže má obrázek větší šířku než 500px, FB si obrázek zmenší tak, aby dosáhl šířky 500px se zachování poměru stran obrázku.

Reklamy Facebooku

Jakoby se někdo reklamám věnoval. Aspoň tak mi to přišlo, když jsem zjišťoval možné rozměry všech typů reklam. Druhů reklam je totiž mnoho:

  • Klasické landscape reklamy
  • Čtvercové reklamy
  • Video reklamy
  • Carousel reklamy
  • Reklama v messengeru
  • Reklama v pravém sloupci

Světě div se, ale budete potřebovat pouze dva rozměry! Hlavní rozměrem pro reklamy je 1200x628px. což odpovídá poměru stran 1,91:1. Vzhledem k tomu, že maximální šířka obrázku zobrazená na FB může být 500px, je výše zmíněný rozměr ideální i doporučený. To ale samozřejmě neplatí, pokud použijete tlačítko „Propagovat příspěvek“. Díky tomu totiž budete propagovat přímo daný příspěvek a tam už jsou rozměry různé.

čtvercové reklamy a carousel reklamy

Pro čtvercové reklamy a carousel reklamy máme formát s poměrem stran 1:1, tedy čtverec. Minimální šířka výška je 600px. Doporučuji ale vytvářet obrázky s rozměrem 1200x1200px pro lepší kvalitu.

Video reklamy

Zde si můžeme vybrat klasické formáty 16:9 nebo 1:1, ideálně ve FullHD kvalitě. Doporučuji si ale s videem dát více práce a použít video 16:9 ve formátu čtverce. Díky tomu vám sice nad a pod videem vzniknou pruhy, ale ty můžete použít pro název videa a titulky… hlavně titulky. Protože jak už možná víte, 85% uživatelů přehrává videa bez zvuku.

Sdílení stránky

Občas chceme nasdílet nějakou stránku a v takovém případě musí mít stránka správně nastavené tzv. FB atributy. Atributy se skládají ze tří údajů:

  • obrázek
  • nadpis
  • popis

Obrázek je třeba nahrát ve vašem webu s rozměry 1200x628px, tedy stejný rozměr jako u reklam. Nezapomeňte pak také stránku nechat projet pomoci FB debuggeru. To už si ale případně probereme jindy.

Sdílení stránky v komentářích

V případě, že chceme nasdílet stránku do komentářů na FB, zobrazí se nám malý náhled o velikost 99x96px se zakulacením 18px. Tento náhled se tvoří z velkého náhledu viz. výše. Jednoduše se opět vezme střed obrázku a je to.

Pokud tedy tvoříte FB atribut obrázek s velikostí 1200x628px a je pro vás i toto zobrazení důležité, je potřeba pamatovat na to, že ve středu musíte mít čtverec se stranami 628px a zakulacením 120px (větší velikost, větší zakulacení)

Závěr – Stažení šablon

A jsme na konci. Bylo to šílené, co? Doufám, že vám tato „osvěta“ v rozměrech pomůže a vylepšíte si své obrázky. Pokud máte zájem o stažení všech šablon pro Facebook, zadejte níže do formuláře váš e-mail a po potvrzení vám je všechny zašlu do schránky. Pokud se vám článek líbil, nezapomeňte na laik a sdílení ;).

V emailu najdete:

  • Shrnutí rozměrů
  • 3 složité šablony s vyznačenými místy
  • 4 jednoduchých šablon s rozměry obrázku
Tvé osobní údaje (tedy e-mail) budu (Jan Tipmann, IČ 87716721) zpracovávat podle zákona za účelem zaslání vyžádaného materiálu. Více zde
Honza T.
Webař, UX designér a projekťák. Grafika a interní procesy v týmu mě jednoduše baví. Denně čerpám nové informace, které vám rád předám.
Komentáře

Přidat komentář

Vaše emailová adresa nebude zveřejněna.

Vaše osobní údaje budou použity pouze pro účely zpracování tohoto komentáře.

  • Stáhni si e-book zdarma
  • Odběr novinek

    Nechceš přijít o žádný můj obsah? Přihlas se do newsletteru a já ti pošlu na e-mail vždy info, že mám na webu nový super obsah.

  • Rubriky
  • Nejnovější příspěvky