RULE: The LCP image always has explicit width/height + fetchpriority="high" + no lazy-loading

Rule: Every Candid Creative client page identifies its LCP element (typically the hero image) and ensures:

1. Explicit width and height attributes (prevents CLS)
2. fetchpriority="high" attribute (raises Chrome's preload-scanner priority)
3. No loading="lazy" (lazy-loading the LCP image is the #2 cause of LCP failure per Reference: the 8 most common LCP killers — ranked by observed frequency)
4. Modern format (WebP or AVIF — Google WebP Compression Study: WebP is 25-34% smaller than JPEG at equivalent SSIM (avg ~30%))
5. Proper srcset/sizes for responsive serving
6. NOT hidden from preload scanner — never data-src, never CSS background-image, never JS-injected URL

Why: The single largest cause of LCP failure is hero-image mishandling. Google's own test on Google Flights showed fetchpriority="high" alone moved LCP from 2.6s to 1.9s. Web Almanac 2025: 7% of sites still hide their LCP image from the preload scanner entirely.

How to apply:

• Use Next.js <Image priority> on the hero (which sets fetchpriority="high" and disables lazy-loading)
• For non-Next.js sites: hand-coded <img> with all six properties
• Verify with WebPageTest filmstrip: the hero image should be in the first batch of requests, before any third-party scripts
• Re-check after any plugin or theme update — defaults change