Sometimes when people provide us with content we may say that it is in the wrong “aspect ratio” but what do we actually mean by that?
Aspect ratio refers to the proportional relationship between the width and height of a visual display or an image. It is usually expressed as two numbers separated by a colon (e.g., 16:9, 4:3 or 1:1).
These numbers represent how many units wide the display or image is in relation to how many units tall it is.
Common examples include
- 16:9 – This is the aspect ratio of a widescreen TV.
- 4:3 – A old style “boxy” TV
- 1:1 – A square
So why is this a problem?
Let’s take a common example, your website has a header image that fills the width of the screen.
And you want to add a tall image like this
You either have to zoom in on one section.
Centre the image.
Or stretch the image to fit.
Non of which looks ideal, as all the options will lose some element from the images.
This happens frequently when an image of video is taken vertically on a smart phone but then needs to be displayed horizontally on a desktop or laptop screen.
The only real solution is to be selective in what images/videos go where and to consider their eventual use when taking/creating them.