<!DOCTYPE html>
<html lang="nl">
  <head>
    <script>
      if (window.location.protocol === 'file:') {
        window.location.replace('https://seobyray.com/');
      }

      // Eerste laadpoging - zet een timeout voor het geval de app niet laadt
      setTimeout(() => {
        if (!window.appLoaded) {
          console.log('App niet geladen na timeout');
          // Toon een gebruiksvriendelijk bericht
          const root = document.getElementById('root');
          if (root) {
            root.innerHTML = `
              <div style="text-align: center; padding: 2rem; font-family: Arial, sans-serif;">
                <h1>Er is iets misgegaan</h1>
                <p>Open deze Vite/React website via https://seobyray.com of via de lokale devserver, niet als los HTML-bestand.</p>
                <button onclick="window.location.reload()" style="padding: 0.5rem 1rem; background: #2563eb; color: white; border: none; border-radius: 4px; cursor: pointer;">
                  Pagina verversen
                </button>
              </div>
            `;
          }
        }
      }, 10000); // 10 seconden timeout

      // Markeer wanneer de app is geladen
      window.appLoaded = false;
      window.addEventListener('app-loaded', () => {
        window.appLoaded = true;
        console.log('App succesvol geladen');
      });
    </script>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="icon" type="image/x-icon" href="/favicon.ico" />
    
    <!-- Cache control meta tags -->
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
    <meta http-equiv="Expires" content="0" />
    <meta http-equiv="Pragma" content="no-cache" />
    
    <!-- Primary Meta Tags -->
    <title>SEO, GEO & AIO Specialist Amsterdam | SEObyRay</title>
    <meta name="description" content="SEO, GEO en AIO specialist voor technische SEO, structured data, entity SEO en betere zichtbaarheid in Google, AI Overviews, ChatGPT, Gemini en Perplexity." />
    <meta name="keywords" content="seo specialist amsterdam, geo specialist, aio specialist, ai search optimization, technische seo, structured data, entity seo, contentstrategie" />
    <meta name="author" content="Ray Gritter" />
    <meta name="robots" content="index, follow, max-image-preview:large" />
    <meta name="language" content="nl-NL" />
    <meta name="revisit-after" content="7 days" />
    
    <style>
      /* Fallback styling voor als JavaScript niet laadt */
      #app-loading {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        height: 100vh;
        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
      }
      #app-loading h1 {
        color: #2563eb;
        margin-bottom: 1rem;
      }
      #app-loading p {
        max-width: 600px;
        text-align: center;
        margin-bottom: 1rem;
      }
      #app-fallback-link {
        display: inline-block;
        margin-top: 1rem;
        padding: 0.75rem 1.5rem;
        background-color: #2563eb;
        color: white;
        text-decoration: none;
        border-radius: 0.375rem;
        font-weight: bold;
      }
      #app-fallback-link:hover {
        background-color: #1d4ed8;
      }
      /* Hide fallback als de app laadt */
      #root:not(:empty) ~ #app-loading {
        display: none;
      }
    </style>
    
    <!-- Detecteer JavaScript problemen -->
    <script>
      window.addEventListener('error', function(e) {
        console.error('Global error caught:', e);
        document.getElementById('app-error-message').textContent = 
          'Er is een probleem opgetreden bij het laden van de applicatie. ' + 
          'Probeer de pagina te vernieuwen of gebruik de eenvoudige versie hieronder.';
      });
      
      // Timeout om te controleren of de app geladen is
      setTimeout(function() {
        if (document.getElementById('root').children.length === 0) {
          console.warn('App niet geladen na timeout');
          document.getElementById('app-loading').style.display = 'flex';
        }
      }, 5000);
    </script>
    <meta name="theme-color" content="#0066CC" />
    
    <!-- Open Graph / Facebook -->
    <meta property="og:type" content="website" />
    <meta property="og:url" content="https://seobyray.com" />
    <meta property="og:title" content="SEO, GEO & AIO Specialist Amsterdam | SEObyRay" />
    <meta property="og:description" content="Technische SEO, structured data, entity SEO en AI-search optimalisatie voor betere vindbaarheid in Google en answer engines." />
    <meta property="og:image" content="/og-image.png" />
    <meta property="og:image:width" content="1200" />
    <meta property="og:image:height" content="630" />
    <meta property="og:locale" content="nl_NL" />
    <meta property="og:site_name" content="SEObyRay" />

    <!-- Twitter -->
    <meta name="twitter:card" content="summary_large_image" />
    <meta name="twitter:url" content="https://seobyray.com" />
    <meta name="twitter:title" content="SEO, GEO & AIO Specialist Amsterdam | SEObyRay" />
    <meta name="twitter:description" content="Technische SEO, structured data, entity SEO en AI-search optimalisatie voor Google, AI Overviews en answer engines." />
    <meta name="twitter:image" content="/og-image.png" />
    <meta name="twitter:creator" content="@seobyray" />
    <meta name="twitter:site" content="@seobyray" />

    <link rel="canonical" href="https://seobyray.com" />
    <link rel="alternate" href="https://seobyray.com" hreflang="nl-NL" />
    <link rel="alternate" href="https://seobyray.com/en" hreflang="en" />
    <!-- Favicon and App Icons -->
    <link rel="icon" type="image/x-icon" href="/favicon.ico" />
    <link rel="icon" type="image/svg+xml" href="/logo-simple.svg" />
    <link rel="apple-touch-icon" href="/logo-simple.svg" />
    <link rel="manifest" href="/site.webmanifest" />
    <meta name="theme-color" content="#2563EB" />
    
    <!-- Primary Schema.org graph. React also refreshes this from src/meta/schema.json. -->
    <script type="application/ld+json">
      {
        "@context": "https://schema.org",
        "@graph": [
          {
            "@type": "ProfessionalService",
            "@id": "https://seobyray.com/#business",
            "name": "SEObyRay",
            "description": "SEO, GEO en AIO consultancy voor betere vindbaarheid in Google, AI Overviews, ChatGPT, Gemini, Perplexity en answer engines.",
            "url": "https://seobyray.com/",
            "image": "https://seobyray.com/og-image.png",
            "logo": "https://seobyray.com/assets/seobyray-logo.png",
            "email": "info@seobyray.com",
            "founder": { "@id": "https://seobyray.com/#ray-gritter" },
            "areaServed": [{ "@type": "Country", "name": "Nederland" }, { "@type": "City", "name": "Amsterdam" }],
            "knowsAbout": ["SEO", "GEO", "AIO", "AI Overviews", "AI Mode", "Answer Engine Optimization", "AI Search Optimization", "Google Search Console", "Technical SEO", "Entity SEO", "Schema.org structured data", "Topical authority", "E-E-A-T", "Core Web Vitals"],
            "sameAs": ["https://www.linkedin.com/company/seobyray/", "https://twitter.com/seobyray"]
          },
          {
            "@type": "Person",
            "@id": "https://seobyray.com/#ray-gritter",
            "name": "Ray Gritter",
            "jobTitle": "SEO, GEO en AIO Specialist",
            "worksFor": { "@id": "https://seobyray.com/#business" },
            "image": "https://seobyray.com/assets/ray-gritter-profile.jpg",
            "knowsAbout": ["SEO", "GEO", "AIO", "AI Overviews", "ChatGPT", "Gemini", "Perplexity", "Structured data", "Entity SEO"]
          },
          {
            "@type": "WebSite",
            "@id": "https://seobyray.com/#website",
            "url": "https://seobyray.com/",
            "name": "SEObyRay",
            "publisher": { "@id": "https://seobyray.com/#business" },
            "inLanguage": "nl-NL"
          },
          {
            "@type": "WebPage",
            "@id": "https://seobyray.com/#webpage",
            "url": "https://seobyray.com/",
            "name": "SEO, GEO & AIO Specialist Amsterdam | SEObyRay",
            "isPartOf": { "@id": "https://seobyray.com/#website" },
            "dateModified": "2026-04-28",
            "inLanguage": "nl-NL"
          }
        ]
      }
    </script>
    <!-- CSS for SEO content - visually hidden but machine readable -->
    <style>
      .seo-content {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border-width: 0;
      }
      .seo-content-fallback {
        display: none; /* Hide by default when JS is enabled */
      }
      /* Only show fallback when JS is disabled */
      noscript .seo-content-fallback {
        display: block;
        margin-top: 2rem;
        padding: 1rem;
      }
    </style>
    <script type="module" crossorigin src="/assets/index-BcPE6cOe.js"></script>
    <link rel="modulepreload" crossorigin href="/assets/jsx-runtime-Bq3x7umQ.js">
    <link rel="stylesheet" crossorigin href="/assets/index-CaFtZM49.css">
  </head>
  <body>
    <!-- SEO Content - strategisch geplaatst voor zoekmachines -->
    <div class="seo-content" aria-hidden="true">
      <h1>SEO, GEO &amp; AIO Specialist Amsterdam | SEObyRay</h1>
      <p>SEObyRay helpt B2B- en servicebedrijven met technische SEO, contentstrategie, structured data, entity SEO en AI-search optimalisatie.</p>
      <h2>Veelgestelde vragen over SEO, GEO &amp; AIO</h2>
      <article class="faq-item">
        <h3>Wat is AIO en hoe verschilt het van SEO en GEO?</h3>
        <p>AIO maakt content, techniek en entiteiten duidelijker voor AI-systemen. SEO richt zich op organische zoekresultaten en GEO op generatieve zoekmachines.</p>
      </article>
      <article class="faq-item">
        <h3>Welke structured data is belangrijk voor SEO, GEO en AIO?</h3>
        <p>Gebruik alleen structured data die aansluit op zichtbare content, zoals Organization, ProfessionalService, Person, WebSite, WebPage en Service.</p>
      </article>
    </div>

    <div id="root"><!--app-html--></div>
    <!-- Main app script -->
    
    <!-- Fallback content als React niet laadt -->
    <div id="app-loading" style="display: none;">
      <div class="loading-container">
        <div class="loading-spinner"></div>
        <p>Bezig met laden van de applicatie...</p>
      </div>
    </div>
    
    <!-- Fallback script -->
    <script>
      // Toon fallback content als de app niet binnen 8 seconden is geladen
      window.appLoadTimeout = setTimeout(function() {
        const app = document.getElementById('root');
        const loading = document.getElementById('app-loading');
        
        if (app && app.children.length === 0 && loading) {
          loading.style.display = 'block';
          console.log('Fallback loading screen shown');
        }
      }, 8000);
      
      // Verwijder de timeout als de app succesvol is geladen
      window.addEventListener('app-loaded', function() {
        clearTimeout(window.appLoadTimeout);
        const loading = document.getElementById('app-loading');
        if (loading) loading.style.display = 'none';
      });
    </script>
      <!-- Fallback voor als JavaScript is uitgeschakeld -->
      <div class="seo-content-fallback">
        <h1>SEO, GEO & AIO Specialist Amsterdam | SEObyRay</h1>
        <p>
          SEObyRay helpt B2B- en servicebedrijven met technische SEO, contentstrategie,
          structured data, entity SEO en AI-search optimalisatie.
        </p>
        <p>
          De aanpak combineert een sterke technische basis met people-first content,
          actuele FAQ's, duidelijke entiteiten en meetbare Search Console data.
        </p>
        <h2>SEO, GEO & AIO Diensten</h2>
        <ul>
          <li>SEO strategie</li>
          <li>Technische SEO</li>
          <li>Content optimalisatie</li>
          <li>Structured data</li>
          <li>AI-search optimalisatie</li>
        </ul>
        <a href="mailto:info@seobyray.com">Contact: info@seobyray.com</a>
      </div>
    </noscript>
  </body>
</html>
