Site Map
Every guide and page on Image Load Lab, grouped by topic: formats and compression, responsive delivery, loading performance and WordPress workflow.
Browser Behaviour
- Carousel Slides: fetchpriority=low Did Not Help, loading=lazy Did
- Chrome’s Accept Header for Images and What It Means for Format Negotiation
- Chrome’s Image Priorities: Medium, Low and the Boost to High
- Client Hints on Image Requests: What Chrome Sends
- Do Blurred Placeholders Improve LCP? Four Techniques Tested
- Do Hidden Images Still Download? display:none and Lazy Loading in Chrome
- Does Chrome Reuse a Larger srcset Image From Its Cache?
- EXIF Orientation: Why Stripped or Converted Photos Turn Sideways
- Fade-In Effects and LCP: Which Entrance Animations Delay It
- Hidden CSS Background Images: Which Ones Chrome Still Downloads
- How Chrome Chooses a Source in the picture Element
- Image Decode Time in Chrome: JPEG vs WebP vs AVIF vs PNG
- Images in Closed details and dialog Elements: Downloaded or Not?
- Lazy Loading in a Horizontal Carousel: How Far Ahead Chrome Loads
- Lazy-Loaded iframes: Chrome Loads Them Twice as Far Ahead as Images
- Low-Content Images and LCP: Testing Chrome’s 0.05 Bits-per-Pixel Rule
- Native Lazy Loading vs lazysizes vs IntersectionObserver
- picture for Dark Mode and Reduced Motion: What Chrome Downloads
- Preloading Responsive Images: How a Mismatch Causes Double Downloads
- Video Poster Images and LCP: Same as an img?
- When Does Chrome Request an Image? Six Ways to Reference It, Timed
- Which Elements Count as LCP? img, Background, Poster, SVG and Canvas Tested
- Which Favicon Files Does Chrome Download?
Formats & Compression
- 10-bit vs 8-bit AVIF for Ordinary Images: Size, Quality and Speed
- Animated GIF vs WebP vs AVIF: Three Animations Measured
- AVIF Encoder Effort: Speed vs File Size on 20 Photos
- Base64 Data URIs: Does the 33 % Overhead Survive Compression?
- Charts as SVG, PNG, WebP or AVIF: What Each Format Costs
- Chroma Subsampling 4:2:0 vs 4:4:4: When It Matters and What It Costs
- CMYK JPEGs on the Web: File Size and Colour in Chrome
- cwebp Presets Compared: Do photo, picture and text Make a Difference?
- Display P3 Photos and ICC Profiles: What Stripping the Profile Does
- Greyscale JPEG vs Colour JPEG for Black-and-White Photos
- JPEG Quality in the Browser: Chrome’s Canvas Encoder vs MozJPEG
- Matching Quality Settings Across JPEG, WebP and AVIF
- MozJPEG vs Default JPEG Settings: 20 Photos at Equal Quality
- oxipng Optimisation Levels: Bytes Saved vs Time
- Palette PNG (Quantisation) vs Full-Colour PNG vs WebP
- PNG for Photos: How Much Bigger Than JPEG?
- PNG vs WebP for Transparency: Edges Tested on Three Backgrounds
- PNG, oxipng or Lossless WebP for Screenshots? 8 Captures Measured
- Progressive vs Baseline JPEG: File Size and What Visitors See
- Removing EXIF Metadata: What 20 Real Photos Contained and What It Saves
- Retina Screenshots: What a 2× File Really Costs
- Sharpening After Resizing: What It Costs in File Size
- SVG and HTTP Compression: gzip vs Brotli on 28 Files
- SVG Icons: Separate Files, a Sprite or Inline?
- SVG vs PNG for Interface Icons: Bytes and Sharpness Measured
- SVGO on Real SVG Files: Savings and Visual Safety
- WebP alphaQuality: How Low Can Transparency Go?
- WebP and AVIF for Thumbnails: Do the Savings Hold at Small Sizes?
- WebP Near-Lossless: Smaller Than Lossless, Cleaner Than Lossy?
- WebP vs AVIF vs JPEG at Equal Quality: 20 Photos Measured
- Which WebP Quality to Use for Photos, Screenshots and Graphics
Lighthouse Audits
- Does Lighthouse Catch Bad Alt Text? Ten Cases Tested
- How Much Do Lighthouse Results Vary Between Identical Runs?
- Lighthouse ‘Avoid Enormous Network Payloads’: Where the Warning Starts
- Lighthouse ‘Explicit Width and Height’: Which Sizing Methods Pass
- Lighthouse ‘Serves Images With Appropriate Resolution’: Where the Line Is
- Lighthouse Aspect Ratio Audit: It Flags Distortion You Cannot See
- Lighthouse LCP Request Discovery: What Each Hero Setup Gets
- Lighthouse Simulated vs Applied Throttling on Image-Heavy Pages
- When Lighthouse Flags Oversized Images, and How Accurate Its Savings Are
- Which JPEGs Does Lighthouse Still Flag for Format or Compression?
Performance Lab
- A Base64 Image Inside Your CSS: What It Does to First Paint
- A CLS of 1.0 From Our Own Stylesheet: What We Measured and Fixed
- Auditing Every Image Request: What We Found on Our Own Pages
- Blurred Image Placeholders (LQIP and BlurHash): How Small Can They Be?
- Cache-Control for Images: Repeat Visits With no-store, ETag and immutable
- content-visibility: auto on a 1,000-Card Image Gallery
- decoding=”async” Tested: Does It Change LCP or Blocking Time?
- fetchpriority and preload for the LCP Image: When They Help
- Hero Image Bytes vs LCP: About Half a Second per 100 KB on Slow 4G
- How Far Below the Fold Does Chrome Start Loading Lazy Images?
- HTTP/2 vs HTTP/1.1 for a Grid of Thumbnails
- Images Without width and height: Layout Shift Measured
- Inline CSS vs an External Stylesheet: First Paint on a Throttled Phone
- Lazy Loading Measured: Bytes Saved and the Cost of a Lazy Hero
- We Audited Every Image on This Site: What We Found and Fixed
- What a Page Cache Did to This Site’s Server Response Time
Responsive Delivery
- Art Direction With picture: Crops and Bytes Measured on 3 Screens
- CSS Background Heroes vs img: How Much Later Does the Image Load?
- CSS image-set() With type(): Which Background File Chrome Downloads
- High-DPI Images: How Many Pixels Are Worth the Bytes?
- How Many srcset Widths Do You Need? Seven Candidate Lists Compared
- Image Width vs File Size: What Halving the Dimensions Saves
- object-fit: cover and srcset: Blurry Images and Hidden Bytes
- Resize Kernels Compared: Lanczos3, Mitchell, Linear and More
- sizes for Grid Layouts: What 100vw Costs in a Card Grid
- srcset and sizes Measured: Which File Chrome Downloads on 3 Screens
- srcset x vs w Descriptors: Which File Chrome Downloads at Each Pixel Ratio
WordPress Workflow
- Before You Install an Image Plugin: Measure What It Could Save
- Cache Headers on a Shared WordPress Host: What Each File Type Gets
- Our Theme Lazy-Loaded the First Archive Image: What WordPress Does Instead
- Uploading AVIF to WordPress: What Our Shared Host Actually Did
- What WordPress Creates When You Upload a Photo: 3 Uploads Measured
- What WordPress Writes When You Upload a Photo: Quality, Sampling and Metadata
- When Alt Text Breaks srcset: A WordPress sizes Quirk
- WordPress Big Image Threshold and the 2048-Pixel srcset Limit
- WordPress Image Sizes: Which One Does the Browser Actually Download?
Lab pages
The machine-readable sitemap is at /wp-sitemap.xml.