Shopify

  • Status Closed
  • Percent Complete
    100%
  • Task Type Enhancement
  • Category Backend / Core
  • Assigned To
    Owen
  • Operating System All
  • Severity High
  • Priority Critical
  • Reported Version 1.0
  • Due in Version Undecided
  • Due Date Undecided
  • Votes
  • Private
Attached to Project: Shopify
Opened by FS_admin - 23.08.2024
Last edited by FS_admin - 06.03.2025

FS#190 - Rework Shopify carousel form better CLS sore

Currently the CSL score for our home page is held back because the desktop images, 2560x1200, images are being delivered even on mobile devices
Closed by  FS_admin
06.03.2025 11:25
Reason for closing:  Won't implement
Additional comments about closing:  Requirement no longer required after move to new Shopify theme
Admin
FS_admin commented on 23.08.2024 12:35
Cloned and reworked Shopify's carousel (Slider) to add a mobile image. Added srcset directive to use this image at a specific breakpoint. The online documentation says this is not a great idea and the scrset should specify the same image at given dimensions, but this still results in squished images.

* N.B. This solution is not perfect.

* At the moment, I think, the desktop image would drop out when 3K resolution reached as the srcset currently only specifies this width.

* Both images need to be populated, even if only one is to be used.

* It has not been seen on a live page. At worst it could result in both images being loaded by the browser!

* Because of the above the transition from portrait to landscape maybe disjointed as only one breakpoint is specified
Admin
FS_admin commented on 07.11.2024 10:28
New images received, will now attempt to build the new carousel on the Home page

Loading...

Available keyboard shortcuts

Tasklist

Task Details

Task Editing