[Resolved] Missing security headers & Logo size error on mobile

[Angela]

Hi Tom
I have a few relatively minor issues I’m trying to resolve & hope you can help guide me.

When I run a speed test on WebPageTest.Org I get a couple of security issues. 1 is X Frame Options header is missing (medium severity) and the 2nd is X XSS Protection header is missing (low severity).

When I run a Lighthouse test for Mobile, I get an issue on Best Practice regarding the logo. “Displays images with inappropriate size”. It states the image displayed at 200×40, the actual size is 350×70 and it expected 600×120. I noticed someone raised something similar to this on their featured images but other than hiding those images, I did see a resolution. I don’t want to hide my logo on mobile.

Thanks in advance

Angela

[Tom]

Hi there,

I believe the first two security issues need to be addressed on your server. You should be able to ask your hosting support about that.

The other issue seems to be that your logo is 1200×240 being resized down to 200×40. If you want it to display at 200×40, you should upload an image that is around 400×80.

Hope this helps!

[Angela]

Thank for the quick turnaround. I’ll speak to hosting about the security issues – thanks.

I’ve changed the images but the exact same issue persists. I run Google’s Lighthouse on mobile …. “Displays images with inappropriate size”. It states the image displayed at 200×40, the actual size is 350×70 and it expected 600×120

As the theme’s recommended size is 350×70, and my uploaded image are 200×40 and 400×80 for retina, I’d assumed this was theme related somehow.

Thanks again

Angela

[Tom]

The 350×70 logo seems to be your Mobile Header logo in Customize > Layout > Header.

You could upload them both as 600×120, but I would say that’s likely not completely necessary – 400×80 should be sufficient.

[Angela]

A-ha! I missed the layout > header logo. All sorted now. Thank you. Have a top day.

[Tom]

Thanks! You too 🙂

[Author]

Posts