Size of Banner

[default8z6emmw48ect]

Hello! How can I determine the size of the headbaner for this site - https://insider.games/   (Insider.Games) Because I want to mark it, but I do not know what size it should be, thank you)

[ link disabled by moderator for security reasons ]

[D Fosse]

Someone might be willing to look at this if you removed the link and posted actual-size screenshots.

Is this a bait to generate clicks? We don't know. In any case we don't click on unknown links.

[default8z6emmw48ect]

This banner - 

[D Fosse]

OK, thanks 🙂

The answer is it depends on how you want it to be seen. If it's important that it always fill the full browser width, the website itself has to be coded for this. Then you just need to make sure it's big enough. 2000 pixels wide should probably do.

There is a downside to this, though. Browser scaling isn't very good, and you should be prepared that it will look soft and unfocused.

Often this can be overcome by contrasting it with crisp text. Which brings me to the second point: Don't add text in Photoshop. Photoshop is a pixel-based raster image editor, and text will always be rendered at the same resolution as the base image. Put live text above the image (CSS/HTML).

For fixed size images it's much simpler. Here you can sharpen optimally to a fixed number of pixels, so it will be razor sharp. Traditionally, 1000-1300 pixels wide is a comfortable size. However, there's no way to predict what the actual screen size will be, for the simple reason that it comes down to the screen resolution of whatever screen it's viewed on.

4K/retina is another complication related to that. If you size it for an average standard screen, it will be very small on a 4K/retina screen. The current industry standard is that the web browser scales up 2x when such a screen is detected. This is a clean pixel doubling, so it doesn't get blurry, just lower resolution.

Again, special website coding is possible, where you upload two versions and the browser picks the most appropriate one.