Docs

[xsimon59]

Hi-

On http://bostonhypnosis.com/ I have a”hero” or featured image at the top of the page. I’d like to be sure I’ve set it up in the best way possible. Right now I have it set up a background image for the section and I’m using a gap to hold the space for it. The problems I’m seeing are-
-it’s slow to load, even after pshop optimization.
-It’s cutting off the bottom of the photo on my full screen monitor.

Could you advise me (or point me to a kbase article) on how to set this up in the best way possible?

-Brian

[Rahul]

Hey There,

Thanks fir writing in.

1. In regards to the speed, you could try check the link below.

https://community.theme.co/kb/performance/

2. You can set an single image there, The reason why the slider is slow now is image’s size, Please optimize it, Also dimension is high, Maximum recommended width for image is 1600px.

Hope it helps.

Let us know how it goes.

Thanks.

[xsimon59]

I’m “saving for web” out of photoshop then using EWW image optimizer on it. EWW says it’s only getting me an extra 1-2%. Is there any thing else you’d recommend I do to optimize it?

Also, can you confirm that the way I have it set up (as a background image with a gap to size it) is the best way to handle the image?

Thanks.

-Brian

[Rue Nel]

Hello Brian,

Thanks for the updates! It turns out that you are using .gif for your image. Please go change it and you can use .jpg or .png. With these formats, maybe you’ll save more compared to the gif format. To know the difference between gif, jpg and png, please check this link:
https://www.sitepoint.com/gif-jpg-png-whats-difference/

Please keep in mind that the background image size will depend on the dimension (width and height) of the section. To understand how the background image works inside the section, please check out this topic: https://community.theme.co/forums/topic/section-background-image-2/#post-691126

Hope this helps.

[Author]

Posts