Skip to main content
Participating Frequently
July 2, 2022
Answered

What is the best width and height of the image should be to show it without its pixels?

  • July 2, 2022
  • 1 reply
  • 788 views

I have an app that allows users to sell or rent their cars by publishing an ad.

 

I developed a new feature. The feature allows the user to add his ad to the banner that exists on the main screen for a certain amount of money.

 

Before adding the ad to the banner the user should upload an image with a specific measurement.

 

I made the width of the image take the full screen and I made the height of the image take 10% of the screen.

 

The only obstacle that I face is knowing, What is the image width and height should be before uploading it to the server?

 

The image shows its pixels when shown on large screens.

 

What is the best width and height of the image should be to show it without its pixels? Because the image will be low quality.

This topic has been closed for replies.
Correct answer D Fosse

Do you think* the height looks good?


You decide the height. It wil hit the width limit before that.

 

I don't know how critical image quality is here. You could specify 2560 pixels wide to cover those screens too, but I don't think any more than that will serve any sensible purpose.

 

I assume this is responsive site design so that the image always fills the browser width. Then again, do people usually have browsers full screen? my experience is not.

 

In any case, there will always be variables and compromises here. Personally, I'm not very keen on responsive design, precisely because of the continuous image scaling. Image quality will always suffer. There really isn't much you can do about that.

1 reply

Zesty_wanderlust15A7
Known Participant
July 2, 2022

"without its pixels?"

What does that mean?  NOT full size?

-

AFAIK, you should do the image manipulations on the server. Many users are "not interested" or able to make the perfect size for you. You can probably refuse the pic if the dimensions are "not greater than." Otherwise, take it in your own hands from there.

See that a larger/smaller pic doesn't "blow up" your page 😄

Participating Frequently
July 2, 2022

This feature will target auto showroom owners for 95% so I don't think they have a problem designing the image. This feature is for serious people only.

 

If you want to pay 400$ to feature your ad of course you will hire someone to create a beautiful image for your ad to put it on the banner.

 

Let's back to the question, When I said without pixels I was mean when you show the image on large screens the quality of the image will be low not like showing it on small screens will be high quality.

 

The question is:
When the advertiser designs a new image to put on the banner, What width and height should the image be to look high quality on all screens?

 

Thank you for your reply.

Participating Frequently
July 2, 2022

This is all pixels. Traditionally, an HD screen is 1920 pixels wide. So on such a screen, an image 1920 pixels wide will display perfectly full-screen.

 

Then we have some 27 inch monitors at 2560 pixels wide. Do you want to accommodate that? Your choice.

 

And then, of course, we now have 4K screens at 3840 pixels wide. Natively, the 1920 pixel image would then just cover half the screen. But that's not such a big practical problem as it might seem, because an industry standard workaround has been devised to cover exactly this problem. All web browsers and consumer-oriented image viewers, when they detect such a screen, will scale up images 2x. Instead of mapping pixels 1:1, they use four screen pixels to represent one image pixel.

 

In other words, these 4K screens are made to behave like standard HD screens, and so the same images can be used.

 

So it goes full circle. I'd go for 1920 pixels wide as a good practical compromise.


I'll try with 1920x540 on the large screens, Do you this the height looks good?

 

Thank you for your reply.