Template tag ID contains disallowed characters

Hello,

I'm trying to create a custom template that will allow users to add images to a carousel the code is below:

<div class="<perch:content id="class" type="text" label="Class"/>"> <img id="image1" src="<perch:content type="image" id="image" label="Image" width="550" height="350"/>" alt="<perch:content id="alt" type="text" label="Image Description"/>"> </div>

When I add this to my perch templates an go to create, I get a "Template tag ID contains disallowed characters" error for the class, image and alt perch ID's.

Despite the error message it does provide me with editable text boxes, but for all three, including the image type. Are there syntax errors in my code causing this problem?

Thanks.