Sideforhold-kalkulator

Hva er en sideforholdskalkulator?

En sideforholdskalkulator hjelper deg å beregne dimensjoner som bevarer et bestemt bredde-til-høyde-forhold. Når du kjenner bredden og sideforholdet (f.eks. 16:9), beregner verktøyet automatisk den korrekte høyden. Omvendt, hvis du har begge dimensjoner, identifiserer den sideforholdet og forenkler det til sin laveste form.

Sideforhold er fundamentalt i visuelt design — videoer, bilder, skjermer og trykkformater har alle standardiserte forhold. 16:9 er standard for HD-video og de fleste skjermer. 4:3 var standard for eldre TV-er. 1:1 er kvadratisk (Instagram). 9:16 er vertikal video (TikTok, Stories). Feil sideforhold fører til forvrengning eller svarte kanter.

Slik bruker du dette verktøyet

Skriv inn to av tre verdier: bredde, høyde eller sideforhold. Verktøyet beregner den manglende verdien. For eksempel: bredde 1920 med 16:9 gir høyde 1080. Eller skriv inn 1920x1080 og verktøyet identifiserer 16:9. Resultatene viser også alternative oppløsninger med samme sideforhold.

Slik beregner du en manglende dimensjon

Et størrelsesforhold uttrykker det proporsjonale forholdet mellom bredde og høyde – uavhengig av absolutt størrelse. Forholdet 16:9 betyr at for hver 16 enheter bredde er det 9 enheter høyde. Fordi forholdet er skalauavhengig, deler et 160×90 miniatyrbilde og en 3840×2160 4K-skjerm nøyaktig samme størrelsesforhold.

For å skalere dimensjoner mens forholdet bevares, bruk disse to formlene. For å finne en ny høyde fra en ny bredde: ny høyde = ny bredde × (original høyde ÷ original bredde). For å finne en ny bredde fra en ny høyde: ny bredde = ny høyde × (original bredde ÷ original høyde). Begge formlene anvender ganske enkelt det opprinnelige forholdet som en multiplikator.

Utarbeidet eksempel: skalere 1920×1080

Start med en Full HD-ramme på 1920×1080 piksler. Forenkle først forholdet ved å finne den største felles divisoren (GCD) for 1920 og 1080. Med den euklidske algoritmen: GCD(1920, 1080) = GCD(1080, 840) = GCD(840, 240) = GCD(240, 120) = 120. Deling av begge dimensjoner på 120 gir 16:9 – det kjente bredsformatsforholdet.

Anta nå at du trenger å skalere videoen til en bredde på 1280 piksler for en mindre skjerm. Bruk formelen: ny høyde = 1280 × (1080 ÷ 1920) = 1280 × 0,5625 = 720. Den skalerte rammen er 1280×720 – også kjent som 720p HD – og er fortsatt nøyaktig 16:9.

Avrundingsadvarsel: piksel-dimensjoner må være hele tall. Rund alltid til nærmeste heltall. For videokoding, rund ned til nærmeste partall for å unngå kodefeiler med kroma-subsampling (f.eks. krever YUV 4:2:0 partallsdimensjoner).

Vanlige størrelsesforhold og hvor de brukes

• 16:9 — Den dominerende standarden for HD- og 4K-video. Brukt av YouTube, Netflix, Twitch, moderne TV-er og de fleste stasjonære skjermer. Representative oppløsninger: 1280×720 (HD), 1920×1080 (Full HD), 2560×1440 (QHD), 3840×2160 (4K UHD).
• 4:3 — Den gamle standarden for CRT-TV-er og tidlige datamaskiner. Brukes fortsatt til presentasjoner, noen iPad-modeller og vintage-filmformater. En 1920×1080 bredsformatsvideo vist på en 4:3-skjerm får horisontale svarte striper (letterboxing).
• 1:1 — Kvadratformatet. Nødvendig for Instagram-innlegg, profilbilder, app-ikoner og albumkunst. Enkelt å beskjære fra et hvilket som helst bredere format uten å miste motivet.
• 9:16 — Den vertikale motparten til 16:9. Det opprinnelige formatet for smarttelefonskjermer holdt i stående retning. Brukt av Instagram Stories, TikTok, YouTube Shorts og Snapchat.
• 21:9 — Ultrabredt kino- og skjermformat. Vanlig i kinematografiske filmer (ofte vist som 2,35:1 eller 2,39:1) og ultrabrede spillskjermer. Innhold tatt opp i 16:9 får vertikale svarte striper (pillarboxing) på en 21:9-skjerm.
• 3:2 — Det klassiske 35 mm-filmforholdet, videreført i de fleste digitale speil- og speilløse kameraer. Et 6×4 tommer bilde er 3:2. Typiske oppløsninger inkluderer 6000×4000 (24 MP) og 7952×5304 (42 MP).

Vanlige sideforhold

• 16:9 — HD widescreen. YouTube, TV, de fleste dataskjermer. Oppløsninger: 1920x1080, 2560x1440, 3840x2160.
• 4:3 — klassisk TV og dataskjerm. iPad-skjerm. PowerPoint-presentasjoner.
• 1:1 — kvadrat. Instagram-poster, profilbilder, album-covere.
• 9:16 — vertikal. TikTok, Instagram/Facebook Stories, Reels, Shorts.
• 21:9 — ultrawide. Kinofilm, ultrawide monitorer.

Letterboxing og pillarboxing: hva skjer når forholdsforholdene ikke stemmer

Når størrelsesforholdet til innholdet ikke stemmer overens med størrelsesforholdet til beholderen, må skjermen kompensere. Letterboxing legger til horisontale svarte striper øverst og nederst – du ser dette når du ser en 2,39:1 kinofilm på en 16:9 TV. Pillarboxing legger til vertikale svarte striper til venstre og høyre – du ser dette når en 4:3-sending vises på en 16:9 bredsformat-skjerm. Når begge par med striper vises (innholdet er mindre enn beholderen i begge dimensjoner), kalles effekten windowboxing.

Alternativet til boxing er beskjæring eller strekking. Beskjæring fyller beholderen, men kutter av deler av bildet. Strekking fyller beholderen, men forvrenger bildet – ansikter og sirkler blir ovale. Ingen av dem er ideelle, og det er derfor å velge riktig utdataforhold fra starten av unngår problemer i etterbehandlingen.

Vanlige feil å unngå

• Ignorere forholdet ved endring av størrelse: å taste inn en ny bredde uten å oppdatere høyden gir forvrengt, strukket innhold. Lås alltid størrelsesforholdet før du endrer størrelse.
• Avrunde begge dimensjoner uavhengig: å runde bredden opp og høyden ned (eller omvendt) introduserer en liten forholdsdrift som forsterkes over flere endringer av størrelse. Rund én dimensjon, beregn deretter den andre fra den avrundede verdien.
• Forveksle visningsforhold med lagringsforhold: anamorf video (vanlig i kringkasting og Blu-ray) lagrer piksler i ett forhold, men signaliserer avspilleren om å vise det i et annet. Kontroller alltid SAR-metadataene (Sample Aspect Ratio), ikke bare rammedimensjonene.
• Anta at 16:9 er universelt: mobildesign krever ofte 9:16-ressurser. Sosiale plattformer kan automatisk beskjære til 4:5 eller 1,91:1. Eksporter flere beskjæringer i stedet for å stole på ett enkelt forhold.

Størrelsesforhold i webdesign

I CSS opprettholder aspect-ratio-egenskapen proporsjoner for responsive elementer. Før denne egenskapen eksisterte, brukte utviklere padding-bottom-trikset (padding-bottom: 56.25% for 16:9). Moderne CSS gjør det enkelt: sett aspect-ratio: 16 / 9 på ethvert element. Dette er avgjørende for innbygging av videoer, opprettelse av bildegallerier og design av kortoppsett som ser konsistente ut på tvers av enheter.

Ofte stilte spørsmål

Hva skjer hvis jeg bruker feil sideforhold?

Innhold med feil sideforhold vises enten med svarte kanter (letterboxing/pillarboxing), strekkes fordreid eller beskjæres. YouTube legger til svarte kanter rundt videoer som ikke er 16:9. Instagram beskjærer automatisk bilder som ikke er 1:1 eller 4:5. For best resultat bør du produsere innhold i det sideforholdet plattformen foretrekker.

Hvordan påvirker sideforhold responsivt webdesign?

CSS aspect-ratio-egenskapen lar deg angi et fast sideforhold for elementer. Bilder med aspect-ratio og width: 100% skaleres proporsjonalt uten layout shift. For video-innbygginger er padding-hack-teknikken (padding-top: 56.25% for 16:9) eller den nyere aspect-ratio-egenskapen standardløsninger. Å reservere plass med riktig sideforhold forhindrer innholdsskift (CLS).

Hva er GCD, og hvorfor er det viktig?

Største felles divisor (GCD) er det største tallet som deler både bredde og høyde uten rest. Å dele begge dimensjoner på deres GCD reduserer forholdet til sin enkleste form. For eksempel: GCD(1280, 720) = 80; 1280 ÷ 80 = 16 og 720 ÷ 80 = 9, noe som gir 16:9. Uten forenkling ville du sett 1280:720 i stedet for den gjenkjennelige 16:9-etiketten.

Er 4:3 virkelig det samme som 1,33:1?

Ja. Størrelsesforhold kan uttrykkes som bredde:høyde med hele tall (4:3) eller som et desimalforhold (1,33:1, der 4 ÷ 3 ≈ 1,333). Film og kino bruker tradisjonelt desimalformen – 1,85:1 (flat bredsformat) og 2,39:1 (anamorf scope) – mens video og webdesign foretrekker heltalls-kolonformen. Denne kalkulatoren viser begge deler: det forenklede forholdet (16:9) og desimalekvivalenten (1,7778).