Aquí tienes un código completo que puedes implementar en tu sitio web:
// SEO Analytics Master Class
class SEOAnalytics {
constructor(measurementId) {
this.measurementId = measurementId;
this.sessionData = {
startTime: Date.now(),
pageViews: 1,
scrollDepth: 0,
interactions: 0,
timeOnPage: 0
};
this.init();
}
init() {
this.setupBasicTracking();
this.setupAdvancedEvents();
this.setupPerformanceMonitoring();
this.setupSEOSpecificTracking();
}
setupBasicTracking() {
// Configuración básica de GA4
gtag('config', this.measurementId, {
page_title: document.title,
page_location: window.location.href,
content_group1: this.getContentCategory(),
content_group2: this.getPageType()
});
}
setupAdvancedEvents() {
// Seguimiento de scroll profundo
let scrollThresholds = [25, 50, 75, 90, 100];
let scrollTracked = {};
window.addEventListener('scroll', () => {
let scrollPercent = Math.round(
(window.scrollY / (document.body.scrollHeight - window.innerHeight)) * 100
);
this.sessionData.scrollDepth = Math.max(this.sessionData.scrollDepth, scrollPercent);
scrollThresholds.forEach(threshold => {
if (scrollPercent >= threshold && !scrollTracked[threshold]) {
this.trackEvent('scroll_depth', {
event_category: 'SEO Engagement',
event_label: `${threshold}%`,
value: threshold
});
scrollTracked[threshold] = true;
}
});
});
// Seguimiento de interacciones
['click', 'focus', 'input'].forEach(eventType => {
document.addEventListener(eventType, () => {
this.sessionData.interactions++;
});
});
}
trackEvent(eventName, parameters) {
gtag('event', eventName, parameters);
}
getContentCategory() {
// Determinar categoría de contenido basada en URL
let path = window.location.pathname;
if (path.includes('/blog/')) return 'Blog';
if (path.includes('/productos/')) return 'Productos';
if (path.includes('/servicios/')) return 'Servicios';
return 'General';
}
getPageType() {
// Determinar tipo de página
if (document.querySelector('article')) return 'Article';
if (document.querySelector('.product')) return 'Product';
if (document.querySelector('form[name="contact"]')) return 'Contact';
return 'Page';
}
// Método para generar reporte de sesión
generateSessionReport() {
this.sessionData.timeOnPage = Date.now() - this.sessionData.startTime;
return {
session_duration: Math.round(this.sessionData.timeOnPage / 1000),
page_views: this.sessionData.pageViews,
max_scroll_depth: this.sessionData.scrollDepth,
total_interactions: this.sessionData.interactions,
engagement_score: this.calculateEngagementScore()
};
}
calculateEngagementScore() {
let score = 0;
score += Math.min(this.sessionData.timeOnPage / 1000 / 60, 10); // Tiempo (max 10 puntos)
score += Math.min(this.sessionData.scrollDepth / 10, 10); // Scroll (max 10 puntos)
score += Math.min(this.sessionData.interactions, 20); // Interacciones (max 20 puntos)
return Math.round(score);
}
}
// Inicializar SEO Analytics
document.addEventListener('DOMContentLoaded', () => {
const seoAnalytics = new SEOAnalytics('GA_MEASUREMENT_ID');
// Enviar reporte de sesión antes de salir
window.addEventListener('beforeunload', () => {
let sessionReport = seoAnalytics.generateSessionReport();
gtag('event', 'session_summary', {
event_category: 'SEO Session',
custom_parameters: sessionReport
});
});
});