Prepare for launch: Add Google Analytics, enhanced SEO, and go-live checklist

2025-06-07 11:03:22 +01:00
parent f13a131700
commit 4f56b3664a
4 changed files with 277 additions and 11 deletions
--- a/GO-LIVE-CHECKLIST.md
+++ b/GO-LIVE-CHECKLIST.md
@@ -0,0 +1,109 @@
+# UK Data Services - Go Live Checklist
+
+## 🚀 Pre-Launch Checklist
+
+### 1. Google Analytics Setup
+**REQUIRED**: Replace tracking codes in `index.php`
+
+- [ ] **Get Google Analytics 4 Measurement ID** from your current site
+  - Log into [Google Analytics](https://analytics.google.com)
+  - Go to Admin → Property Settings → Data Streams
+  - Copy your Measurement ID (format: `G-XXXXXXXXXX`)
+  
+- [ ] **Update tracking code** in `index.php` line ~52:
+  ```html
+  <!-- Replace GA_MEASUREMENT_ID with your actual ID -->
+  <script async src="https://www.googletagmanager.com/gtag/js?id=YOUR_GA4_ID_HERE"></script>
+  <script>
+      gtag('config', 'YOUR_GA4_ID_HERE', {
+  ```
+
+### 2. Google Tag Manager (Optional)
+If you use Google Tag Manager:
+- [ ] Get your GTM Container ID (format: `GTM-XXXXXXX`)
+- [ ] Uncomment and update GTM code in `index.php` lines ~59-67
+- [ ] Uncomment noscript tag after `<body>` tag
+
+### 3. Microsoft Clarity (Optional)
+For additional user behavior analytics:
+- [ ] Sign up at [Microsoft Clarity](https://clarity.microsoft.com)
+- [ ] Get your Project ID
+- [ ] Uncomment and update Clarity code in `index.php` lines ~69-77
+
+### 4. Social Media Images
+- [ ] Create/upload Open Graph image: `assets/images/og-image.jpg` (1200x630px)
+- [ ] Create/upload Twitter card image: `assets/images/twitter-card.jpg` (1200x600px)
+
+### 5. Favicon & App Icons
+- [ ] Ensure `assets/images/favicon.ico` exists
+- [ ] Ensure `assets/images/apple-touch-icon.png` exists (180x180px)
+
+### 6. SEO Verification
+- [ ] Submit sitemap to Google Search Console: `https://ukdataservices.co.uk/sitemap.xml`
+- [ ] Submit sitemap to Bing Webmaster Tools
+- [ ] Verify meta descriptions are under 160 characters
+- [ ] Test structured data with [Google Rich Results Test](https://search.google.com/test/rich-results)
+
+### 7. Security & Performance
+- [ ] Enable HTTPS/SSL certificate
+- [ ] Test all security headers are working
+- [ ] Test website speed with [PageSpeed Insights](https://pagespeed.web.dev/)
+- [ ] Test mobile responsiveness
+
+### 8. Content Review
+- [ ] Verify phone number: +44 1692 689150
+- [ ] Verify email: info@ukdataservices.co.uk
+- [ ] Check all links work correctly
+- [ ] Test contact form functionality
+- [ ] Test quote form functionality
+
+### 9. Analytics Testing
+After going live:
+- [ ] Test Google Analytics is tracking pageviews
+- [ ] Test form submissions are being tracked
+- [ ] Verify real-time data appears in GA dashboard
+- [ ] Test 404 page tracking
+
+### 10. Technical Setup
+- [ ] Update DNS to point to new server
+- [ ] Set up 301 redirects from old URLs if needed
+- [ ] Configure email forwarding if needed
+- [ ] Test all Docker containers are running properly
+
+## 📊 Current Analytics Integration
+
+The new site includes:
+
+✅ **Google Analytics 4** with enhanced tracking:
+- Page views
+- Form submissions
+- User engagement
+- Custom events
+
+✅ **Enhanced SEO Meta Tags**:
+- Comprehensive Open Graph tags
+- Twitter Card optimization
+- Search engine directives
+- Structured data for search results
+
+✅ **Security Headers**:
+- Content Security Policy updated for analytics
+- XSS Protection
+- HTTPS enforcement
+- Clickjacking prevention
+
+✅ **Performance Optimizations**:
+- Async loading of analytics scripts
+- Optimized images and fonts
+- Efficient CSS and JavaScript
+
+## 🔧 Files Modified for Launch
+- `index.php` - Added analytics, enhanced SEO
+- Security headers updated for tracking domains
+- Meta tags optimized for search engines
+
+## 📞 Support
+If you need help with any of these steps, contact your development team or refer to the Google Analytics documentation.
+
+---
+**Last Updated**: June 2025
--- a/assets/images/icon-web-scraping-v2.svg
+++ b/assets/images/icon-web-scraping-v2.svg
@@ -0,0 +1,61 @@
+<svg width="60" height="60" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="webScrapingGrad2" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" style="stop-color:#667eea;stop-opacity:1" />
+      <stop offset="100%" style="stop-color:#764ba2;stop-opacity:1" />
+    </linearGradient>
+  </defs>
+  
+  <!-- Browser window with data -->
+  <rect x="5" y="12" width="35" height="25" fill="none" stroke="url(#webScrapingGrad2)" stroke-width="2" rx="3"/>
+  <rect x="5" y="12" width="35" height="6" fill="url(#webScrapingGrad2)" rx="3"/>
+  
+  <!-- Browser dots -->
+  <circle cx="9" cy="15" r="1" fill="white"/>
+  <circle cx="12" cy="15" r="1" fill="white"/>
+  <circle cx="15" cy="15" r="1" fill="white"/>
+  
+  <!-- Data lines in browser -->
+  <line x1="8" y1="22" x2="25" y2="22" stroke="url(#webScrapingGrad2)" stroke-width="1.5"/>
+  <line x1="8" y1="26" x2="32" y2="26" stroke="url(#webScrapingGrad2)" stroke-width="1.5"/>
+  <line x1="8" y1="30" x2="20" y2="30" stroke="url(#webScrapingGrad2)" stroke-width="1.5"/>
+  <line x1="8" y1="34" x2="28" y2="34" stroke="url(#webScrapingGrad2)" stroke-width="1.5"/>
+  
+  <!-- Extraction arrow -->
+  <path d="M 42 25 Q 48 20 52 25" stroke="url(#webScrapingGrad2)" stroke-width="2" fill="none" marker-end="url(#extractArrow2)"/>
+  
+  <!-- Database/storage -->
+  <rect x="46" y="35" width="12" height="20" fill="none" stroke="url(#webScrapingGrad2)" stroke-width="2" rx="2"/>
+  
+  <!-- Data rows in storage -->
+  <line x1="48" y1="40" x2="56" y2="40" stroke="url(#webScrapingGrad2)" stroke-width="1"/>
+  <line x1="48" y1="43" x2="54" y2="43" stroke="url(#webScrapingGrad2)" stroke-width="1"/>
+  <line x1="48" y1="46" x2="56" y2="46" stroke="url(#webScrapingGrad2)" stroke-width="1"/>
+  <line x1="48" y1="49" x2="52" y2="49" stroke="url(#webScrapingGrad2)" stroke-width="1"/>
+  <line x1="48" y1="52" x2="55" y2="52" stroke="url(#webScrapingGrad2)" stroke-width="1"/>
+  
+  <!-- Web network nodes -->
+  <circle cx="15" cy="45" r="3" fill="url(#webScrapingGrad2)" opacity="0.7"/>
+  <circle cx="25" cy="50" r="2.5" fill="url(#webScrapingGrad2)" opacity="0.7"/>
+  <circle cx="35" cy="48" r="2" fill="url(#webScrapingGrad2)" opacity="0.7"/>
+  
+  <!-- Connection lines -->
+  <line x1="17" y1="46" x2="23" y2="49" stroke="url(#webScrapingGrad2)" stroke-width="1.5" opacity="0.6"/>
+  <line x1="27" y1="50" x2="33" y2="48" stroke="url(#webScrapingGrad2)" stroke-width="1.5" opacity="0.6"/>
+  
+  <!-- Data extraction particles -->
+  <circle cx="44" cy="23" r="1" fill="url(#webScrapingGrad2)">
+    <animate attributeName="cx" values="44;50;44" dur="2s" repeatCount="indefinite"/>
+    <animate attributeName="opacity" values="1;0.3;1" dur="2s" repeatCount="indefinite"/>
+  </circle>
+  <circle cx="42" cy="27" r="0.8" fill="url(#webScrapingGrad2)">
+    <animate attributeName="cx" values="42;48;42" dur="2.5s" repeatCount="indefinite"/>
+    <animate attributeName="opacity" values="1;0.3;1" dur="2.5s" repeatCount="indefinite"/>
+  </circle>
+  
+  <defs>
+    <marker id="extractArrow2" markerWidth="8" markerHeight="6" refX="7" refY="3" orient="auto">
+      <polygon points="0 0, 8 3, 0 6" fill="#667eea"/>
+    </marker>
+  </defs>
+</svg>
--- a/assets/images/icon-web-scraping.svg
+++ b/assets/images/icon-web-scraping.svg
@@ -1,12 +1,61 @@
 <svg width="60" height="60" xmlns="http://www.w3.org/2000/svg">
  <defs>
-    <linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="100%">
+    <linearGradient id="webScrapingGrad" x1="0%" y1="0%" x2="100%" y2="100%">
      <stop offset="0%" style="stop-color:#667eea;stop-opacity:1" />
      <stop offset="100%" style="stop-color:#764ba2;stop-opacity:1" />
    </linearGradient>
  </defs>
-  <rect x="10" y="15" width="40" height="30" fill="none" stroke="url(#grad1)" stroke-width="3" rx="4"/>
-  <line x1="15" y1="25" x2="35" y2="25" stroke="url(#grad1)" stroke-width="2"/>
-  <line x1="15" y1="30" x2="45" y2="30" stroke="url(#grad1)" stroke-width="2"/>
-  <line x1="15" y1="35" x2="40" y2="35" stroke="url(#grad1)" stroke-width="2"/>
+  
+  <!-- Browser window with data -->
+  <rect x="5" y="12" width="35" height="25" fill="none" stroke="url(#webScrapingGrad)" stroke-width="2" rx="3"/>
+  <rect x="5" y="12" width="35" height="6" fill="url(#webScrapingGrad)" rx="3"/>
+  
+  <!-- Browser dots -->
+  <circle cx="9" cy="15" r="1" fill="white"/>
+  <circle cx="12" cy="15" r="1" fill="white"/>
+  <circle cx="15" cy="15" r="1" fill="white"/>
+  
+  <!-- Data lines in browser -->
+  <line x1="8" y1="22" x2="25" y2="22" stroke="url(#webScrapingGrad)" stroke-width="1.5"/>
+  <line x1="8" y1="26" x2="32" y2="26" stroke="url(#webScrapingGrad)" stroke-width="1.5"/>
+  <line x1="8" y1="30" x2="20" y2="30" stroke="url(#webScrapingGrad)" stroke-width="1.5"/>
+  <line x1="8" y1="34" x2="28" y2="34" stroke="url(#webScrapingGrad)" stroke-width="1.5"/>
+  
+  <!-- Extraction arrow -->
+  <path d="M 42 25 Q 48 20 52 25" stroke="url(#webScrapingGrad)" stroke-width="2" fill="none" marker-end="url(#extractArrow)"/>
+  
+  <!-- Database/storage -->
+  <rect x="46" y="35" width="12" height="20" fill="none" stroke="url(#webScrapingGrad)" stroke-width="2" rx="2"/>
+  
+  <!-- Data rows in storage -->
+  <line x1="48" y1="40" x2="56" y2="40" stroke="url(#webScrapingGrad)" stroke-width="1"/>
+  <line x1="48" y1="43" x2="54" y2="43" stroke="url(#webScrapingGrad)" stroke-width="1"/>
+  <line x1="48" y1="46" x2="56" y2="46" stroke="url(#webScrapingGrad)" stroke-width="1"/>
+  <line x1="48" y1="49" x2="52" y2="49" stroke="url(#webScrapingGrad)" stroke-width="1"/>
+  <line x1="48" y1="52" x2="55" y2="52" stroke="url(#webScrapingGrad)" stroke-width="1"/>
+  
+  <!-- Web network nodes -->
+  <circle cx="15" cy="45" r="3" fill="url(#webScrapingGrad)" opacity="0.7"/>
+  <circle cx="25" cy="50" r="2.5" fill="url(#webScrapingGrad)" opacity="0.7"/>
+  <circle cx="35" cy="48" r="2" fill="url(#webScrapingGrad)" opacity="0.7"/>
+  
+  <!-- Connection lines -->
+  <line x1="17" y1="46" x2="23" y2="49" stroke="url(#webScrapingGrad)" stroke-width="1.5" opacity="0.6"/>
+  <line x1="27" y1="50" x2="33" y2="48" stroke="url(#webScrapingGrad)" stroke-width="1.5" opacity="0.6"/>
+  
+  <!-- Data extraction particles -->
+  <circle cx="44" cy="23" r="1" fill="url(#webScrapingGrad)">
+    <animate attributeName="cx" values="44;50;44" dur="2s" repeatCount="indefinite"/>
+    <animate attributeName="opacity" values="1;0.3;1" dur="2s" repeatCount="indefinite"/>
+  </circle>
+  <circle cx="42" cy="27" r="0.8" fill="url(#webScrapingGrad)">
+    <animate attributeName="cx" values="42;48;42" dur="2.5s" repeatCount="indefinite"/>
+    <animate attributeName="opacity" values="1;0.3;1" dur="2.5s" repeatCount="indefinite"/>
+  </circle>
+  
+  <defs>
+    <marker id="extractArrow" markerWidth="8" markerHeight="6" refX="7" refY="3" orient="auto">
+      <polygon points="0 0, 8 3, 0 6" fill="#667eea"/>
+    </marker>
+  </defs>
 </svg>
--- a/index.php
+++ b/index.php
@@ -5,12 +5,16 @@ header('X-Frame-Options: DENY');
 header('X-XSS-Protection: 1; mode=block');
 header('Strict-Transport-Security: max-age=31536000; includeSubDomains');
 header('Referrer-Policy: strict-origin-when-cross-origin');
-header('Content-Security-Policy: default-src \'self\'; script-src \'self\' \'unsafe-inline\' https://cdnjs.cloudflare.com; style-src \'self\' \'unsafe-inline\' https://fonts.googleapis.com; font-src \'self\' https://fonts.gstatic.com; img-src \'self\' data:; connect-src \'self\';');
+header('Content-Security-Policy: default-src \'self\'; script-src \'self\' \'unsafe-inline\' https://cdnjs.cloudflare.com https://www.googletagmanager.com https://www.google-analytics.com https://www.clarity.ms; style-src \'self\' \'unsafe-inline\' https://fonts.googleapis.com; font-src \'self\' https://fonts.gstatic.com; img-src \'self\' data: https://www.google-analytics.com; connect-src \'self\' https://www.google-analytics.com https://analytics.google.com;');

 // SEO and performance optimizations
 $page_title = "UK Data Services | Professional Web Scraping & Data Analytics Solutions";
 $page_description = "Leading UK provider of web scraping, data extraction, business intelligence, and analytics services. Transform your business with professional data solutions.";
 $canonical_url = "https://ukdataservices.co.uk/";
+$keywords = "web scraping UK, data extraction services, business intelligence, competitive analysis, price monitoring, data analytics, market research, web data mining";
+$author = "UK Data Services";
+$og_image = "https://ukdataservices.co.uk/assets/images/og-image.jpg";
+$twitter_card_image = "https://ukdataservices.co.uk/assets/images/twitter-card.jpg";
 ?>
 <!DOCTYPE html>
 <html lang="en">
@@ -19,9 +23,11 @@ $canonical_url = "https://ukdataservices.co.uk/";
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?php echo htmlspecialchars($page_title); ?></title>
    <meta name="description" content="<?php echo htmlspecialchars($page_description); ?>">
-    <meta name="keywords" content="web scraping, data extraction, business intelligence, data analytics, UK data services, competitive analysis, market research">
-    <meta name="author" content="UK Data Services">
+    <meta name="keywords" content="<?php echo htmlspecialchars($keywords); ?>">
+    <meta name="author" content="<?php echo htmlspecialchars($author); ?>">
    <meta name="robots" content="index, follow">
+    <meta name="googlebot" content="index, follow">
+    <meta name="bingbot" content="index, follow">
    <link rel="canonical" href="<?php echo htmlspecialchars($canonical_url); ?>">
    
    <!-- Open Graph / Social Media -->
@@ -29,19 +35,54 @@ $canonical_url = "https://ukdataservices.co.uk/";
    <meta property="og:url" content="<?php echo htmlspecialchars($canonical_url); ?>">
    <meta property="og:title" content="<?php echo htmlspecialchars($page_title); ?>">
    <meta property="og:description" content="<?php echo htmlspecialchars($page_description); ?>">
-    <meta property="og:image" content="<?php echo htmlspecialchars($canonical_url); ?>assets/images/og-image.jpg">
+    <meta property="og:image" content="<?php echo htmlspecialchars($og_image); ?>">
    
    <!-- Twitter Card -->
    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:url" content="<?php echo htmlspecialchars($canonical_url); ?>">
    <meta name="twitter:title" content="<?php echo htmlspecialchars($page_title); ?>">
    <meta name="twitter:description" content="<?php echo htmlspecialchars($page_description); ?>">
-    <meta name="twitter:image" content="<?php echo htmlspecialchars($canonical_url); ?>assets/images/twitter-card.jpg">
+    <meta name="twitter:image" content="<?php echo htmlspecialchars($twitter_card_image); ?>">
    
    <!-- Favicon -->
    <link rel="icon" type="image/x-icon" href="assets/images/favicon.ico">
    <link rel="apple-touch-icon" sizes="180x180" href="assets/images/apple-touch-icon.png">
    
+    <!-- Google Analytics 4 (GA4) -->
+    <!-- TODO: Replace GA_MEASUREMENT_ID with your actual Google Analytics 4 Measurement ID -->
+    <script async src="https://www.googletagmanager.com/gtag/js?id=GA_MEASUREMENT_ID"></script>
+    <script>
+        window.dataLayer = window.dataLayer || [];
+        function gtag(){dataLayer.push(arguments);}
+        gtag('js', new Date());
+        gtag('config', 'GA_MEASUREMENT_ID', {
+            page_title: document.title,
+            page_location: window.location.href
+        });
+    </script>
+    
+    <!-- Google Tag Manager (Optional - if you use GTM) -->
+    <!-- TODO: Replace GTM-XXXXXXX with your Google Tag Manager container ID -->
+    <!-- 
+    <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
+    new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
+    j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
+    'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
+    })(window,document,'script','dataLayer','GTM-XXXXXXX');</script>
+    -->
+    
+    <!-- Microsoft Clarity (Optional) -->
+    <!-- TODO: Replace CLARITY_PROJECT_ID with your Clarity project ID -->
+    <!--
+    <script type="text/javascript">
+        (function(c,l,a,r,i,t,y){
+            c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};
+            t=l.createElement(r);t.async=1;t.src="https://www.clarity.ms/tag/"+i;
+            y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y);
+        })(window, document, "clarity", "script", "CLARITY_PROJECT_ID");
+    </script>
+    -->
+    
    <!-- Fonts -->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
@@ -76,6 +117,12 @@ $canonical_url = "https://ukdataservices.co.uk/";
    </script>
 </head>
 <body>
+    <!-- Google Tag Manager (noscript) -->
+    <!-- TODO: Replace GTM-XXXXXXX with your Google Tag Manager container ID -->
+    <!-- 
+    <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX"
+    height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
+    -->
    <!-- Navigation -->
    <nav class="navbar" id="navbar">
        <div class="nav-container">
@@ -229,7 +276,7 @@ $canonical_url = "https://ukdataservices.co.uk/";
            <div class="services-grid">
                <div class="service-card animate-on-scroll" style="--animation-delay: 0.1s;">
                    <div class="service-icon">
-                        <img src="assets/images/icon-web-scraping.svg" alt="Enterprise Web Intelligence">
+                        <img src="assets/images/icon-web-scraping-v2.svg" alt="Enterprise Web Intelligence">
                    </div>
                    <h3>Enterprise Web Intelligence & Monitoring</h3>
                    <p>Our consultancy delivers strategic data acquisition solutions utilising advanced web intelligence platforms and proprietary extraction methodologies.</p>