SEO - Optimización para Buscadores

Floutic implementa una estrategia SEO completa para maximizar la visibilidad en buscadores y atraer tráfico orgánico cualificado.

🎯 Estrategia General

Keywords Principales

• Automatización de procesos para pymes
• Expertos en n8n, Make, Zapier, Airtable
• Marketplace de automatización
• Freelancers automatización España

Páginas Objetivo

Tipo	URL	Intención
Home	/	Marca + automatización pymes
Expertos	/expertos	Búsqueda de profesionales
Skill Pages	/expertos-en/{skill}	Keywords específicas por herramienta
Tool Pages	/herramientas/{tool}	Guías completas de herramientas
Perfiles	/expertos/{slug}	Long-tail + reputación
FAQ	/faq	Intenciones de búsqueda informativas

---

📄 Páginas Dinámicas SEO

Tool Pages (/herramientas/{slug})

Páginas dedicadas a herramientas de automatización gestionables desde el admin.

Características:

• Contenido completamente dinámico (CMS)
• Schema.org SoftwareApplication
• FAQs con Schema.org FAQPage
• Meta tags dinámicos
• Open Graph optimizado
• Breadcrumbs estructurados
• TOC (Tabla de Contenidos) lateral

Herramientas disponibles:

• /herramientas/n8n - Automatización open-source
• /herramientas/make - Workflows visuales
• /herramientas/zapier - Integraciones rápidas
• /herramientas/airtable - Bases de datos + automatización

Backend:

POST /api/v1/admin/tool-pages       # Crear página
GET  /api/v1/tools/{slug}           # Obtener página pública
GET  /api/v1/tools/active           # Listar herramientas activas

Script de seeding:

docker-compose exec backend python scripts/seed_tool_pages.py

---

Skill Pages (/expertos-en/{skill})

Páginas de landing para habilidades específicas con lista de expertos.

Características:

• Lista paginada de expertos con esa skill
• Schema.org ItemList + Person
• FAQs dinámicas
• Breadcrumbs
• CTAs contextuales

Backend:

GET /api/v1/skills/{slug}           # Página de skill pública

---

Perfiles de Expertos (/expertos/{slug})

URLs SEO-friendly para perfiles públicos de expertos.

Características:

• URLs con slug legible (/expertos/juan-developer)
• Fallback a ID (/expertos/123)
• Schema.org ProfilePage + Person
• Skills enlazadas a Skill Pages
• Breadcrumbs navegables

Schema.org implementado:

{
  "@type": "ProfilePage",
  "mainEntity": {
    "@type": "Person",
    "name": "Juan Developer",
    "jobTitle": "Experto en n8n",
    "knowsAbout": ["n8n", "Make", "Zapier"],
    "aggregateRating": { "@type": "AggregateRating", ... }
  }
}

---

🏷️ Schema.org (JSON-LD)

Floutic implementa múltiples schemas para Rich Snippets en Google:

Schemas Implementados

Schema	Página	Propósito
Organization	Home	Marca y contacto
FAQPage	Home, FAQ, Tool Pages	Rich snippets de FAQs
SoftwareApplication	Tool Pages	Info de herramientas
ProfilePage + Person	Perfiles expertos	Perfiles profesionales
ItemList	Listados	Listas de expertos
BreadcrumbList	Todas	Navegación estructurada
Service	Home	Servicios ofrecidos

Ejemplo - FAQPage (Home)

const faqSchema = {
  "@context": "https://schema.org",
  "@type": "FAQPage",
  "mainEntity": [
    {
      "@type": "Question",
      "name": "¿Qué es Floutic?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Floutic es un marketplace..."
      }
    }
  ]
};

---

🔗 Meta Tags y Open Graph

Layout Principal (Layout.astro)

El layout base maneja todos los meta tags SEO:

<!-- SEO -->
<title>{title}</title>
<meta name="description" content={description} />
<meta name="robots" content={noindex ? "noindex, nofollow" : "index, follow"} />
<link rel="canonical" href={canonicalURL} />

<!-- Paginación SEO -->
{prevPage && <link rel="prev" href={prevPage} />}
{nextPage && <link rel="next" href={nextPage} />}

<!-- Open Graph -->
<meta property="og:type" content={ogType} />
<meta property="og:title" content={title} />
<meta property="og:description" content={description} />
<meta property="og:image" content={imageUrl} />

<!-- Twitter -->
<meta name="twitter:card" content="summary_large_image" />

Props del Layout

• title - Título de la página
• description - Meta description
• canonical - URL canónica
• image - Imagen Open Graph
• imageAlt - Alt de la imagen
• ogType - Tipo OG (website, article, profile)
• noindex - Si debe excluirse de indexación
• prevPage / nextPage - Paginación SEO

---

🗺️ Sitemap y Robots

Sitemap Dinámico (/sitemap.xml)

Generado automáticamente por Astro con:

• Todas las páginas estáticas
• Perfiles de expertos verificados
• Tool Pages activas
• Skill Pages activas

Robots.txt (/robots.txt)

User-agent: *
Allow: /

# Páginas excluidas
Disallow: /dashboard/
Disallow: /admin/
Disallow: /perfil/crear
Disallow: /perfil/empresa
Disallow: /perfil/experto
Disallow: /verificar-email

Sitemap: https://floutic.haorp.es/sitemap.xml

Páginas con noindex

Página	Razón
/publicar-proyecto	Requiere login
/solicitar-presupuesto	Formulario interno
/dashboard/*	Áreas privadas
/perfil/crear	Onboarding
/verificar-email	Transaccional

---

🔗 Ofuscación de Enlaces

ObfuscatedLink

Componente para ocultar enlaces de bots de búsqueda:

Uso:

<ObfuscatedLink href="/solicitar-presupuesto?expertId=123">
  Solicitar Presupuesto
</ObfuscatedLink>

Características:

• URL codificada en base64
• No usa href real
• Navegación via JavaScript
• rel="nofollow" como backup
• Accesible (keyboard, ARIA)

Cuándo usar:

• Enlaces desde páginas indexadas hacia páginas noindex
• Enlaces a formularios internos
• Enlaces que no queremos que Google siga

---

📊 URLs SEO-Friendly

Generación de Slugs

Los slugs se generan automáticamente desde nombres:

# Backend - Ejemplo
def generate_slug(name: str) -> str:
    slug = name.lower().strip()
    slug = re.sub(r'[^\w\s-]', '', slug)
    slug = re.sub(r'[\s_]+', '-', slug)
    return slug.strip('-')

Ejemplos:

• Juan García Developer → juan-garcia-developer
• n8n Automation Expert → n8n-automation-expert

Fallback a IDs

Si no hay slug disponible, se usa el ID:

• /expertos/123 (fallback)
• /perfil/experto/123 (legacy)

---

✅ Checklist SEO

Por Página Nueva

• Title tag único y descriptivo (50-60 chars)
• Meta description (150-160 chars)
• URL canónica
• Schema.org apropiado
• Open Graph completo
• Breadcrumbs estructurados
• H1 único con keyword principal
• Alt text en imágenes

Por Tipo de Contenido

• Tool Pages tienen FAQs
• Perfiles tienen Schema.org Person
• Listados tienen paginación SEO
• Formularios están en páginas noindex

---

🔧 Herramientas de Verificación

Testing Local

# Ver sitemap
curl http://localhost:3000/sitemap.xml

# Ver robots.txt
curl http://localhost:3000/robots.txt

# Verificar Schema.org (copiar JSON-LD y pegar en):
# https://search.google.com/test/rich-results

Herramientas Externas

• Google Search Console
• Rich Results Test
• Schema Markup Validator
• Lighthouse