# No empty src or href attributes

- **Pattern:** `ab-002549` (`site-health-check.trust-polish.no-empty-src`)
- **Severity:** medium
- **Lifecycle:** active
- **Last modified:** 2026-04-18
- **Canonical URL:** https://auditbuffet.com/patterns/ab-002549
- **License:** CC-BY-4.0 — attribute to AuditBuffet Pattern Catalog (https://auditbuffet.com/patterns/ab-002549)

## Why it matters

An `<img src="">` or `<a href="">` is not a no-op — browsers resolve the empty string against the current document's URL and fire a second request for the page itself. That doubles server load on every page view, pollutes analytics with phantom pageviews, breaks Lighthouse audits, and in image contexts renders a broken-image placeholder users see. It's an AI-authored bug pattern: a conditional branch that forgot to drop the attribute when the value is missing.

## Severity rationale

Medium because empty attributes waste bandwidth, trigger self-referential page loads, and visibly break image and link rendering.

## Remediation

Either omit the attribute entirely when the value is missing, or gate the element itself. In JSX, use conditional rendering rather than always emitting the attribute:

```tsx
// wrong — emits src="" when imageUrl is falsy
<img src={imageUrl} alt={alt} />

// right — omit the element, or provide a fallback
{imageUrl ? <img src={imageUrl} alt={alt} /> : null}
```

Audit your templates with `grep -rn 'src=""\|href=""' src/ public/`.

## Detection

- **ID:** `no-empty-src`
- **Severity:** `medium`
- **What to look for:** Count all elements with `src` or `href` attributes in the HTML. Then count how many of these attributes have an empty value (`src=""` or `href=""`) — there must be no more than 0 empty values. Check specifically for `<img src="">`, `<script src="">`, `<link href="">`, `<iframe src="">`, and `<a href="">`. An attribute present with an empty string value is the issue — omitted attributes are fine.
- **Pass criteria:** 0 elements in the HTML have empty `src=""` or empty `href=""` attribute values. Report the total number of `src` and `href` attributes inspected (e.g., "Checked 24 src/href attributes — none empty").
- **Fail criteria:** 1 or more elements have `src=""` or `href=""` (attribute present but value is an empty string).
- **Skip (N/A) when:** The HTML body is less than 100 bytes (effectively empty — likely a redirect or minimal response).
- **Error when:** SPA detected.
- **Detail on fail:** `"Found 2 <img> tags with empty src attributes — causes duplicate requests to the current page"`
- **Remediation:** Empty `src` or `href` attributes cause browsers to make duplicate requests to the current page URL, wasting bandwidth and potentially causing errors. Find and fix them:

  ```bash
  # Find empty src/href in your HTML
  grep -rn 'src=""' src/ public/
  grep -rn 'href=""' src/ public/
  ```

  Common causes: conditional rendering that outputs `src=""` when no image URL is available, or placeholder attributes left in templates. Fix by either providing a real value, removing the attribute entirely, or using a placeholder image: `<img src="/placeholder.svg" alt="Loading...">`.

Taxons: reference-integrity

HTML version: https://auditbuffet.com/patterns/ab-002549
