Econect.Tech Marketing -> Dev Specs
Guia SEO

Histórico de Versões

Salvar Versão Atual

Total: {{ versions_list.length }} / 10 versões

Nenhuma versão salva. Clique em "Salvar Versão Atual" para começar.

 Comparar Versões
Comparar Versões (Lado a Lado)

Campos Alterados:

{{ field }}

Nenhuma alteração entre versões.

{{ selectedVersionA.name }}

Título: {{ selectedVersionA.data.seo.title }}

{{ selectedVersionB.name }}

Título: {{ selectedVersionB.data.seo.title }}

 HTML PDF Fechar
Next.js Edition

Especificação Técnica de SEO

Simule a estratégia de marketing e gere automaticamente o código Next.js (App Router) para a equipe.

Histórico ({{ versions_list.length }})

1. Título e Descrição

Arquivo: app/page.js - Metadata API

mdi-pencil Configuração (Marketing)
Preview (Google SERP)
mdi-earth seu-site.com.br
{{ seo.title }}
{{ seo.desc }}
Código (app/page.js)
Copiar 
{{ codes.meta }}
 Impacto no Marketing
  • CTR: Título bem estruturado = +15-30% cliques
  • Compartilhamento social = mais conversão
  • Aparece em: Google SERP, Meta tags, Twitter Card
 Estratégia
  • Palavra-chave no início do título
  • Max 60 chars (título), 160 (descrição)
  • Use números, urgência, benefício direto
  • A/B test a cada 2 semanas
 Exemplo para Campanha

Lançamento BI:

title: 'BI para PMEs | Plataforma Unificada'
desc: 'Dashboards em minutos. Sem SQL.'
 Caso de Uso

Cenário: Rankear em "software gestão pme"

Resultado: +25% tráfego em 30 dias

Monitor: Search Console semanal

2. Palavras-Chave

Arquivo: app/page.js - Metadata API

mdi-key Configuração (Marketing)

Selecione o Cluster:

Genérico Startups Enterprise
Sugestões por Segmento

Genérico:

gestão de projetos, colaboração, produtividade

Startups:

gestão ágil, sprint planning, OKR software

Enterprise:

governança PMO, BI, integração APIs
Código (app/page.js)
Copiar 
{{ codes.keywords }}
 Impacto no Marketing
  • Tráfego segmentado com intenção
  • Google entende seu conteúdo
  • Busca informativa e comercial
 Estratégia
  • Max 10 keywords por página
  • Separe por segmento (clusters)
  • Use SEMrush, Ahrefs
  • Variações: singular, plural
 Exemplo para Campanha

Segmentado:

// Startup
keywords: 'gestão ágil, sprint, OKR'
 Caso de Uso

Cenário: Múltiplos públicos

Resultado: +50% relevância

3. Redes Sociais (OG & Twitter)

Arquivo: app/page.js - Metadata API

mdi-share-variant Configuração (Marketing)
Preview (Facebook/LinkedIn)
{{ getThemeIcon(social.theme) }}
SEO ECONECT
seu-site.com.br
{{ social.title }}
{{ social.desc }}
Código (Metadata API)
Copiar 
{{ codes.social }}
 Impacto no Marketing
  • Engagement: +40% cliques
  • Branding via imagem
  • Viralidade aumentada
 Estratégia
  • Imagem: 1200x630px
  • Valor visual destacado
  • Teste em opengraph.xyz
 Exemplo

Black Friday: imagem com "50% OFF"

 Caso de Uso

Resultado: +60% cliques sociais

4. Canonical e Multiidioma

Arquivo: app/page.js - Metadata API (alternates)

mdi-web Configuração Regional

Idiomas Disponíveis:

Canonical: Define URL "oficial" para evitar duplicação

Hreflang: Indica variações por idioma/país
Código (Alternates API)
Copiar 
{{ codes.hreflang }}
 Impacto no Marketing
  • Segmentação: Cada país vê versão correta
  • Evita duplicação: Google não penaliza
  • Conversão: Idioma local = +35%
  • Aparece em: Header HTTP, seleção por país
 Estratégia
  • Adicione hreflang para cada idioma/país
  • Mantenha canonical para versão padrão
  • Use x-default sem localização
  • Certifique URLs alternativas existem
 Exemplo para Campanha

Expansão Espanha:

alternates: {
  languages: {
    'pt-BR': '/pt/',
    'en': '/en/',
    'es-ES': '/es/'
  }
}
 Caso de Uso

Cenário: Operar em Brasil, EUA e México

Resultado: +35% conversão (idioma local)

Ação: Hreflang para cada variação

5. Dados Estruturados (Schema)

Arquivo: app/page.js - JSON-LD com script tag

mdi-code-json Configuração (Avaliações & Info)
Snippet Visual (Google SERP)
{{ seo.title }}
★★★★★ {{ schema.rating }} ({{ schema.count }} avaliações) • {{ schema.name }}
JSON-LD Script (app/page.js)
Copiar 
{{ codes.schema }}
 Impacto no Marketing
  • Rich Snippets: Estrelas no Google
  • CTR: Rating 4.8+ = +35% cliques
  • Authority: Knowledge Graph
  • Confiança: Credibilidade visual
 Estratégia
  • Atualize ratingCount mensalmente
  • Invista em feedback positivo
  • Publique case studies
  • Valide em Google Rich Results
 Exemplo para Campanha

Atualização Mensal:

aggregateRating: {
  ratingValue: '4.9',
  ratingCount: '115'
}
 Caso de Uso

Cenário: 100+ reviews, sem estrelas no Google

Resultado: Rich Snippet em 2-5 dias, CTR +35%

Monitor: Atualize mensalmente

6. Robots (Indexação)

Arquivo: app/page.js - Metadata API (robots)

mdi-robot Configuração (Diretrizes) Atenção: Use apenas para Login, Checkout ou Landing Pages exclusivas.

O que cada opção significa:

Index: Página aparece em buscas

Follow: Links internos são rastreados

NoIndex: Esconde de buscas (login, checkout)
Código (Robots Object)
Copiar 
{{ codes.robots }}
 Impacto no Marketing
  • index: Página aparece em buscas
  • follow: Links rastreados
  • Controle de indexação por página
 Estratégia
  • Mantenha index,follow para conteúdo público
  • Use noindex em login, checkout
  • Landing pages: sempre index,follow
 Exemplo para Campanha

Landing Page:

robots: {
  index: true,
  follow: true
}
 Caso de Uso

Cenário: Checkout no Google

Resultado: Use noindex,nofollow

7. Sitemap.xml

Arquivo: app/sitemap.ts - Sitemap API

mdi-sitemap Configuração (URLs e Prioridades)

Prioridades por tipo:

1.0: Homepage

0.8: Landing pages

0.6: Categorias

0.4: Blog posts

0.2: Páginas secundárias
Código (app/sitemap.ts)
Copiar 
{{ codes.sitemap }}
 Impacto no Marketing
  • Indexação: 24-48h vs 1-2 semanas
  • Descoberta automática de páginas
  • Priorização de conteúdo importante
 Estratégia
  • Atualize após novas páginas
  • Use prioridade > 0.8 para conversão
  • Submeta em Search Console
  • Exclua páginas com noindex
 Exemplo para Campanha

Blog dinâmico:

const posts = await getPosts()
return posts.map(post => ({
  url: `/blog/${post.slug}`,
  changeFrequency: 'weekly'
}))
 Caso de Uso

Cenário: 20 novos posts

Resultado: Indexação em 24-48h, +15% tráfego

8. Favicon & App Icons

Arquivo: app/icon.png, app/apple-icon.png - Icon Convention

mdi-image-multiple Configuração (Tamanhos e Formatos)

Tamanhos Necessários:

16x16: Favicon (tab browser)

32x32: Favicon HD

180x180: Apple Touch Icon

192x192: Android Chrome

512x512: PWA Splash Screen

Next.js Convention: Coloque icon.png e apple-icon.png em app/

Geração automática de todos os tamanhos!
Código (Metadata API)
Copiar 
{{ codes.icons }}
 Impacto no Marketing
  • Brand Recognition: 20+ tabs abertas
  • Profissionalismo: +25% confiança
  • Mobile: Apple Touch Icon (PWA)
  • Bookmarks: Identificação fácil
 Estratégia
  • PNG com fundo transparente
  • Design simples (16x16px visível)
  • Teste em múltiplos browsers
  • Use realfavicongenerator.net
 Exemplo para Campanha

Favicon Sazonal (Black Friday):

// Temporário: badge "50% OFF"
// Reverta após campanha
 Caso de Uso

Cenário: Usuários não acham sua aba

Resultado: Favicon distintivo, +25% produtividade

9. Viewport & Mobile-First

Arquivo: app/layout.tsx - Viewport Export

mdi-responsive Configuração (Responsividade)

Core Web Vitals:

LCP: < 2.5s (imagem principal)

FID: < 100ms (interatividade)

CLS: < 0.1 (layout shift)
Código (Viewport Export)
Copiar 
{{ codes.viewport }}
 Impacto no Marketing
  • Mobile-First: 60%+ tráfego mobile
  • Core Web Vitals: Melhor ranking
  • Conversão: Site otimizado +30%
  • Bounce Rate: Viewport correto -20%
 Estratégia
  • Sempre use width=device-width
  • Initial-scale=1 evita zoom (iOS)
  • Teste em dispositivos reais
  • Use PageSpeed Insights
 Exemplo para Campanha

Otimização Mobile-First:

export const viewport = {
  width: 'device-width',
  initialScale: 1
}
 Caso de Uso

Cenário: Bounce rate mobile 60%

Resultado: Cai para 35%, conversão +30%

10. Verificação de Propriedade

Arquivo: app/layout.tsx - Metadata API (verification)

mdi-check-decagram Configuração (Google/Bing)

Como obter tokens:

1. Google Search Console → Verificar propriedade → Meta tag

2. Bing Webmaster → Add site → Meta tag

Copie apenas o código (content="...")
Código (Verification Object)
Copiar 
{{ codes.verification }}
 Impacto no Marketing
  • Analytics: Queries, impressões, CTR
  • Indexação: Submeter sitemap
  • Diagnóstico: Erros de crawl
  • Bing: 33% market share
 Estratégia
  • Verifique ANTES de produção
  • Monitore semanalmente
  • Submeta sitemap após verificação
  • Configure alertas para erros
 Exemplo para Campanha

Monitoramento:

// Search Console → URL Inspection
// Monitor queries: "black friday"
// Otimize meta tags baseado em CTR
 Caso de Uso

Cenário: Tráfego caiu 30%

Resultado: Search Console identifica noindex acidental
{{ snackbarText }}