ichelonconsulting.com

Every <img> needs an alt attribute. Alt text helps screen readers, image search ranking, and shows when the image fails to load. Use alt="" only for purely decorative images.

<img src="photo.jpg">

<img src="photo.jpg" alt="Descriptive text describing the image content">

Add an Open Graph image so links to this page render as a rich card on social platforms. Use 1200x630 px, JPEG/PNG, under 1MB.

<head>
  <!-- no og:image -->
</head>

<head>
  <meta property="og:image" content="https://yoursite.com/og-image.jpg">
  <meta property="og:image:width" content="1200">
  <meta property="og:image:height" content="630">
</head>

Open Lighthouse in Chrome DevTools or PageSpeed Insights — the report lists specific opportunities ranked by impact.

Largest Contentful Paint should load within 2.5s. Optimise the largest above-the-fold element: compress hero images, preload critical assets, and eliminate render-blocking resources.

<img src="hero.jpg">

<link rel="preload" as="image" href="hero.webp">
<img src="hero.webp" fetchpriority="high" width="1200" height="600" alt="...">

First Contentful Paint should be under 1.8s. Inline critical CSS, defer non-critical CSS/JS, and use a CDN.

Headings should descend logically: H1 → H2 → H3, no jumps. Skipping levels (H1 → H3) breaks accessibility tools and confuses crawlers.

<h1>Page Title</h1>
<h3>Section</h3>  <!-- skipped H2 -->

<h1>Page Title</h1>
<h2>Section</h2>
<h3>Subsection</h3>

Add Strict-Transport-Security header so browsers refuse HTTP for your domain after the first visit. Bumps SSL Labs grade to A+.

Strict-Transport-Security: max-age=31536000; includeSubDomains

Enable gzip or Brotli compression on your server. Typically cuts text payload by 70-80% — easy LCP win.

Add rel="noopener noreferrer" to target="_blank" links. Without noopener, the linked page can manipulate your window object — security + perf risk.

<a href="https://other.com" target="_blank">External</a>

<a href="https://other.com" target="_blank" rel="noopener noreferrer">External</a>

Convert images to WebP or AVIF — typically 25-50% smaller than JPEG/PNG with no visible quality loss. Use <picture> for fallback.

<img src="photo.jpg">

<picture>
  <source type="image/avif" srcset="photo.avif">
  <source type="image/webp" srcset="photo.webp">
  <img src="photo.jpg" alt="...">
</picture>