image sizes dispatch

Hi,

Im using the dispatch theme. It looks great but im having problems with the header element. I had someone to check what the problem is why my site is slow. The header element seems to be the problem. He gave me the following explanation and I hope you guys can help me out to fix this problem.

This is what he wrote:
So here is something I’ve discovered. Those images I referenced yesterday in your header, the original images are much larger than what you see, which you get marked down on. Here is an accurate report for your site right now https://gtmetrix.com/reports/seamelon.com/PfnyKuR9

Note how youre on a C grade but that the only area youre really being marked down on is Serve Scaled Images. If you expand that category you’ll see every image in there is from the header area. It’s basically saying the original images are much larger than how they are being shown on a screen, so reduce them. This is what I did last night and it gave us an A grade - https://gtmetrix.com/reports/seamelon.com/S0l6WID7

So that’s great! But this is the issue - by reducing the scale of those images, yes it does fix the issue, however that fix has to be applied to the entire header area, so what it does is then also reduces the size of that first larger image, which then makes it very visibly blurry as you saw. There isn’t really a way to combat this because it’s all one element and all the images are the wrong size.

The same issue was originally occuring on other areas down the page, but they are all evenly spaced so they’re easier to fix, it’s just because this one is 1 big, 4 small.
--

Hope you guys can help me out!

Thank you,
Femke