Adjust how the card elements are read by screen readers

Author: Abhiek187

src/tests/Projects.test.tsx

@@ -44,7 +44,7 @@ describe("Projects", () => {
       const projectImage = projectCard.children[1] as HTMLImageElement;;
       // If there are any special characters in the image's url, encode them
       expect(projectImage.src).toBe(`${window.location.origin}${encodeURI(project.image)}`);
-      expect(projectImage.alt).toBe(project.name);
+      expect(projectImage.alt).toBe(`Screenshot of ${project.name}`);
 
       const projectAbout = projectCard.children[2] as HTMLParagraphElement;
       expect(projectAbout).toHaveTextContent(project.about);

src/tsx/Projects.tsx

@@ -56,15 +56,12 @@ const Projects: React.FC<OnClickProp> = ({ onClickLink }) => {
               <img
                 className="projects-image card-img-top"
                 src={project.image}
-                alt={project.name}
+                alt={`Screenshot of ${project.name}`}
               />
               <p className="projects-about card-text">
                 {project.about}
               </p>
-              <p
-                className="projects-technology-header"
-                aria-label={`Made using: ${project.technology}`}
-              >
+              <p className="projects-technology-header">
                 Made Using:
               </p>
               <div className="projects-technology-container">