# Bad character “X” after “<”. Probable cause: Unescaped “<”. Try escaping it as “&lt;”.

> Canonical HTML version: https://rocketvalidator.com/html-validation/bad-character-x-after-probable-cause-unescaped-try-escaping-it-as-lt
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

The `<` character is the opening delimiter for HTML tags. When the browser's HTML parser encounters `<`, it expects a valid tag name to follow (like `div`, `p`, `span`, etc.). If it instead finds an unexpected character—a digit, a symbol, a space, or anything that doesn't form a recognized tag—the parser enters an error state. The validator flags this because the `<` was almost certainly meant as literal content, not as the start of a tag.

This issue commonly appears in several scenarios:

- **Mathematical or comparison expressions** like `x < y` or `if (count < 10)`
- **Inline code or technical content** that includes angle brackets, such as explaining generics (`List<String>`) or template syntax
- **User-generated content** or CMS output where text hasn't been properly HTML-encoded
- **Copy-pasting code snippets** directly into HTML without escaping

Beyond triggering validation errors, unescaped `<` characters can cause real rendering problems. The browser may try to interpret the text following `<` as a tag, swallowing part of your visible content or producing unexpected DOM structures. This can also create accessibility issues, as screen readers rely on a well-formed DOM to convey content accurately.

## How to fix it

Replace every `<` that appears as content (not as part of an actual HTML tag) with the HTML entity `&lt;`. Similarly, replace literal `>` with `&gt;`. While `>` doesn't always cause validation errors, escaping both characters is a best practice that prevents ambiguity and keeps your markup clean.

If you're writing code examples, wrap them in `<code>` or `<pre>` elements—but note that you **still** need to escape `<` and `>` inside those elements. The `<pre>` and `<code>` tags preserve whitespace and indicate code semantics, but they do not disable HTML parsing.

## Examples

### ❌ Bad: unescaped `<` in a math expression

```html
<p>Check if x < 10 before proceeding.</p>
```

The parser sees `< 10` and tries to interpret `10` as a tag name, triggering the error.

### ✅ Fixed: escaped with `&lt;`

```html
<p>Check if x &lt; 10 before proceeding.</p>
```

### ❌ Bad: unescaped angle brackets in a code snippet

```html
<pre><code>
List<String> names = new ArrayList<String>();
</code></pre>
```

The parser interprets `<String>` as an unknown HTML tag, breaking the content.

### ✅ Fixed: all angle brackets escaped inside `<code>`

```html
<pre><code>
List&lt;String&gt; names = new ArrayList&lt;String&gt;();
</code></pre>
```

### ❌ Bad: unescaped `<` in a conditional expression

```html
<p>The expression 1 < 2 && 3 > 1 evaluates to true.</p>
```

### ✅ Fixed: both `<` and `>` escaped

```html
<p>The expression 1 &lt; 2 &amp;&amp; 3 &gt; 1 evaluates to true.</p>
```

Note that `&&` also needs to be escaped as `&amp;&amp;` because `&` is itself a reserved character in HTML.

### Quick reference for common HTML entities

| Character | Entity    | Description          |
|-----------|-----------|----------------------|
| `<`       | `&lt;`    | Less-than sign       |
| `>`       | `&gt;`    | Greater-than sign    |
| `&`       | `&amp;`   | Ampersand            |
| `"`       | `&quot;`  | Double quotation mark|

If you're generating HTML dynamically (via JavaScript, a server-side language, or a CMS), make sure your output pipeline includes an HTML-encoding step. Most frameworks and template engines provide a built-in escaping function—use it for any user-supplied or variable content that gets inserted into HTML.
