# Bad value “x” for attribute “src” on element “img”: Tab, new line or carriage return found.

> Canonical HTML version: https://rocketvalidator.com/html-validation/bad-value-x-for-attribute-src-on-element-img-tab-new-line-or-carriage-return-found
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

The HTML specification requires that URL attributes like `src` contain valid URLs. While browsers are generally forgiving and may strip or ignore whitespace characters in URLs, including tabs (`\t`), newlines (`\n`), or carriage returns (`\r`) inside a `src` value is technically invalid. These characters are not legal within a URL according to both the HTML and URL standards.

Beyond standards compliance, there are practical reasons to fix this:

- **Unpredictable behavior:** Different browsers may handle embedded whitespace differently. Some might silently strip it, while others could encode it as `%0A` or `%0D`, leading to broken image requests.
- **Debugging difficulty:** Invisible characters make URLs fail silently. The path looks correct in your editor, but the actual HTTP request goes to a different (malformed) URL.
- **Accessibility and tooling:** Screen readers, crawlers, and other tools that parse your HTML may not handle malformed URLs gracefully, potentially causing images to be skipped or reported as broken.

## Common Causes

This issue typically appears in a few scenarios:

1. **Multi-line attributes in templates:** When a URL is built dynamically in a template engine (e.g., PHP, Jinja, Handlebars), line breaks in the template code can leak into the rendered attribute value.
2. **Copy-paste errors:** Copying a URL from a document, email, or another source may include hidden line breaks or tab characters.
3. **Code formatting:** Some developers or auto-formatters may break long attribute values across multiple lines, inadvertently injecting newlines into the value.
4. **String concatenation:** Building URLs through string concatenation in server-side code can introduce whitespace if variables contain trailing newlines.

## Examples

### Incorrect: Newline inside `src` value

The newline before the closing quote makes this an invalid URL:

```html
<img src="images/photo.jpg
" alt="A scenic photo">
```

### Incorrect: Tab character in `src` value

A tab character embedded in the middle of the URL path:

```html
<img src="images/	photo.jpg" alt="A scenic photo">
```

### Incorrect: Multi-line URL from template output

This can happen when a template engine outputs a URL with leading or trailing whitespace:

```html
<img src="
  https://example.com/images/photo.jpg
" alt="A scenic photo">
```

### Correct: Clean, single-line `src` value

The URL is a single continuous string with no tabs, newlines, or carriage returns:

```html
<img src="images/photo.jpg" alt="A scenic photo">
```

### Correct: Long URL kept on one line

Even if the URL is long, it must remain on a single line without breaks:

```html
<img src="https://cdn.example.com/assets/images/2024/photos/scenic-landscape-full-resolution.jpg" alt="A scenic photo">
```

## How to Fix It

1. **Inspect the attribute value:** Open the raw HTML source (not the rendered page) and look at the `src` value character by character. Use your editor's "show whitespace" or "show invisible characters" feature to reveal hidden tabs and line breaks.
2. **Remove all whitespace inside the URL:** Ensure the entire URL is on a single line with no tabs, newlines, or carriage returns anywhere between the opening and closing quotes.
3. **Check your templates:** If the URL is generated dynamically, trim the output. Most languages offer a `trim()` or `strip()` function that removes leading and trailing whitespace including newlines.
4. **Lint your HTML:** Use the W3C validator or an HTML linter in your build pipeline to catch these issues automatically before deployment.