This question is an exact duplicate of:
What size would be good for Hero image in pixels length and weight for both laptop and desktop?
Desktop images are more rectangular and the mobile device square images, this needs to be considered. Say desktop is designed say at 1688px wide or at 1366px wide, or 1920px wide – some say that the larger size is necessary due to large monitor – which is common, best?
What would be a good length?
I don’t want it to have such a great length, so that it is hard to see what is below the banner or require a lot of scrolling., perhaps it is good to still something showing just below the banner. What would be the ratio for the hero image that would work?
Optimize for load time
Eventually, it will be a gif or some file that enables some movement.
Any thoughts on how a coder can work with the file so that it loads faster?
Is there a way for a coder to specify that the image be static sometimes – depending on device? on other relevant issues?
I might want the banner image to be static on mobile phones as the load time needs to be quick so the movement be visible on the desktop version, is there a code to do this or how?