When building a custom WordPress theme, especially one designed by someone else, it’s helpful to use the specific image size that is required for that part of the page.
It matters even more so in today’s world of responsive design and mobile first where somebody might be viewing your site on an iPhone over 3G. The last thing you want to do in that situation is force them to download a 2000px wide image that’s only going to fit in a 300px wide space.
There is some debate when it comes to the blurriness of imagery on retina screens, which the iPhone has, but general photography will work fine at 300px wide in a 300px wide space, especially if it has a lot of detail because that tends to overpower the loss of quality from the retina screen showing it at 2x the original size.
Note: If you create a custom image size after uploading an image, you’ll need to use a tool like Regenerate Thumbnails for it to be cropped to the correct size.
Below you can find a few ways to output one of the custom image size we registered above.