# Före och efter-inlägg: en layout som berättar historien

[Canonical HTML page](https://gradiently.design/sv/guide/before-and-after-post)

Få format övertygar lika snabbt som före och efter. Få är lika lätta att göra fel, med foton som inte matchar, trånga layouter eller resultat som fått hjälp på traven.

## The short version

- Ett före och efter-inlägg visar två matchande foton av samma motiv så att förändringen mellan dem är det enda som skiljer.
- Ta båda fotona från samma vinkel, avstånd och ljus, annars slutar jämförelsen att vara rättvis.
- Sida vid sida passar kvadratiska och liggande inlägg, staplat passar stories, och en karusell med två sidor låter efterbilden komma som ett avslöjande.
- Märk varje halva tydligt och håll etiketterna på samma plats på båda sidor.
- Lägg bara upp verkliga resultat, med kundens samtycke, och undvik att redigera något av fotona utöver att matcha exponeringen.

Ett bra **före och efter-inlägg** visar samma motiv två gånger, fotograferat på samma sätt, så att det enda som ändras är arbetet du gjorde. Layoutens uppgift är att göra den förändringen tydlig i en blick: två halvor, tydliga etiketter, inget som konkurrerar. Salonger, städfirmor, dekoratörer, trädgårdsfirmor, bilvårdare, sjukgymnaster och designers förlitar sig alla på formatet, eftersom ett resultat är mer övertygande än någon beskrivning av det.

## Börja med foton som matchar

De flesta svaga före och efter-inlägg misslyckas innan någon öppnat ett designverktyg. Före-bilden togs i svagt kvällsljus med vidvinkel; efter-bilden togs i starkt dagsljus från en smickrande vinkel. Betraktare märker det, även om de inte kan säga varför, och hela inlägget känns arrangerat.

1. **Markera din plats** Stå på samma ställe för båda fotona. En tejpbit på golvet, eller en anteckning om dörröppningen du fotograferade från, räcker.
2. **Matcha höjd och objektiv** Håll mobilen på samma höjd och använd samma zoom. Att byta till vidvinkel för en bild ändrar rummets proportioner.
3. **Matcha ljuset** Samma tid på dagen, samma lampor tända eller släckta. Om det inte går, ta båda med huvudbelysningen tänd och persiennerna i samma läge.
4. **Behåll bildens orientering** Båda stående eller båda liggande. En stående före-bild bredvid en liggande efter-bild kan aldrig linjera.
5. **Ta några av varje** Välj paret som matchar bäst senare. Det är mycket lättare än att återskapa en före-bild när arbetet är gjort.

## Före och efter-layouter som fungerar

Det finns tre pålitliga layouter. Vilken du ska använda beror på plattformen och på hur dramatisk förändringen är.

| Layout | Bäst för | Storlek |
| --- | --- | --- |
| Sida vid sida | Flödesinlägg, rum, bilar, trädgårdar | Kvadrat 1080×1080 eller liggande 1080×566 |
| Staplat | Stories, Reels-omslag, porträtt av människor | Story 1080×1920 eller inlägg 1080×1350 |
| Karusell med två sidor | Stora avslöjanden där efterbilden ska landa som en överraskning | Inlägg 1080×1350, två sidor |

Tre layouter och storlekarna som passar dem. En staplad layout ger varje foto hela bredden, vilket hjälper på en mobil.

- Sida vid sida 1080×1080: 1080 × 1080
- Staplat 1080×1920: 1080 × 1920
- Karusellsida 1080×1350: 1080 × 1350

Dela en kvadrat på mitten så blir varje foto en hög remsa på 540×1080. Dela en story över mitten så blir varje halva en nästan kvadratisk 1080×960.

Lägg märke till vad delningen gör med varje foto. Sida vid sida på en kvadrat lämnar varje halva hög och smal, vilket passar en dörröppning eller en person som står, men beskär ett brett rum hårt. Staplat i en story lämnar varje halva nästan kvadratisk, vilket passar de flesta motiv. Om dina foton är liggande slösar en staplad layout oftast mindre av dem. I en story håller du etiketterna fria från de översta och understa 250 pixlarna, där appens eget gränssnitt sitter, som [säkra zoner i sociala medier](https://gradiently.design/sv/guide/social-media-safe-zones) förklarar.

### Karusellavslöjandet

En karusell låter före-bilden stå själv först. Första sidan visar problemet med en kort rad (”Sex år av mossa.”), andra sidan visar resultatet. Svepet blir avslöjandet, vilket tenderar att hålla uppmärksamheten bättre än att se båda på en gång. Håll fotona inramade identiskt så att svepet känns som en enda bild som ändras. [Storlek på Instagram-karuseller](https://gradiently.design/sv/guide/instagram-carousel-size) har sidornas mått.

Karusellens första sida märkt Före, med raden Sex år av mossa

Sida ett: före-bilden, märkt, med en rad som sätter upp problemet.

Karusellens andra sida märkt Efter, med raden Samma uppfart, söndag

Sida två: efter-bilden, med etiketten på samma plats så att ögat jämför direkt.

## Etiketter, linjer och varumärke

Märk varje halva ”Före” och ”Efter” på samma plats, i samma storlek och samma färg. Läsare jämför genom att flytta blicken mellan matchande punkter, och en etikett uppe till vänster på ena sidan och nere till höger på den andra bryter den rytmen. Små versaler eller en kort flik fungerar bra.

- Lägg en tunn avdelare mellan halvorna, eller ett mellanrum i din varumärkesfärg, så att fotona inte flyter ihop.
- Lägg till en rad sammanhang: jobbet, tiden det tog eller produkten som användes. Inte ett stycke.
- Håll logotypen liten och i ett hörn. Resultatet är annonsen.
- Använd samma ram för varje före och efter du lägger upp, så att de blir en igenkännbar serie.

Ord ovanpå foton kräver omsorg, eftersom ett ljust fönster eller en vit vägg kan svälja en vit etikett. [Gör text läsbar på foton](https://gradiently.design/sv/guide/readable-text-on-photos) går igenom alternativen. Att lägga etiketterna på ett varumärkt band ovanför eller under fotona, i stället för på dem, kringgår problemet helt.

## Etik: visa bara verkliga resultat

Formatets kraft är också dess risk. Ett före och efter är ett påstående: det här kan vi göra. Om resultatet retuscherades, lånades eller var exceptionellt är påståendet falskt, och inom vissa områden, som kosmetiska behandlingar, hälsa och viktminskning, är reklamreglerna för sådana bilder stränga. Kontrollera reglerna för din bransch och ditt land innan du lägger upp.

### Undvik

- Att retuschera efter-bilden eller mörka före-bilden
- Olika belysning som smickrar resultatet
- Stockbilder eller ett annat företags foton
- Ditt enda bästa resultat presenterat som typiskt
- En kunds ansikte eller hem utan samtycke

### Gör så här

- Matcha bara exponering och vitbalans
- Samma vinkel, avstånd och ljus för båda
- Ditt eget arbete, fotograferat av dig
- Säg hur lång tid det tog och vad som ingick
- Skriftligt tillstånd, och möjlighet att vara anonym

För människor snarare än platser betyder samtycke ännu mer. Fråga innan före-fotot tas, förklara var det kommer att visas och erbjud dig att beskära bort ansikten eller tatueringar. Många kunder delar gärna sitt resultat när de vet att de kan säga nej.

## Gör ramen till din

När varje städfirma och varje salong lägger upp samma vita delade mall är ramen där du kan skilja dig från mängden. En konsekvent bakgrund runt fotona, samma etikettstil och samma typsnitt gör en rad resultat till något folk känner igen som ditt i flödet. [Instagram-idéer för småföretag](https://gradiently.design/sv/guide/small-business-instagram) och [inlägg för salonger](https://gradiently.design/sv/guide/salon-social-media-posts) visar hur detta passar in i en bredare plan.

I Gradiently är en karusell helt enkelt sidor i en och samma design, så före och efter delar varje inställning, och storleksändring gör storyformatet av samma design, redo för dig att stapla fotona. Bakgrunden är din Mark, en look som inget annat företag kan använda när den är din.

## FAQ

### Hur gör man ett före och efter-inlägg?

Fotografera motivet från samma plats, höjd och ljus före och efter arbetet, och placera sedan fotona sida vid sida eller staplade med matchande etiketter för Före och Efter.

### Vilken storlek har ett före och efter-inlägg på Instagram?

Använd 1080×1080 för sida vid sida, 1080×1920 för en staplad story eller två karusellsidor i 1080×1350 för ett svepavslöjande.

### Är det okej att redigera före och efter-foton?

Att matcha exponering och vitbalans är bra. Att retuschera resultatet eller få före-bilden att se sämre ut vilseleder folk och kan bryta mot reklamregler.

### Behöver jag tillstånd för kunders före och efter-foton?

Ja. Fråga innan före-fotot tas, förklara var det kommer att visas och erbjud dig att dölja ansikten eller identifierande detaljer.

### Ska ett före och efter vara sida vid sida eller en karusell?

Sida vid sida visar förändringen direkt och passar ett enskilt flödesinlägg. En karusell med två sidor håller tillbaka efterbilden till ett svep, vilket fungerar bäst när förändringen är dramatisk.