Calcolatore Proporzioni

Capire le proporzioni

Le proporzioni esprimono la relazione proporzionale tra larghezza e altezza di un'immagine o video, scritte come due numeri separati da due punti. 16:9 significa che per ogni 16 pixel di larghezza ci sono 9 pixel di altezza. Le proporzioni sono adimensionali — 1920×1080 e 1280×720 sono entrambe 16:9 perché condividono la stessa proporzione.

Proporzioni comuni e loro utilizzi

• 16:9 (1,78:1) — Lo standard universale per i video widescreen: YouTube, Netflix, Vimeo, Twitch, trasmissioni TV, monitor desktop, schermi laptop.
• 4:3 (1,33:1) — Standard TV e monitor legacy. Ancora usato per presentazioni, alcune app iPad, video in definizione standard.
• 1:1 — Formato quadrato. Feed Instagram, foto profilo, copertine album. Forte impatto visivo, ugualmente largo e alto.
• 9:16 (0,56:1) — Video verticale per TikTok, Instagram Reels e Stories, YouTube Shorts. Il formato «schermo intero mobile».
• 4:5 (0,8:1) — Post verticali nel feed Instagram. Più alto del quadrato, mostra più contenuto senza diventare completamente verticale.
• 21:9 (2,33:1) — Ultra-wide cinematografico. Usato al cinema (formato scope 2,39:1) e su monitor ultra-wide.
• 3:2 (1,5:1) — Pellicola 35mm tradizionale e molte fotocamere digitali. Proporzioni standard per le stampe fotografiche.

Come mantenere le proporzioni durante il ridimensionamento

Per ridimensionare un'immagine preservandone le proporzioni, moltiplica entrambe le dimensioni per lo stesso fattore di scala. Per trovare un'altezza proporzionale a una nuova larghezza: nuova altezza = (nuova larghezza / larghezza originale) × altezza originale.

Esempio: ridimensionare 1920×1080 a 1280 pixel di larghezza: 1080 × (1280 / 1920) = 1080 × 0,667 = 720 pixel. Il risultato, 1280×720, mantiene il rapporto 16:9.

La proprietà CSS aspect-ratio

La proprietà CSS aspect-ratio (supportata da tutti i browser moderni dal 2021) consente di dichiarare le proporzioni desiderate di un elemento senza conoscere entrambe le dimensioni. Impostando aspect-ratio: 16 / 9 su un contenitore con solo una width, il browser calcola automaticamente l'altezza corretta. Questo sostituisce le vecchie tecniche di padding percentuale.

Domande Frequenti

• Cosa sono le proporzioni?
  Le proporzioni descrivono la relazione proporzionale tra larghezza e altezza di un'immagine o video, espressa come due numeri (es. 16:9). Un rapporto 16:9 significa che la larghezza è 16 unità per ogni 9 unità di altezza.
• Qual è il rapporto d'aspetto standard per i video YouTube?
  Il rapporto standard di YouTube è 16:9. Risoluzione consigliata: 1920×1080 (Full HD). Le miniature devono essere almeno 1280×720 o preferibilmente 1920×1080.
• Quali proporzioni usa Instagram?
  Instagram supporta 1:1 (quadrato, 1080×1080), 4:5 (feed verticale, 1080×1350) e 9:16 (Stories/Reels, 1080×1920).
• Come mantengo le proporzioni durante il ridimensionamento?
  Nuova altezza = (nuova larghezza / larghezza originale) × altezza originale. Per il CSS, usa aspect-ratio: 16 / 9 e imposta solo una dimensione — il browser calcola l'altra automaticamente.
• Quali risoluzioni corrispondono al 16:9 in pixel?
  Risoluzioni 16:9 comuni: 1280×720 (HD), 1920×1080 (Full HD), 2560×1440 (QHD), 3840×2160 (4K UHD), 7680×4320 (8K UHD). Qualsiasi dimensione in cui larghezza ÷ altezza = 1,778 è 16:9.
• A cosa serve la proprietà CSS aspect-ratio?
  La proprietà CSS aspect-ratio dichiara le proporzioni preferite di un elemento. Impostando aspect-ratio: 16 / 9 con solo una larghezza, il browser calcola automaticamente l'altezza. Supportata da tutti i browser moderni dal 2021.