Säkra zoner i sociala medier: där appen täcker din design

Säkra zoner i sociala medier är de delar av ett inlägg som inget appgränssnitt någonsin täcker. I stående format ligger faran upptill, där namn och förloppsstaplar sitter, nedtill, där bildtexter och svarsfält sitter, och på Reels, TikTok och Shorts längs högerkanten, där gilla- och delaknapparna löper. Låt bakgrunden fylla hela bilden och håll varje ord, logotyp och ansikte inom det säkra området.

Säkra zoner för stående video och stories

Alla de här formaten delar bildytan 1080×1920, men det som läggs ovanpå skiljer sig. Siffrorna nedan är arbetsmarginaler, medvetet upprundade, hämtade från hur varje app lägger upp sitt gränssnitt och från den vägledning plattformarna ger annonsörer. De är inga officiella mått, och varje app flyttar saker mellan versioner och skärmformer.

Om du bara kommer ihåg en regel, välj den här: håll det viktiga innehållet i en video i stående format inom en central ruta på ungefär 800 pixlar i bredd och 1 150 pixlar i höjd, med start cirka 250 pixlar från toppen. Den rutan klarar varje marginal i tabellen. Mer detaljer per plattform finns i storlek för Instagram Story, storlek för TikTok-omslag och storlek för YouTube Shorts-omslag.

Vad som finns i varje zon

Att veta vad som täcker varje kant hjälper dig avgöra vad som får ligga nära den. Bakgrunder, texturer och svansen på en gradient går bra under gränssnittet. Ord, priser, logotyper och ansikten gör det inte.

Bildtexten är den lömska. En kort bildtext tar två rader, men när tittaren trycker på den expanderar den uppåt över videon. Ligger din text lågt i bilden täcker en lång bildtext den.

Säkra zoner på banners och rubrikbilder

Breda banners har inga knappar ovanpå, men de har två andra problem: en profilbild som överlappar en del av bilden och olika beskärningar på telefon och dator.

YouTube är extremfallet: kanalbilden är en enorm bild på 2560×1440, men telefoner visar bara en smal remsa från mitten. Våra guider till LinkedIn-bannern och YouTube-bannern kartlägger de exakta områdena.

Flödesinlägg och miniatyrer har också säkra zoner

• Instagrams profilrutnät: inlägg visas som 3:4-rutor utskurna från mitten. Ett inlägg i 1080×1350 förlorar en smal kant på varje sida, och ett Reel-omslag förlorar cirka 240 pixlar upptill och nedtill. Se beskärning i Instagrams rutnät.
• YouTube-miniatyrer: videons längd sitter i nedre högra hörnet, så håll ansikten och ord borta därifrån.
• Karuseller: prickarna sitter strax under bilden, men vissa appar lägger en sidräknare i övre högra hörnet.
• Pinterest-pinnar: spara-knappar och pinnens titel syns när man håller över och under pinnen, så låt nedre kanten vara lugn.

Så bygger du in säkra zoner i ditt arbetsflöde

1. 1

   Gör ett hjälplager en gång

   Rita den säkra rutan som ett låst hjälplager i varje mall. Låt det vara synligt medan du designar och dölj det innan du exporterar.

2. 2

   Designa för den strängaste plattformen

   Om en stående design ska till Stories, Reels och TikTok, använd TikToks marginaler. Då är den säker överallt.

3. 3

   Låt bakgrunden gå över kanten

   De täckta zonerna visar fortfarande din bakgrund. Dra färg och textur ut till varje kant så att bilden aldrig ser inramad ut.

4. 4

   Lämna plats för klistermärken

   Om du ska lägga till ett länk- eller omröstningsklistermärke i appen, lämna en tom yta i nedre mitten av den säkra rutan.

5. 5

   Förhandsgranska med gränssnittet på

   Publicera för en privat publik eller nära vänner, eller spara ett utkast och se det i helskärm. Det är den enda riktiga kontrollen.

Gradiently hjälper på två fronter. När du ändrar storlek på en design till andra format med Pro läggs varje kopia ut på nytt för sin form i stället för att beskäras, så du behöver bara flytta orden in i den säkra rutan. Marken bakom fyller hela bilden, gränssnittszonerna inräknade, och håller sin lugnaste, mest kontrastrika yta bakom dina ord vart de än flyttas. Text på en gradient går igenom läsbarheten i detalj.