/**
* Logique de la Timeline Interactive SEO
* Aucune dépendance externe lourde (jQuery, React, etc.)
* Utilisation de l’API IntersectionObserver pour les animations au scroll.
*/
// 1. Les données (Data Source)
// Basé sur le fragment fourni, enrichi avec des sous-tâches pour l’aspect éducatif.
const seoSteps = [
{
day: “J-1”,
title: “Préparation et accès aux outils”,
category: “Setup”,
color: “bg-blue-500”,
icon: “,
details: [
“Récupération des accès Google Search Console & Analytics.”,
“Configuration du crawler (ex: Screaming Frog).”,
“Listing des URL prioritaires et objectifs business.”
]
},
{
day: “J-2”,
title: “Crawl technique du site”,
category: “Technique”,
color: “bg-indigo-600”,
icon: “,
details: [
“Identification des erreurs 4xx et 5xx.”,
“Analyse de la vitesse (Core Web Vitals).”,
“Vérification de l’indexabilité (Robots.txt, Sitemap, Canonical).”
]
},
{
day: “J-4”,
title: “Analyse sémantique et contenu”,
category: “Contenu”,
color: “bg-teal-500”,
icon: “,
details: [
“Étude des mots-clés positionnés vs opportunités.”,
“Détection du contenu dupliqué (interne/externe).”,
“Optimisation des balises Hn, Title et Méta-description.”
]
},
{
day: “J-6”,
title: “Audit de popularité (Off-site)”,
category: “Autorité”,
color: “bg-purple-600”,
icon: “,
details: [
“Analyse du profil de liens (Backlinks).”,
“Vérification des ancres de liens (sur-optimisation).”,
“Comparatif avec les concurrents directs.”
]
},
{
day: “J-7”,
title: “Rapport et Plan d’action”,
category: “Stratégie”,
color: “bg-emerald-600”,
icon: “,
details: [
“Synthèse des points bloquants.”,
“Liste des ‘Quick Wins’ (actions rapides).”,
“Roadmap priorisée (Technique > Sémantique > Netlinking).”
]
}
];
// 2. Fonction de génération du HTML
function renderTimeline() {
const container = document.getElementById(‘timeline-content’);
let htmlContent = ”;
seoSteps.forEach((step, index) => {
// Alternance gauche/droite pour desktop
const isLeft = index % 2 === 0;
const alignClass = isLeft ? ‘md:flex-row-reverse’ : ‘md:flex-row’;
const marginClass = isLeft ? ‘md:mr-auto’ : ‘md:ml-auto’;
const animationClass = isLeft ? ‘slide-left’ : ‘slide-right’; // Classes marqueurs pour JS
// Construction de la liste à puces des détails
const detailsList = step.details.map(d => `
{“@context”:”https://schema.org”,”@type”:”FAQPage”,”mainEntity”:[{“@type”:”Question”,”name”:”u00c0 quelle fru00e9quence dois-je ru00e9aliser un audit SEO ?”,”acceptedAnswer”:{“@type”:”Answer”,”text”:”Il est recommandu00e9 de ru00e9aliser un audit complet au moins une fois par an. Cependant, un suivi mensuel des erreurs techniques critiques via la Search Console est indispensable pour maintenir la performance.”}},{“@type”:”Question”,”name”:”Quels outils sont nu00e9cessaires pour un audit ?”,”acceptedAnswer”:{“@type”:”Answer”,”text”:”Pour un audit professionnel, l’utilisation combinu00e9e de Google Search Console (gratuit), Google Analytics, et d’un crawler comme Screaming Frog ou d’une suite comme SEMrush/Ahrefs est vivement conseillu00e9e.”}},{“@type”:”Question”,”name”:”Combien de temps faut-il pour voir les ru00e9sultats apru00e8s un audit ?”,”acceptedAnswer”:{“@type”:”Answer”,”text”:”Les corrections techniques peuvent avoir un impact en quelques semaines. En revanche, les optimisations de contenu et de popularitu00e9 nu00e9cessitent gu00e9nu00e9ralement entre 3 et 6 mois pour montrer leur plein potentiel dans les classements.”}}]}
Je suis Kevin Grillot, consultant SEO freelance certifié. J'accompagne les TPE et PME en référencement naturel, Google Ads, Meta Ads et création de site internet.