What size image should I use for featured images above the content and for backgrounds of Hero Unit elements?
When editing a post or page, you can select for a featured image to display above the content from the Post Options and Page Options meta boxes. This will display the image full-width of the browser window like this and this. And through the layout builder, you can setup awesome full-width hero units like this and this.
Now that you're using an image that's about 1,400 to 1,600 pixels wide, how tall should it be? This will depend on the specific scenario.
Standard Images: If you're using the image as a featured image above the content that's not using the parallax effect like this or you're using a background for a hero unit that you haven't set to fill the height of the browser window, you'll want your image to be much shorter. We suggest an image that is roughly a 7:3 aspect ratio. So for example, 1400x600, 1500x640, and 1600x680 would all be good sizes to use that are all roughly a 7:3 aspect ratio.
Parallax Images: If you're using an image above the content that has the parallax effect applied like this or you're using a background for a hero unit that you've set to fill the full height of the browser window like this, you'll want to have your images a bit taller to show off that parallax effect. The taller the image, the more dramatic that parallax effect will be. But try not to get carried away with the parallax effect, and remember that keeping it subtle is usually much nicer. So we suggest to use roughly a 16:11 aspect ratio. So for example, 1400x960, 1500x1030, 1600x1100 would all be good sizes that are all roughly a 16:11 aspect ratio.