DEV Community

Miriam Alonso
Miriam Alonso

Posted on

Crop ratios and framing conventions across 5 professional photo genres, as a reference table

If you build anything that accepts a professional photo, you will eventually hit the fact that "headshot" is not one format. It is at least a dozen, with incompatible conventions, and the person uploading assumes you know which one they mean.

I put together the numbers because I kept guessing. Here they are in one place.

The table

genre typical ratio crop retouching expected
acting 8:10 portrait head and shoulders, eyes upper third minimal, accuracy is the point
modelling mixed, often 4:5 and 2:3 varies by card, full-length included heavy
portfolio mixed set multiple crops of the same session moderate
pageant 8:10 portrait tight, specific per system system-defined, enforced literally
commercial 3:2 and 16:9 wide, space for copy heavy, licensed

Two things fall out of that.

Your fixed square crop is wrong for most of them. A 1:1 container is fine for an avatar and destroys an 8:10 acting shot, which is composed with the eyes at the upper third precisely so the frame reads correctly at that ratio. Centre-cropping it puts the eyes in the middle and the composition dies.

"Upload your headshot" is an underspecified prompt. If your product cares, say which. If it does not care, do not centre-crop, because centre-cropping is the operation that assumes you knew.

The bit that catches people

Acting and modelling images look identical to a classifier and are not interchangeable at all. An acting shot is a casting document: it exists to show exactly what walks into the room, so retouching is a defect rather than a feature. A modelling shot is a sales sheet: retouched, styled, showing range.

If you are building anything that routes these, you cannot tell them apart from pixels alone. Ask.

Implementation notes

Use aspect-ratio on the container rather than fixed heights, and set object-position above centre for portrait crops:

.portrait {
  aspect-ratio: 4 / 5;
  object-fit: cover;
  object-position: 50% 35%;
}
Enter fullscreen mode Exit fullscreen mode

50% 35% biases toward the upper third, which is where faces sit in a properly composed portrait. It is one line and it stops the beheadings.

Store the original. Every derived crop is a lossy decision you will want to revisit when the design changes, and it always changes.

Sources

The conventions above are written up per genre if you want the detail: acting headshots, modelling headshots, portfolio sets, pageant headshots and commercial images.

The pageant one is worth skimming even if it never applies to you, as an example of a genre where the spec is enforced literally and a 2% crop error gets an entry rejected. Good reminder that "close enough" is a product decision, not a universal truth.


More from this series

On BetterPic

Top comments (0)