Bad value “true” for attribute “controls” on element “audio”.

The controls attribute on <audio> is a boolean attribute, so it takes no value: write controls, not controls="true".

A boolean attribute is on when it's present and off when it's absent. The HTML specification allows three forms: the bare name (controls), an empty value (controls=""), or the attribute's own name as the value (controls="controls"). Any other value is invalid, "true" included.

Browsers still show the player for controls="true", because they only check whether the attribute exists. For the same reason, controls="false" doesn't hide the controls. To hide the browser's controls, remove the attribute. The validator rejects controls="false" as a bad value too.

This markup often comes from a template or script that prints a boolean variable straight into the attribute. Output the attribute name when the value is true, and leave the attribute out when it's false.

Invalid example

<audio controls="true" src="episode.mp3">
  <a href="episode.mp3">Download the episode</a>
</audio>

Valid example

<audio controls src="episode.mp3">
  <a href="episode.mp3">Download the episode</a>
</audio>

Learn more:

MDN Reference

MDN Web Docs: The audio element

→

MDN Reference

MDN Web Docs: Boolean attributes

→

MDN Reference

MDN Web Docs: HTMLMediaElement.controls

→