SEO optimization

components/about.tsx

@@ -90,6 +90,7 @@ export default function About() {
 					I've built{" "}
 					<Link
 						href="https://github.com/HangerThem/linkboard"
+						aria-label="Linkboard a cool alternative to Linktree"
 						referrerPolicy="no-referrer"
 						target="_blank"
 					>
@@ -98,6 +99,7 @@ export default function About() {
 					, a cool alternative to Linktree, and I&apos;m currently developing{" "}
 					<Link
 						href="https://github.com/HangerThem/ephemr"
+						aria-label="Ephemr a simple social network"
 						referrerPolicy="no-referrer"
 						target="_blank"
 					>

components/contact.tsx

@@ -115,6 +115,7 @@ export default function Contact() {
 					<button
 						type="submit"
 						disabled={!data.name || !data.email || !data.message || loading}
+						aria-label="Send email"
 					>
 						{loading ? "Sending..." : "Send"}
 					</button>
@@ -123,6 +124,7 @@ export default function Contact() {
 				<SocialMedia>
 					<Link
 						href="https://www.instagram.com/ferda_borisjuk/"
+						arial-label="Instagram"
 						target="_blank"
 						rel="noreferrer"
 					>
@@ -130,6 +132,7 @@ export default function Contact() {
 					</Link>
 					<Link
 						href="https://github.com/HangerThem"
+						arial-label="Github"
 						target="_blank"
 						rel="noreferrer"
 					>
@@ -137,6 +140,7 @@ export default function Contact() {
 					</Link>
 					<Link
 						href="https://discord.com/users/495134242825699328"
+						arial-label="Discord"
 						target="_blank"
 						rel="noreferrer"
 					>
@@ -144,6 +148,7 @@ export default function Contact() {
 					</Link>
 					<Link
 						href="https://www.linkedin.com/in/franti%C5%A1ek-borisjuk-022686225/"
+						arial-label="Linkedin"
 						target="_blank"
 						rel="noreferrer"
 					>

components/footer.tsx

@@ -41,12 +41,20 @@ export default function Footer() {
 			<FooterContent>
 				<p>
 					Made with ❤️ by{" "}
-					<Link href="https://github.com/HangerThem">Frank Borisjuk</Link>
+					<Link
+						href="https://github.com/HangerThem"
+						aria-label="Frank Borisjuk's GitHub"
+					>
+						Frank Borisjuk
+					</Link>
 				</p>
 				<p>&copy; 2024 - All rights reserved</p>
 				<p>
 					Sources available on{" "}
-					<Link href="https://github.com/HangerThem/hangerthem.com">
+					<Link
+						href="https://github.com/HangerThem/hangerthem.com"
+						aria-label="This site's repository on GitHub"
+					>
 						GitHub
 					</Link>
 				</p>

components/navbar.tsx

@@ -348,7 +348,9 @@ const Navbar = () => {
 		<NavbarContainer>
 			<Topbar>
 				<Title>
-					<Link href="/">HangerThem</Link>
+					<Link href="/" aria-label="HangerThem's Home Page">
+						HangerThem
+					</Link>
 				</Title>
 				<HamburgerWrapper
 					ref={hanburgerRef}
@@ -364,6 +366,7 @@ const Navbar = () => {
 						<li key={link.id}>
 							<Link
 								href={link.href}
+								arial-label={link.text}
 								className={navState.activeTag === link.id ? "active" : ""}
 								onClick={() =>
 									setNavState((prev) => ({ ...prev, activeTag: link.id }))
@@ -376,7 +379,11 @@ const Navbar = () => {
 				</LinksContainer>
 				<SocialLinksContainer>
 					{socialLinks.map((socialLink) => (
-						<Link key={socialLink.id} href={socialLink.href}>
+						<Link
+							key={socialLink.id}
+							href={socialLink.href}
+							aria-label={socialLink.text}
+						>
 							{socialLink.icon}
 							{socialLink.text}
 						</Link>

components/projects.tsx

@@ -269,6 +269,7 @@ const Projects = () => {
 											href={project.href}
 											target="_blank"
 											title="View Project"
+											arial-label="View Project"
 										>
 											View Project
 										</ViewLink>
@@ -277,6 +278,7 @@ const Projects = () => {
 										href={project.source}
 										target="_blank"
 										title="View Source"
+										arial-label="View Source"
 									>
 										<Git size={30} />
 									</SourceLink>
@@ -284,10 +286,10 @@ const Projects = () => {
 							</ProjectCard>
 						))}
 					</CarouselWrapper>
-					<PrevButton onClick={handlePrev}>
+					<PrevButton onClick={handlePrev} aria-label="Previous Project">
 						<CaretLeftFill size={50} />
 					</PrevButton>
-					<NextButton onClick={handleNext}>
+					<NextButton onClick={handleNext} aria-label="Next Project">
 						<CaretRightFill size={50} />
 					</NextButton>
 					<CarouselIndicator>

components/skills.tsx

@@ -100,7 +100,7 @@ export default function Skills() {
 				<Categories>
 					{skills.languages && (
 						<SkillCategory>
-							<h4>Languages</h4>
+							<h3>Languages</h3>
 							<ul>
 								{skills.languages.map((language, index) => (
 									<li key={index}>
@@ -115,7 +115,7 @@ export default function Skills() {
 					)}
 					{skills.programmingLanguages && (
 						<SkillCategory>
-							<h4>Programming Languages</h4>
+							<h3>Programming Languages</h3>
 							<ul>
 								{skills.programmingLanguages.map(
 									(programmingLanguage, index) => (
@@ -132,7 +132,7 @@ export default function Skills() {
 					)}
 					{skills.technologies && (
 						<SkillCategory>
-							<h4>Technologies</h4>
+							<h3>Technologies</h3>
 							<ul>
 								{skills.technologies.map((technology, index) => (
 									<li key={index}>
@@ -147,7 +147,7 @@ export default function Skills() {
 					)}
 					{skills.tools && (
 						<SkillCategory>
-							<h4>Tools</h4>
+							<h3>Tools</h3>
 							<ul>
 								{skills.tools.map((tool, index) => (
 									<li key={index}>

styles/globalStyle.ts

@@ -56,4 +56,8 @@ export const GlobalStyle = createGlobalStyle`
       color: rgb(var(--primary), 0.8);
     }
   }
+
+  .grecaptcha-badge { 
+    visibility: hidden !important;
+}
 `