migcontrol / django-migcontrol

A Wagtail-based Django website for Migration Control
GNU General Public License v3.0
0 stars 5 forks source link

Header Images displayed too large #218

Open shavek opened 1 year ago

shavek commented 1 year ago

This is a general issue for blog entries. The header is displayed too large. It does not matter what size or proportions the original images has, it always looks overstretched, see the examples.

https://new.migration-control.info/de/blog/die-schrecken-des-krieges-in-khartum-und-seine-auswirkungen-auf-das-leben-der-fluchtlinge-aus-dem-sudsudan/

https://new.migration-control.info/en/blog/monthly-press-review-april-2023/

Do you think there is way to fix this in a way that images are shown in their original proportions? Or is there a specific resolution/size/proportion of images we need to have in mind for it not to be overstretched like this?

benjaoming commented 1 year ago

The idea is that you see the rest of the image while scrolling :)

I think the best idea is to avoid header images with texts, such as the "Monthly review" images or at least place texts in the very center of the image such that cropping proportions aren't sensitive.

It's pretty hard to have these header images because we don't have a fixed format that fits both mobiles and desktops very well.

shavek commented 1 year ago

Yeah, that makes sense. That means we need to experiment with how to place text in the best way, since we cannot avoid it completely. I will give this feedback to the crew. Thanks!

shavek commented 1 year ago

Seems like you have fixed this somehow. The images are displayed much better now!

benjaoming commented 1 year ago

I haven't changed anything :) But I noticed that a lot of blog post images are replaced on Monthly Reviews.

benjaoming commented 1 year ago

But I think we should close this, there's not much to be done, other than find good and suitable illustrations for the many different display types and resolutions.