I have a web page where the users can sell their houses. They can also upload multiple images to make a carousel to show the house's images. The problem I'm facing is to decide whether or not to use responsive image or just resize and keep proportion.
For example, the carousel container is 400px height and 100% width, so I have 2 scenarios:
- Image fills the container, but crop some parts of it;
- Image keep propotion until reaches 100% of height or width;
See these 2 images for example:
This example will fill the entire container.
This example will fill a maximum height or width and center the image.
Because I'm not the one who control the image upload (I can only ask for a min/max image size) I'm kind of confused on what approach to use.
Filling the entire container has a better result on the design, but if the user upload a very vertical image, for example, it will zoom in too much and lose it's focus. In the other hand, if filling only a maximum height/width, will leave a lot of blank space on the sides of the image.
Both situations has it's pros/cons but what should I take in consideration in this case?