htmlimagetextalthtml-escape-characters

How to use escape characters in an alt attribute inside an img element in HTML?


Is this the right way to use escape characters in alt attributes for alt text of an img element?

I have the below code:

<h3>Option 1</h3>
<img src="image.jpg" 
     alt='Version of "Whistler\'s Mother" in cubist style'>

<br><br>

<h3>Option 2</h3>
<img src="image.jpg" 
     alt="Version of \"Whistler's Mother\" in cubist style">

Either of the two options above do not work properly as the alt text. The alt text that I wanted to display is:

Version of "Whistler's Mother" in cubist style


Solution

  • No, use the HTML entity instead. E.g. &apos; or &quot;:

    <h3>Option 1</h3>
    <img src="image.jpg" 
         alt='Version of "Whistler&apos;s Mother" in cubist style'>
    
    <br><br>
    
    <h3>Option 2</h3>
    <img src="image.jpg" 
         alt="Version of &quot;Whistler's Mother&quot; in cubist style">