fix(accessibility): add descriptive alt text to all image elements (closes #310)

[shashankcodes1903]

Description

Added descriptive alt text to image elements that were missing it or had empty
alt attributes across multiple components. Also fixed invalid codelab variable
references in util/CodelabCard/index.jsx that would have caused runtime errors,
replacing them with the correct title prop that is actually available in scope.

Related Issue

Closes #310

Motivation and Context

Multiple image elements across the application were missing descriptive alt text
or had empty alt attributes (alt=""), violating WCAG 2.1 accessibility standards.
This prevented screen reader users from understanding image content, making the
application inaccessible to users with visual impairments.

How Has This Been Tested?

• Manually inspected all affected components in the browser
• Verified no visual regressions after changes
• Ran Lighthouse accessibility audit in Chrome DevTools to confirm alt text issues
  are resolved
• Tested with a screen reader to confirm images are now announced correctly

Screenshots or GIF (In case of UI changes):

No visual changes — alt text is not visible in the UI.

Types of changes

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to change)

Checklist:

• My code follows the code style of this project.
• My change requires a change to the documentation.
• I have updated the documentation accordingly.
• I have added tests to cover my changes.
• All new and existing tests passed.