diff --git a/src/components/HeroImage.astro b/src/components/HeroImage.astro
index a297914..c5206db 100644
--- a/src/components/HeroImage.astro
+++ b/src/components/HeroImage.astro
@@ -1,5 +1,9 @@
 ---
-import Hero from '../icons/about.svg'
+import HeroSVG from '../icons/about.svg'
+import { siteTitle } from '@src/consts'
 ---
 
-<Hero class:list={'m-auto h-[300px] object-cover'} />
+<HeroSVG
+  aria-label=`${siteTitle} Hero`
+  class:list={'m-auto h-[300px] object-cover'}
+/>
diff --git a/src/components/Logo.astro b/src/components/Logo.astro
index 1a15f61..837d592 100644
--- a/src/components/Logo.astro
+++ b/src/components/Logo.astro
@@ -15,5 +15,11 @@ const { background = false } = Astro.props
       <div class='bg-primary rounded-full absolute -z-50 transition-all top-1 left-1 h-16 w-16' />
     )
   }
-  <LogoSVG width={96} height={96} class='ml-2' fill='currentColor' />
+  <LogoSVG
+    aria-label='logo'
+    width={96}
+    height={96}
+    class='ml-2'
+    fill='currentColor'
+  />
 </a>
diff --git a/src/components/SocialLinks.astro b/src/components/SocialLinks.astro
index 2390e71..d247816 100644
--- a/src/components/SocialLinks.astro
+++ b/src/components/SocialLinks.astro
@@ -6,13 +6,23 @@ import { socialMedia } from '@src/consts'
 ---
 
 <div class='flex items-center justify-center gap-2 h-8'>
-  <a aria-label='instagram' href={socialMedia.instagram} target='_blank'>
-    <Instagram width={32} height={32} fill='currentColor' />
+  <a href={socialMedia.instagram} target='_blank'>
+    <Instagram
+      aria-label='Instagram'
+      width={32}
+      height={32}
+      fill='currentColor'
+    />
   </a>
-  <a aria-label='github' href={socialMedia.github} target='_blank'>
-    <Github width={32} height={32} fill='currentColor' />
+  <a href={socialMedia.github} target='_blank'>
+    <Github aria-label='Github' width={32} height={32} fill='currentColor' />
   </a>
-  <a aria-label='linkedin' href={socialMedia.linkedin} target='_blank'>
-    <Linkedin width={32} height={32} fill='currentColor' />
+  <a href={socialMedia.linkedin} target='_blank'>
+    <Linkedin
+      aria-label='Linkedin'
+      width={32}
+      height={32}
+      fill='currentColor'
+    />
   </a>
 </div>
diff --git a/tests/blog.spec.ts-snapshots/Blog-pages-has-all-blog-posts-link-on-homepage-1-Mobile-Chrome-linux.png b/tests/blog.spec.ts-snapshots/Blog-pages-has-all-blog-posts-link-on-homepage-1-Mobile-Chrome-linux.png
new file mode 100644
index 0000000..986731a
Binary files /dev/null and b/tests/blog.spec.ts-snapshots/Blog-pages-has-all-blog-posts-link-on-homepage-1-Mobile-Chrome-linux.png differ
diff --git a/tests/darkmode.spec.ts-snapshots/Default-dark-mode-has-light-mode-after-color-change-1-Mobile-Chrome-linux.png b/tests/darkmode.spec.ts-snapshots/Default-dark-mode-has-light-mode-after-color-change-1-Mobile-Chrome-linux.png
new file mode 100644
index 0000000..6498629
Binary files /dev/null and b/tests/darkmode.spec.ts-snapshots/Default-dark-mode-has-light-mode-after-color-change-1-Mobile-Chrome-linux.png differ
diff --git a/tests/darkmode.spec.ts-snapshots/Default-light-mode-has-dark-mode-after-color-change-1-Mobile-Chrome-linux.png b/tests/darkmode.spec.ts-snapshots/Default-light-mode-has-dark-mode-after-color-change-1-Mobile-Chrome-linux.png
new file mode 100644
index 0000000..da2aa91
Binary files /dev/null and b/tests/darkmode.spec.ts-snapshots/Default-light-mode-has-dark-mode-after-color-change-1-Mobile-Chrome-linux.png differ
diff --git a/tests/homepage.spec.ts b/tests/homepage.spec.ts
index d778ba8..59430e7 100644
--- a/tests/homepage.spec.ts
+++ b/tests/homepage.spec.ts
@@ -66,7 +66,7 @@ test.describe('Homepage areas', () => {
 
   test('has footer', async ({ page }) => {
     await expect(
-      page.getByRole('contentinfo').getByLabel('instagram'),
+      page.getByRole('contentinfo').getByLabel('Instagram'),
     ).toBeVisible()
   })
 })
diff --git a/tests/homepage.spec.ts-snapshots/Homepage-areas-has-header-1-Mobile-Chrome-linux.png b/tests/homepage.spec.ts-snapshots/Homepage-areas-has-header-1-Mobile-Chrome-linux.png
new file mode 100644
index 0000000..6630fb7
Binary files /dev/null and b/tests/homepage.spec.ts-snapshots/Homepage-areas-has-header-1-Mobile-Chrome-linux.png differ
diff --git a/tests/language.spec.ts-snapshots/has-English-title-after-language-change-1-Mobile-Chrome-linux.png b/tests/language.spec.ts-snapshots/has-English-title-after-language-change-1-Mobile-Chrome-linux.png
new file mode 100644
index 0000000..6498629
Binary files /dev/null and b/tests/language.spec.ts-snapshots/has-English-title-after-language-change-1-Mobile-Chrome-linux.png differ
diff --git a/tests/language.spec.ts-snapshots/has-English-title-after-language-change-2-Mobile-Chrome-linux.png b/tests/language.spec.ts-snapshots/has-English-title-after-language-change-2-Mobile-Chrome-linux.png
new file mode 100644
index 0000000..1f5d8df
Binary files /dev/null and b/tests/language.spec.ts-snapshots/has-English-title-after-language-change-2-Mobile-Chrome-linux.png differ
diff --git a/tests/language.spec.ts-snapshots/has-German-title-1-Mobile-Chrome-linux.png b/tests/language.spec.ts-snapshots/has-German-title-1-Mobile-Chrome-linux.png
new file mode 100644
index 0000000..8776c5f
Binary files /dev/null and b/tests/language.spec.ts-snapshots/has-German-title-1-Mobile-Chrome-linux.png differ
diff --git a/tests/project.spec.ts-snapshots/Project-pages-has-featured-projects-1-Mobile-Chrome-linux.png b/tests/project.spec.ts-snapshots/Project-pages-has-featured-projects-1-Mobile-Chrome-linux.png
new file mode 100644
index 0000000..f97a5d3
Binary files /dev/null and b/tests/project.spec.ts-snapshots/Project-pages-has-featured-projects-1-Mobile-Chrome-linux.png differ