-
Search Results
-
Topic: Menu Parallax Demo Issues
Hello,
when I resize the browser window, their is a grey background appears before the video in the slider adjusts. How can I change that to the background color of the site (#080808)?
I’m raising a similar issue as described in this post: https://kriesi.at/support/topic/image-resizing-for-mobile/
Website: http://www.henleyherald.com
On the home page there is a Blog Posts element for Top Stories in a 2/3 column. Styling > Appearance is set for:
• 3 columns
• Choose the image size manually
• Image Size is Portfolio Small (260 x 185 px)In desktop mode, using Dev Tools, Elements shows the img src attribute for each image is the 260 px wide image. Using the Network tab, it is confirmed that the 260 px wide image is being downloaded.
The Lighthouse Performance score on desktop for the home page averages 97-98. Smush is used to compress images on upload. Lighthouse suggests further improvements could be achieved on the Top Story images, e.g. Efficiently encode images – Potential savings of 264 KiB. But I’m certainly not complaining about a score of 97.
Switch Dev Tools to Mobile mode however and something weird happens. The Performance score drops significantly to 68. The improvement suggestion changes to: Properly size images – Potential savings of 401 KiB. The emulator screen size is 400 px wide.
On analysing the Blog Posts via Elements and Network, the images being loaded in responsive mode are now the full size images.
Take the “Hurricanes Blow Away Opposition in Cup Final” story. The img src attribute is: src=https://www.henleyherald.com/wp-content/uploads/2024/05/AFC-Henley-Hurricanes-Oxford-FA-Cup-Final-e1716205297662-260×173.jpg, and in desktop mode this file is loaded, sized at 92.8kb.
When in mobile mode, Dev Tools says the rendered size is the same as desktop (260 x 173 px) and of course the src is as above, but the intrinsic size is now 700 x 467 px and the actual file loaded is
https://www.henleyherald.com/wp-content/uploads/2024/05/AFC-Henley-Hurricanes-Oxford-FA-Cup-Final-e1716205297662-700×467.jpg, file size 509kb.Why is the full size image being loaded in mobile mode? Or is Dev Tools reporting this incorrectly?
How do I get the correct smaller 260 x173 px image loaded instead?
NB. There’s the same problem on the Highlighted News stories. In desktop mode, all the images are loaded as 150 px wide; when in mobile mode, all the images loaded are larger at 260px wide.
HI
I have a background video on my site that is loading slowly.
I read this thread: https://kriesi.at/support/topic/self-hosted-videos-too-slow-to-load/#post-1187018 and wondered if that also applies to self hosted videos, or if there is something else I can do to speed it up.
thanks for your help
Nancy