internxt · jaaaaavier · Mar 10, 2026 · Mar 10, 2026 · Mar 10, 2026
diff --git a/src/components/shared/Breadcrumb.tsx b/src/components/shared/Breadcrumb.tsx
@@ -0,0 +1,34 @@
+import Link from 'next/link';
+
+export interface BreadcrumbItem {
+  name: string;
+  url: string;
+}
+
+interface BreadcrumbProps {
+  items: BreadcrumbItem[];
+  className?: string;
+}
+
+export const Breadcrumb = ({ items, className = '' }: BreadcrumbProps) => {
+  return (
+    <nav className={`sr-only ${className}`} aria-label="Breadcrumb">
+      <ol className="flex items-center flex-wrap gap-2">
+        {items.map((item, index) => (
+          <li key={item.url}>
+            {index > 0 && <span>/</span>}
+            {index === items.length - 1 ? (
+              <span>
+                {item.name}
+              </span>
+            ) : (
+              <Link href={item.url}>
+                {item.name}
+              </Link>
+            )}
+          </li>
+        ))}
+      </ol>
+    </nav>
+  );
+};
diff --git a/src/components/templates/comparisonPageTemplate.tsx b/src/components/templates/comparisonPageTemplate.tsx
@@ -1,5 +1,8 @@
 import Layout from '@/components/layout/Layout';
 import Navbar from '@/components/layout/navbars/Navbar';
+import { Breadcrumb } from '@/components/shared/Breadcrumb';
+import { sm_breadcrumb } from '@/components/utils/schema-markup-generator';
+import Script from 'next/script';
 import { PricingSectionWrapper } from '@/components/shared/pricing/PricingSectionWrapper';
 import { CloudObjectStoragePriceCardSection } from '@/components/cloud-object-storage/PriceCardSection';
 import { PromoCodeName } from '@/lib/types';
@@ -70,6 +73,8 @@ interface ComparisonPageProps {
   };
   couponCodeName?: PromoCodeName;
   isS3Alternative?: boolean;
+  breadcrumbName?: string;
+  urlSlug?: string;
 }
 
 export const ComparisonPage = ({
@@ -85,6 +90,8 @@ export const ComparisonPage = ({
   customSections = {},
   couponCodeName,
   isS3Alternative = false,
+  breadcrumbName,
+  urlSlug,
 }: ComparisonPageProps): JSX.Element => {
   const metatags = metatagsDescriptions.filter((desc) => desc.id === metaTagId);
   const {
@@ -138,8 +145,25 @@ export const ComparisonPage = ({
   } = customSections;
 
   return (
-    <Layout title={metatags[0].title} description={metatags[0].description} segmentName={segmentName} lang={lang}>
-      <Navbar textContent={navbarLang} lang={locale} cta={['priceTable']} fixed />
+    <>
+      {breadcrumbName && urlSlug && (
+        <Script type="application/ld+json" strategy="beforeInteractive">
+          {sm_breadcrumb(breadcrumbName, urlSlug)}
+        </Script>
+      )}
+      <Layout title={metatags[0].title} description={metatags[0].description} segmentName={segmentName} lang={lang}>
+        <Navbar textContent={navbarLang} lang={locale} cta={['priceTable']} fixed />
+
+        {breadcrumbName && urlSlug && (
+          <div className="sr-only">
+            <Breadcrumb
+              items={[
+                { name: 'Encrypted Cloud Storage', url: '/' },
+                { name: breadcrumbName, url: `/${urlSlug}` },
+              ]}
+            />
+          </div>
+        )}
 
       <HeroSection textContent={langJson.HeroSection} percentage={percentageDiscount} competitor={competitor} />
 
@@ -205,5 +229,6 @@ export const ComparisonPage = ({
 
       <Footer textContent={footerLang} lang={locale} />
     </Layout>
+    </>
   );
 };
diff --git a/src/components/utils/schema-markup-generator.ts b/src/components/utils/schema-markup-generator.ts
@@ -36,15 +36,15 @@ export const sm_faq = (faq) => {
 // Single Breadcrumb Data Structure generator
 // Additional information: https://developers.google.com/search/docs/appearance/structured-data/breadcrumb
 
-export const sm_breadcrumb = (name, url) => {
+export const sm_breadcrumb = (name: string, url: string) => {
   return `{
       "@context": "https://schema.org",
       "@type": "BreadcrumbList",
       "itemListElement": [
         {
           "@type": "ListItem",
           "position": 1,
-          "name": "Home",
+          "name": "Encrypted Cloud Storage",
           "item": "https://internxt.com/"
         },{
           "@type": "ListItem",
@@ -53,4 +53,22 @@ export const sm_breadcrumb = (name, url) => {
           "item": "https://internxt.com/${url}"
         }
       ]}`;
+};
+
+export const sm_breadcrumb_list = (items: { name: string; url: string }[]) => {
+  return `{
+      "@context": "https://schema.org",
+      "@type": "BreadcrumbList",
+      "itemListElement": [${items
+        .map(
+          (item, index) => `
+        {
+          "@type": "ListItem",
+          "position": ${index + 1},
+          "name": "${item.name}",
+          "item": "https://internxt.com${item.url}"
+        }`
+        )
+        .join(',')}
+      ]}`;
 };
diff --git a/src/pages/ai-detector.tsx b/src/pages/ai-detector.tsx
@@ -26,6 +26,8 @@ import { getImage } from '@/lib/getImage';
 import { ShieldStar } from '@phosphor-icons/react';
 import FeaturesSliderImg from '@/components/ai-detector/FeatureSliderImg';
 import FeaturesSlider from '@/components/shared/FeaturesSlider';
+import { Breadcrumb } from '@/components/shared/Breadcrumb';
+
 
 const AIDetector = ({
   metatagsDescriptions,
@@ -104,6 +106,14 @@ const AIDetector = ({
 
       <Layout segmentName="Virus Scanner" title={metatags[0].title} description={metatags[0].description} lang={lang}>
         <Navbar textContent={navbarLang} lang={lang} cta={['default']} fixed />
+      <div className="sr-only">
+        <Breadcrumb
+          items={[
+            { name: 'Encrypted Cloud Storage', url: '/' },
+            { name: 'Ai detector free', url: '/ai-detector' },
+          ]}
+        />
+      </div>
 
         <HeroSection textContent={langJson.HeroSection} lang={lang} />
 

diff --git a/src/pages/alternative-to-chatGPT.tsx b/src/pages/alternative-to-chatGPT.tsx
@@ -5,6 +5,8 @@ import { GetServerSidePropsContext } from 'next';
 
 const chatgptComparison = (props) => (
   <ComparisonPage
+    breadcrumbName="Alternative to chatgpt"
+    urlSlug="alternative-to-chatGPT"
     {...props}
     competitor="ChatGPT"
     metaTagId="alternative-to-chatgpt"

diff --git a/src/pages/alternative-to-copilot.tsx b/src/pages/alternative-to-copilot.tsx
@@ -5,6 +5,8 @@ import { GetServerSidePropsContext } from 'next';
 
 const copilotComparison = (props) => (
   <ComparisonPage
+    breadcrumbName="Copilot alternative"
+    urlSlug="alternative-to-copilot"
     {...props}
     competitor="Copilot"
     metaTagId="alternative-to-copilot"

diff --git a/src/pages/alternative-to-deepseek.tsx b/src/pages/alternative-to-deepseek.tsx
@@ -5,6 +5,8 @@ import { GetServerSidePropsContext } from 'next';
 
 const DeepSeekComparison = (props) => (
   <ComparisonPage
+    breadcrumbName="Deepseek alternative"
+    urlSlug="alternative-to-deepseek"
     {...props}
     competitor="deepseek"
     metaTagId="alternative-to-deepseek"

diff --git a/src/pages/alternative-to-gemini.tsx b/src/pages/alternative-to-gemini.tsx
@@ -5,6 +5,8 @@ import { GetServerSidePropsContext } from 'next';
 
 const GeminiComparison = (props) => (
   <ComparisonPage
+    breadcrumbName="Gemini alternative"
+    urlSlug="alternative-to-gemini"
     {...props}
     competitor="gemini"
     metaTagId="alternative-to-gemini"

diff --git a/src/pages/alternative-to-google-meet.tsx b/src/pages/alternative-to-google-meet.tsx
@@ -5,6 +5,8 @@ import { GetServerSidePropsContext } from 'next';
 
 const GoogleMeetComparison = (props) => (
   <ComparisonPage
+    breadcrumbName="Google meet alternative"
+    urlSlug="alternative-to-google-meet"
     {...props}
     competitor="GoogleMeet"
     metaTagId="google-meet-alternative"

diff --git a/src/pages/alternative-to-grok.tsx b/src/pages/alternative-to-grok.tsx
@@ -5,6 +5,8 @@ import { GetServerSidePropsContext } from 'next';
 
 const grokComparison = (props) => (
   <ComparisonPage
+    breadcrumbName="Grok alternative"
+    urlSlug="alternative-to-grok"
     {...props}
     competitor="grok"
     metaTagId="alternative-to-grok"

diff --git a/src/pages/alternative-to-whereby.tsx b/src/pages/alternative-to-whereby.tsx
@@ -5,6 +5,8 @@ import { GetServerSidePropsContext } from 'next';
 
 const WherebyComparison = (props: any) => (
   <ComparisonPage
+    breadcrumbName="Whereby alternative"
+    urlSlug="alternative-to-whereby"
     {...props}
     competitor="Whereby"
     metaTagId="whereby-alternative"

diff --git a/src/pages/alternative-to-wire.tsx b/src/pages/alternative-to-wire.tsx
@@ -5,6 +5,8 @@ import { GetServerSidePropsContext } from 'next';
 
 const WireComparison = (props: any) => (
   <ComparisonPage
+    breadcrumbName="Alternative to wire"
+    urlSlug="alternative-to-wire"
     {...props}
     competitor="Wire"
     metaTagId="wire-alternative"

diff --git a/src/pages/alternative-to-zoom.tsx b/src/pages/alternative-to-zoom.tsx
@@ -5,6 +5,8 @@ import { GetServerSidePropsContext } from 'next';
 
 const zoomComparison = (props) => (
   <ComparisonPage
+    breadcrumbName="Zoom alternative"
+    urlSlug="alternative-to-zoom"
     {...props}
     competitor="zoom"
     metaTagId="zoom-alternative"

diff --git a/src/pages/antivirus.tsx b/src/pages/antivirus.tsx
@@ -17,6 +17,8 @@ import FeatureSection from '@/components/antivirus/FeatureSection';
 import HeroSection from '@/components/antivirus/HeroSection';
 import { InfoSection } from '@/components/antivirus/InfoSecction';
 import { downloadDriveLinks } from '@/lib/get-download-url';
+import { Breadcrumb } from '@/components/shared/Breadcrumb';
+
 
 interface AntivirusProps {
   lang: GetServerSidePropsContext['locale'];
@@ -103,6 +105,13 @@ const AntivirusPage = ({
       ) : (
         <Navbar textContent={navbarLang} lang={locale} cta={['default']} fixed />
       )}
+      <div className="sr-only">
+        <Breadcrumb items={[
+{ name: 'Encrypted Cloud Storage', url: '/' },
+{ name: 'Secure cloud storage', url: '/drive' },
+{ name: 'Internxt Antivirus', url: '/antivirus' }
+]} />
+      </div>
 
       <HeroSection textContent={langJson.HeroSection} download={download} />
 

diff --git a/src/pages/business.tsx b/src/pages/business.tsx
@@ -19,6 +19,9 @@ import HorizontalScrollableSection from '@/components/shared/HorizontalScrollabl
 import BusinessCtaSection from '@/components/business/BusinessCtaSection';
 import Image from 'next/image';
 import HorizontalScrollableSectionWithImages from '@/components/business/HorizontalScrollableSectionWithImages';
+import { Breadcrumb } from '@/components/shared/Breadcrumb';
+
+
 
 interface BusinessProps {
   metatagsDescriptions: MetatagsDescription[];
@@ -76,6 +79,13 @@ export const BusinessPage = ({
   return (
     <Layout title={metatags.title} description={metatags.description}>
       <Navbar cta={['default']} lang={locale} textContent={navbarText} fixed />
+      <div className="sr-only">
+        <Breadcrumb items={[
+{ name: 'Encrypted Cloud Storage', url: '/' },
+{ name: 'Secure cloud storage', url: '/drive' },
+{ name: 'Internxt for business', url: '/business' }
+]} />
+      </div>
 
       <HeroSection
         TextComponent={

diff --git a/src/pages/byte-converter.tsx b/src/pages/byte-converter.tsx
@@ -13,6 +13,8 @@ import TryInternxtBanner from '@/components/banners/TryInternxtBanner';
 
 import { sm_faq, sm_breadcrumb } from '@/components/utils/schema-markup-generator';
 import { ToolsSection } from '@/components/shared/sections/ToolsSection';
+import { Breadcrumb } from '@/components/shared/Breadcrumb';
+
 
 const CONVERTER_TOOL_METATAG_ID = 'converter-tool';
 
@@ -31,6 +33,14 @@ const ConverterTool = ({ lang, metatagsDescriptions, navbarLang, langJson, tools
 
       <Layout title={metatags[0].title} description={metatags[0].description} segmentName="Converter Tool">
         <Navbar lang={'en'} textContent={navbarLang} cta={['default']} fixed />
+      <div className="sr-only">
+        <Breadcrumb
+          items={[
+            { name: 'Encrypted Cloud Storage', url: '/' },
+            { name: 'Byte converter', url: '/byte-converter' },
+          ]}
+        />
+      </div>
 
         <HeroSection textContent={langJson.HeroSection} />
 

diff --git a/src/pages/cleaner.tsx b/src/pages/cleaner.tsx
@@ -12,6 +12,9 @@ import WhenToUseSection from '@/components/cleaner/WhenToUseSection';
 import FloatingCtaSectionv2 from '@/components/shared/FloatingCtaSectionV2';
 import HorizontalScrollableSection from '@/components/shared/HorizontalScrollableSection';
 import FeatureSection from '@/components/cleaner/FeatureSection';
+import { Breadcrumb } from '@/components/shared/Breadcrumb';
+
+
 
 interface CleanerProps {
   lang: GetServerSidePropsContext['locale'];
@@ -35,6 +38,13 @@ const CleanerPage = ({
   return (
     <Layout title={metatags[0].title} description={metatags[0].description} segmentName="Home" lang={lang}>
       <Navbar textContent={navbarLang} lang={locale} cta={[navbarCta]} fixed />
+      <div className="sr-only">
+        <Breadcrumb items={[
+{ name: 'Encrypted Cloud Storage', url: '/' },
+{ name: 'Secure cloud storage', url: '/drive' },
+{ name: 'Internxt Cleaner', url: '/cleaner' }
+]} />
+      </div>
 
       <HeroSection textContent={textContent.HeroSection} />
 

diff --git a/src/pages/cloud-object-storage/free-cloud-object-storage.tsx b/src/pages/cloud-object-storage/free-cloud-object-storage.tsx
@@ -11,6 +11,9 @@ import FloatingCtaSectionv2 from '@/components/shared/FloatingCtaSectionV2';
 import HorizontalScrollableSection from '@/components/shared/HorizontalScrollableSection';
 import FAQSection from '@/components/shared/sections/FaqSection';
 import { GetServerSidePropsContext } from 'next';
+import { Breadcrumb } from '@/components/shared/Breadcrumb';
+
+
 
 interface FreeCloudObjectStorageProps {
   metatagsDescription: MetatagsDescription[];
@@ -34,6 +37,13 @@ const FreeCloudObjectStorage = ({
   return (
     <Layout title={metatags.title} description={metatags.description}>
       <Navbar cta={['default']} lang={lang} textContent={navbarText} fixed />
+      <div className="sr-only">
+        <Breadcrumb items={[
+{ name: 'Encrypted Cloud Storage', url: '/' },
+{ name: 'Cloud object storage', url: '/cloud-object-storage' },
+{ name: 'Free cloud object storage', url: '/cloud-object-storage/free-cloud-object-storage' }
+]} />
+      </div>
 
       <HeroSection textContent={textContent.HeroSection} />
 

diff --git a/src/pages/cloud-object-storage/index.tsx b/src/pages/cloud-object-storage/index.tsx
@@ -12,6 +12,9 @@ import FloatingCtaSectionv2 from '@/components/shared/FloatingCtaSectionV2';
 import HorizontalScrollableSection from '@/components/shared/HorizontalScrollableSection';
 import FAQSection from '@/components/shared/sections/FaqSection';
 import { GetServerSidePropsContext } from 'next';
+import { Breadcrumb } from '@/components/shared/Breadcrumb';
+
+
 
 interface CloudObjectStorageProps {
   metatagsDescription: MetatagsDescription[];
@@ -35,6 +38,12 @@ const CloudObjectStorage = ({
   return (
     <Layout title={metatags.title} description={metatags.description}>
       <Navbar cta={['default']} lang={lang} textContent={navbarText} fixed />
+      <div className="sr-only">
+        <Breadcrumb items={[
+{ name: 'Encrypted Cloud Storage', url: '/' },
+{ name: 'Cloud object storage', url: '/cloud-object-storage' }
+]} />
+      </div>
 
       <HeroSection textContent={textContent.HeroSection} />