HTML Guides for equal

The HTML parser reads element attributes by looking for a name, then an =, then a value. When it encounters = in a spot where it expects a name to start, it means something has gone wrong with the attribute syntax. This can happen in several ways: an attribute name is missing entirely before the =, there’s a double == instead of a single =, a space was accidentally inserted in the middle of an attribute name, or a previous attribute’s value was left unquoted causing the parser to lose track of where one attribute ends and the next begins.

This is a problem because browsers may silently discard the malformed attribute, apply it incorrectly, or even misinterpret surrounding attributes. This leads to unpredictable behavior across different browsers. Screen readers and other assistive technologies may also fail to interpret the element correctly, creating accessibility issues.

How to Fix It

1. Check for missing attribute names — Make sure every = sign is preceded by a valid attribute name like class, id, src, etc.
2. Check for double equals signs — Replace any == with a single =.
3. Check for spaces in attribute names — Attribute names cannot contain spaces. Remove accidental spaces within names.
4. Check for unquoted attribute values — Always quote attribute values with double quotes. An unquoted value containing special characters can cause the parser to misread subsequent attributes.
5. Check for stray = characters — Look for leftover = signs from copy-paste errors or incomplete edits.

Examples

Missing attribute name before =

An = appears with no attribute name before it:

<!-- ❌ Bad: no attribute name before = -->

<img ="photo.jpg" alt="A photo">

<!-- ✅ Fixed: added the src attribute name -->

<img src="photo.jpg" alt="A photo">

Double equals sign

A typo creates == instead of =:

<!-- ❌ Bad: double equals sign -->

<a href=="https://example.com">Link</a>

<!-- ✅ Fixed: single equals sign -->

<a href="https://example.com">Link</a>

Space inside an attribute name

A space splits what should be one attribute name into two tokens, leaving an orphaned =:

<!-- ❌ Bad: space in "data-value" splits the attribute -->

<div data- value="10">Content</div>

<!-- ✅ Fixed: no space in the attribute name -->

<div data-value="10">Content</div>

Unquoted attribute value causing a cascade

When a value isn’t quoted, the parser can misinterpret where it ends, causing the next attribute’s = to appear in an unexpected position:

<!-- ❌ Bad: unquoted class value with space causes parsing issues -->

<p class=my class id="intro">Text</p>

<!-- ✅ Fixed: properly quoted attribute value -->

<p class="my-class" id="intro">Text</p>

Stray = from an incomplete edit

A leftover = from a deleted or partially edited attribute:

<!-- ❌ Bad: stray = left over after removing an attribute -->

<div class="container" = >Content</div>

<!-- ✅ Fixed: removed the stray = -->

<div class="container">Content</div>

The HTML parser reads element tags by looking for attribute names, an = sign, and then a quoted value. When the parser finds a " character in a position where it expects an attribute name to start, it means something has gone wrong with the syntax. The validator flags this as a parse error because the browser has to guess what you intended, which can lead to attributes being silently dropped, values being misassigned, or unexpected rendering behavior.

This error most commonly occurs due to one of these causes:

• Missing = sign between an attribute name and its value (e.g., class"main" instead of class="main").
• Extra closing quote that creates a stray " after a valid attribute (e.g., class="main"" with a doubled quote).
• Stray quote from copy-paste errors or typos that leave orphan " characters floating in the tag.
• Accidentally deleted = during editing, breaking an otherwise valid attribute.

Beyond being invalid HTML, this problem can cause real functional issues. A missing = sign may cause the browser to interpret the attribute value as a separate (unknown) attribute, effectively losing the intended value. An extra quote can cause the parser to misread subsequent attributes, potentially breaking event handlers, links, or styling. These issues can also harm accessibility, as assistive technologies rely on properly parsed attributes to convey meaning.

Examples

Missing equals sign

The = between the attribute name and value is absent, so the parser sees "container" where it expects a new attribute name.

<!-- ❌ Bad: missing = before the value -->

<div class"container">Content</div>

<!-- ✅ Fixed: = added between name and value -->

<div class="container">Content</div>

Extra closing quotation mark

A doubled " at the end of an attribute value leaves a stray quote that the parser doesn’t expect.

<!-- ❌ Bad: extra " after the attribute value -->

<a href="https://example.com"">Visit</a>

<!-- ✅ Fixed: single closing quote -->

<a href="https://example.com">Visit</a>

Multiple attributes with a stray quote

When multiple attributes are present, a stray quote can also corrupt the parsing of subsequent attributes.

<!-- ❌ Bad: extra " after id value bleeds into the next attribute -->

<input id="email"" type="text" name="email">

<!-- ✅ Fixed: clean quotes on every attribute -->

<input id="email" type="text" name="email">

Missing equals sign on a later attribute

The error doesn’t always occur on the first attribute — it can appear on any attribute in the tag.

<!-- ❌ Bad: missing = on the style attribute -->

<p class="intro" style"color: red;">Hello</p>

<!-- ✅ Fixed: = added before style value -->

<p class="intro" style="color: red;">Hello</p>

How to fix it

1. Locate the line reported by the validator and look at the element’s attributes.
2. Check every attribute follows the name="value" pattern with no missing = signs.
3. Count your quotes — every opening " should have exactly one matching closing " for each attribute value.
4. Watch for smart quotes — curly quotes (" ") copied from word processors are not valid HTML attribute delimiters. Replace them with straight quotes (").
5. Use a code editor with syntax highlighting — mismatched or extra quotes are usually easy to spot when your editor color-codes attribute values.