diff --git a/src/components/ThemeIcon.astro b/src/components/ThemeIcon.astro
index a821daa..d2e2196 100644
--- a/src/components/ThemeIcon.astro
+++ b/src/components/ThemeIcon.astro
@@ -2,7 +2,7 @@
 <button
   type="button"
   aria-label="Dark Theme Toggle"
-  class="hs-dark-mode group flex items-center font-medium text-neutral-600 outline-none ring-zinc-500 transition duration-300 hover:text-[#fa5a15] hs-dark-mode-active:hidden dark:text-neutral-400 dark:ring-zinc-200 dark:hover:text-[#fb713b] dark:focus:outline-none"
+  class="hs-dark-mode group flex h-8 w-8 items-center justify-center rounded-full font-medium text-neutral-600 outline-none ring-zinc-500 transition duration-300 hover:bg-neutral-200 hover:text-[#fa5a15] hs-dark-mode-active:hidden dark:text-neutral-400 dark:ring-zinc-200 dark:hover:text-[#fb713b] dark:focus:outline-none"
   data-hs-theme-click-value="dark"
 >
   <!-- The SVG displayed shows an abstract icon that represents the moon (dark theme) -->
@@ -24,7 +24,7 @@
 <button
   type="button"
   aria-label="Light Theme Toggle"
-  class="hs-dark-mode group hidden items-center font-medium text-neutral-600 outline-none ring-zinc-500 transition duration-300 hover:text-[#fa5a15] hs-dark-mode-active:block dark:text-neutral-400 dark:ring-zinc-200 dark:hover:text-[#fb713b] dark:focus:outline-none"
+  class="hs-dark-mode group hidden h-8 w-8 items-center justify-center rounded-full font-medium text-neutral-600 outline-none ring-zinc-500 transition duration-300 hover:text-[#fa5a15] hs-dark-mode-active:flex dark:text-neutral-400 dark:ring-zinc-200 dark:hover:bg-neutral-700 dark:hover:text-[#fb713b] dark:focus:outline-none"
   data-hs-theme-click-value="light"
 >
   <!-- The SVG displayed shows a standard sun icon that stands for the light theme -->
diff --git a/src/components/sections/features/FeaturesGeneral.astro b/src/components/sections/features/FeaturesGeneral.astro
index 599e647..8551372 100644
--- a/src/components/sections/features/FeaturesGeneral.astro
+++ b/src/components/sections/features/FeaturesGeneral.astro
@@ -36,11 +36,13 @@ const subTitle: string =
         {title}
       </h2>
       <!-- Rendering subtitle -->
+      {subTitle &&
       <p
         class="mt-2 text-pretty text-neutral-600 dark:text-neutral-400 md:mt-4"
       >
         {subTitle}
       </p>
+      }
     </div>
 
     <!-- Block to display the IconBlock components -->
diff --git a/src/components/sections/features/FeaturesStats.astro b/src/components/sections/features/FeaturesStats.astro
index f157270..184b6e1 100644
--- a/src/components/sections/features/FeaturesStats.astro
+++ b/src/components/sections/features/FeaturesStats.astro
@@ -2,10 +2,9 @@
 // Import the necessary components
 import StatsBig from "../../ui/blocks/StatsBig.astro";
 import StatsSmall from "../../ui/blocks/StatsSmall.astro";
-// Get values from Astro's builtin props
+
 const { title, subTitle, stats, mainStatTitle, mainStatSubTitle } = Astro.props;
 
-// TypeScript interface for the properties
 interface Props {
   title: string;
   subTitle?: string;
diff --git a/src/components/ui/avatars/Avatar.astro b/src/components/ui/avatars/Avatar.astro
index fb23364..109939d 100644
--- a/src/components/ui/avatars/Avatar.astro
+++ b/src/components/ui/avatars/Avatar.astro
@@ -1,9 +1,8 @@
 ---
 import { Image } from "astro:assets";
-// Destructure the properties from Astro.props
+
 const { src, alt } = Astro.props;
 
-// Define TypeScript interface for the properties
 interface Props {
   src: string;
   alt: string;
diff --git a/src/components/ui/avatars/AvatarBlog.astro b/src/components/ui/avatars/AvatarBlog.astro
index dfa1440..d104064 100644
--- a/src/components/ui/avatars/AvatarBlog.astro
+++ b/src/components/ui/avatars/AvatarBlog.astro
@@ -1,12 +1,11 @@
 ---
 // Import necessary components
 import { Image } from "astro:assets";
-// Import necessary types
+
 import type { CollectionEntry } from "astro:content";
 
-// Extract blogEntry property from Astro.props
 const { blogEntry } = Astro.props;
-// Define Props interface
+
 interface Props {
   blogEntry: CollectionEntry<"blog">;
 }
diff --git a/src/components/ui/avatars/AvatarBlogLarge.astro b/src/components/ui/avatars/AvatarBlogLarge.astro
index 5c7706c..7b94664 100644
--- a/src/components/ui/avatars/AvatarBlogLarge.astro
+++ b/src/components/ui/avatars/AvatarBlogLarge.astro
@@ -1,11 +1,11 @@
 ---
 // Import necessary components
 import { Image } from "astro:assets";
-// Import necessary types
+
 import type { CollectionEntry } from "astro:content";
-// Extract blogEntry property from Astro.props
+
 const { blogEntry } = Astro.props;
-// Define Props interface
+
 interface Props {
   blogEntry: CollectionEntry<"blog">;
 }
diff --git a/src/components/ui/cards/CardBlog.astro b/src/components/ui/cards/CardBlog.astro
index 856655b..80d45fc 100644
--- a/src/components/ui/cards/CardBlog.astro
+++ b/src/components/ui/cards/CardBlog.astro
@@ -5,10 +5,8 @@ import { Image } from "astro:assets";
 import { formatDate } from "../../../utils/utils";
 import type { CollectionEntry } from "astro:content";
 
-// Define data sources from Astro props
 const { blogEntry } = Astro.props;
 
-// Define TypeScript props interface
 interface Props {
   blogEntry: CollectionEntry<"blog">;
 }
@@ -16,7 +14,7 @@ interface Props {
 
 <!-- The following anchor tag is the main container for the card.
      It's a link to the blog post detailed page.
-     The data-astro-prefetch is a Astro.js specific Dynamic HTML feature,
+     The data-astro-prefetch is an Astro specific Dynamic HTML feature,
      which automatically prefetches the linked page to speed up navigation. -->
 <a
   class="group relative block rounded-xl outline-none ring-zinc-500 transition duration-500 focus-visible:ring dark:ring-zinc-200 dark:focus:outline-none"
@@ -32,6 +30,7 @@ interface Props {
       src={blogEntry.data.cardImage}
       alt={blogEntry.data.cardImageAlt}
       draggable={"false"}
+      loading={"eager"}
       format={"avif"}
     />
   </div>
diff --git a/src/components/ui/cards/CardBlogRecent.astro b/src/components/ui/cards/CardBlogRecent.astro
index b589fb0..1f16d28 100644
--- a/src/components/ui/cards/CardBlogRecent.astro
+++ b/src/components/ui/cards/CardBlogRecent.astro
@@ -4,9 +4,9 @@ import { Image } from "astro:assets";
 import type { CollectionEntry } from "astro:content";
 import AvatarBlogLarge from "../avatars/AvatarBlogLarge.astro";
 import PrimaryCTA from "../buttons/PrimaryCTA.astro";
-// Define data source from Astro.js incoming props
+
 const { blogEntry } = Astro.props;
-// Define TypeScript props interface
+
 interface Props {
   blogEntry: CollectionEntry<"blog">;
 }
@@ -22,6 +22,7 @@ interface Props {
         src={blogEntry.data.cardImage}
         alt={blogEntry.data.cardImageAlt}
         draggable={"false"}
+        loading={"eager"}
         format={"avif"}
       />
     </div>
diff --git a/src/components/ui/cards/CardInsight.astro b/src/components/ui/cards/CardInsight.astro
index 5a37f21..dc99c84 100644
--- a/src/components/ui/cards/CardInsight.astro
+++ b/src/components/ui/cards/CardInsight.astro
@@ -2,9 +2,9 @@
 // Import necessary modules and utilities
 import { Image } from "astro:assets";
 import type { CollectionEntry } from "astro:content";
-// Define data source from Astro.js incoming props
+
 const { insightEntry } = Astro.props;
-// Define TypeScript props interface
+
 interface Props {
   insightEntry: CollectionEntry<"insights">;
 }
diff --git a/src/components/ui/cards/CardRelated.astro b/src/components/ui/cards/CardRelated.astro
index 190909e..217ac0b 100644
--- a/src/components/ui/cards/CardRelated.astro
+++ b/src/components/ui/cards/CardRelated.astro
@@ -3,22 +3,19 @@
 import { Image } from "astro:assets";
 import { formatDate } from "../../../utils/utils";
 import type { CollectionEntry } from "astro:content";
-// Define data source from Astro.js incoming props
+
 const { blogEntry } = Astro.props;
-// Define TypeScript props interface
+
 interface Props {
   blogEntry: CollectionEntry<"blog">;
 }
 ---
 
-<!-- The anchor tag is the main container for the blog preview card. Currently, it links to "#".
-     You might want to change it to the corresponding blog post's URL. -->
 <a
   class="group block rounded-xl outline-none ring-zinc-500 transition duration-300 focus-visible:ring dark:ring-zinc-200 dark:focus:outline-none"
   href={`/blog/${blogEntry.slug}/`}
   data-astro-prefetch
 >
-  <!-- The blog post's cover image. It uses astro:assets' Image for loading the image optimally -->
   <div>
     <Image
       class="aspect-video rounded-xl"
diff --git a/src/components/ui/cards/CardSmall.astro b/src/components/ui/cards/CardSmall.astro
index 8b710ff..2670701 100644
--- a/src/components/ui/cards/CardSmall.astro
+++ b/src/components/ui/cards/CardSmall.astro
@@ -2,9 +2,9 @@
 // Import necessary modules and utilities
 import { Image } from "astro:assets";
 import type { CollectionEntry } from "astro:content";
-// Define data source from Astro.js incoming props
+
 const { product } = Astro.props;
-// Define TypeScript props interface
+
 interface Props {
   product: CollectionEntry<"products">;
 }
diff --git a/src/components/ui/cards/CardWide.astro b/src/components/ui/cards/CardWide.astro
index beca57c..cb22d66 100644
--- a/src/components/ui/cards/CardWide.astro
+++ b/src/components/ui/cards/CardWide.astro
@@ -2,9 +2,9 @@
 // Import necessary modules and utilities
 import { Image } from "astro:assets";
 import type { CollectionEntry } from "astro:content";
-// Define data source from Astro.js incoming props
+
 const { product } = Astro.props;
-// Define TypeScript props interface
+
 interface Props {
   product: CollectionEntry<"products">;
 }
diff --git a/src/components/ui/forms/input/Checkbox.astro b/src/components/ui/forms/input/Checkbox.astro
index 2aff8a9..bdf0644 100644
--- a/src/components/ui/forms/input/Checkbox.astro
+++ b/src/components/ui/forms/input/Checkbox.astro
@@ -1,7 +1,6 @@
 ---
-// Extract label and id from Astro.props with default value for label
 const { label = "Remember me", id } = Astro.props;
-// Define TypeScript interface for the properties
+
 interface Props {
   label?: string;
   id?: string;
diff --git a/src/components/ui/forms/input/EmailContactInput.astro b/src/components/ui/forms/input/EmailContactInput.astro
index 9ec151c..d6e98a2 100644
--- a/src/components/ui/forms/input/EmailContactInput.astro
+++ b/src/components/ui/forms/input/EmailContactInput.astro
@@ -1,7 +1,6 @@
 ---
-// Destructure the properties from Astro.props, setting default value for label
 const { label = "Email", id } = Astro.props;
-// Define TypeScript interface for the properties
+
 interface Props {
   label?: string;
   id: string;
diff --git a/src/components/ui/forms/input/EmailInput.astro b/src/components/ui/forms/input/EmailInput.astro
index 650dd07..8b56e4d 100644
--- a/src/components/ui/forms/input/EmailInput.astro
+++ b/src/components/ui/forms/input/EmailInput.astro
@@ -1,8 +1,6 @@
 ---
-// Destructure the properties from Astro.props, setting default value for label
 const { label = "Email address", id, errorId } = Astro.props;
 
-// Define TypeScript interface for the properties
 interface Props {
   label?: string;
   id: string;
diff --git a/src/components/ui/forms/input/TextAreaInput.astro b/src/components/ui/forms/input/TextAreaInput.astro
index c6944db..83374c9 100644
--- a/src/components/ui/forms/input/TextAreaInput.astro
+++ b/src/components/ui/forms/input/TextAreaInput.astro
@@ -9,7 +9,7 @@ interface Props {
 ---
 
 <div>
-  <label for="hs-about-contacts-1" class="sr-only">{label}</label>
+  <label for={id} class="sr-only">{label}</label>
   <textarea
     id={id}
     name={name}
diff --git a/src/content/blog/post-1.md b/src/content/blog/post-1.md
index 4f709e4..0b8fd19 100644
--- a/src/content/blog/post-1.md
+++ b/src/content/blog/post-1.md
@@ -3,7 +3,7 @@ title: "Maximizing Efficiency with ScrewFast's Cutting-Edge Tools"
 description: "Innovating Construction Efficiency with Precision Tools & Support"
 author: "Jacob"
 authorImage: "../../images/blog/jacob.avif"
-authorImageAlt: "Image Description"
+authorImageAlt: "Avatar Description"
 pubDate: 2024-02-06
 cardImage: "../../images/blog/post-1.avif"
 cardImageAlt: "Top view mechanical tools arrangement"
diff --git a/src/content/blog/post-2.md b/src/content/blog/post-2.md
index 8e52d51..7cd7e5b 100644
--- a/src/content/blog/post-2.md
+++ b/src/content/blog/post-2.md
@@ -3,7 +3,7 @@ title: "Enhancing Safety and Workmanship with ScrewFast Construction Services"
 description: "Quality construction services for lasting results"
 author: "Brad"
 authorImage: "../../images/blog/brad.avif"
-authorImageAlt: "Image Description"
+authorImageAlt: "Avatar Description"
 pubDate: 2024-02-10
 cardImage: "../../images/blog/post-2.avif"
 cardImageAlt: "Man in black sweatpants using DEWALT circular saw and cutting a wood plank"
diff --git a/src/content/blog/post-3.md b/src/content/blog/post-3.md
index 2528634..0d4348d 100644
--- a/src/content/blog/post-3.md
+++ b/src/content/blog/post-3.md
@@ -4,7 +4,7 @@ description: "Affordable, durable tools for efficient construction projects"
 author: "Olga Zabegina"
 role: "Strategic Marketing Manager"
 authorImage: "../../images/blog/anna.avif"
-authorImageAlt: "Image Description"
+authorImageAlt: "Avatar Description"
 pubDate: 2024-02-18
 cardImage: "../../images/blog/post-3.avif"
 cardImageAlt: "Side view worker wearing gloves"