Improved accessibility: added alt and title to logo image

[harleenkaur2003]

Changes Made:

• Updated <amp-img> tag in index.html to include proper alt attributes.

Why:

• Improves accessibility (screen reader support)
• Enhances semantic HTML for better UX

Notes:

Self-initiated contribution while exploring MusicBlocks as part of the Code4GovTech 2025 program.

[github-actions]

✅ All Jest tests passed! This PR is ready to merge.

[walterbender]

I am unfamiliar with the title attribute. What is it for?

[harleenkaur2003]

I am unfamiliar with the title attribute. What is it for?

Thank you for reviewing my PR.
The title attribute provides a small tooltip when a user hovers their mouse over the image - in this case, it would show “MusicBlocks Logo”.

It’s a small UX improvement that gives extra context to visual users without affecting accessibility.

I’m happy to remove it if you feel it’s unnecessary. Appreciate your time and feedback.

[walterbender]

I never knew about that feature and cannot find it here: https://www.w3schools.com/tags/tag_img.asp Can you please point me to the documentation?

[harleenkaur2003]

I reviewed it again and realized that while the title attribute is standard for normal HTML , the component is part of AMP framework and has stricter specifications.

If you prefer I can remove the title attribute to stay fully aligned with amp specs.

Please let me know, and I’ll update the PR accordingly.

Thanks again for your guidance and helping me learn.

[walterbender]

It is prob. better to remove it if it is not standard HTML.

[github-actions]

✅ All Jest tests passed! This PR is ready to merge.

[harleenkaur2003]

Requested changes have been made.

• Removed the title attribute from as per your feedback.
• Updated the PR description .

Please review when convenient. Thank you again.