Web Design

Desenvolvedor Web SEO - Site Completo HTML/CSS/JS

Name: Desenvolvedor Web SEO - Site Completo HTML/CSS/JS
Author: Claude Directory

Claude Directory December 6, 2025

0 copies 0 likes

Gera um site completo em HTML/CSS/JS responsivo e otimizado para SEO, com páginas essenciais, performance top e funcionalidades prontas. Ideal para PMEs lançarem online rápido e rankearem no Google. (

Prompt

Você é um desenvolvedor web sênior especializado em SEO com +15 anos de experiência. Crie um site completo e profissional para [NOME DA EMPRESA], uma [DESCRIÇÃO BREVE DA EMPRESA]. O site deve ser 100% responsivo, otimizado para SEO, rápido e pronto para produção.

**PÁGINAS OBRIGATÓRIAS:**
- Home
- Sobre
- Serviços
- Portfólio/Galeria
- Contato
- Blog (com pelo menos 3 artigos otimizados SEO)

**OTIMIZAÇÕES SEO OBRIGATÓRIAS:**
• Title + Meta Description únicos por página com [PALAVRA-CHAVE PRINCIPAL] e [PALAVRAS-CHAVE SECUNDÁRIAS]
• Headings H1-H6 hierárquicos
• Alt text em TODAS imagens
• Schema.org JSON-LD (LocalBusiness, FAQ, etc.)
• Canonical + robots meta
• Internal links estratégicos
• Sitemap.xml básico
• robots.txt
• URLs amigáveis (use # para single page ou páginas separadas)

**DESIGN & UX:**
• Mobile-first, responsivo (mobile/tablet/desktop)
• Paleta de cores: [CORES PRINCIPAL, SECUNDÁRIA, ACENTO]
• Google Fonts modernas
• Ícones FontAwesome ou SVG
• Animações CSS suaves
• Dark mode toggle (bonus)

**PERFORMANCE:**
• CSS/JS minificados
• Lazy loading imagens
• Critical CSS inline no <head>
• WebP para imagens
• Service Worker PWA básico

**FUNCIONALIDADES:**
• Navbar sticky + mobile hamburger
• Hero section com CTA
• Formulário contato (integre EmailJS ou Formspree)
• Galeria lightbox
• Scroll suave + back to top
• Testimonials slider
• Blog com categorias

**TECNOLOGIAS:** HTML5 semântico, CSS3 Flex/Grid, Vanilla JS (sem frameworks), acessível WCAG 2.1

**ESTRUTURA DE SAÍDA:** Gere arquivos separados:
=== index.html === (Home)
=== sobre.html ===
=== servicos.html ===
=== portfolio.html ===
=== contato.html ===
=== blog.html ===
=== css/style.min.css ===
=== js/script.min.js ===
=== sitemap.xml ===
=== robots.txt ===

Inclua todas imagens em base64 ou placeholders Unsplash. Foque em [PALAVRA-CHAVE PRINCIPAL] naturalmente.

How to Use

1. Copie o prompt completo do campo 'content' acima. 2. Cole em Claude, ChatGPT ou similar AI. 3. Substitua placeholders: [NOME DA EMPRESA], [DESCRIÇÃO BREVE DA EMPRESA], [PALAVRA-CHAVE PRINCIPAL], [PALAVRAS-CHAVE SECUNDÁRIAS], [CORES PRINCIPAL, SECUNDÁRIA, ACENTO]. 4. Adicione detalhes específicos como serviços, depoimentos ou conteúdo do blog. 5. Execute o prompt e aguarde a geração dos arquivos. 6. Salve cada seção (=== arquivo ===) em arquivos separados. 7. Abra index.html no navegador para testar responsividade. 8. Hospede gratuitamente no Netlify, Vercel ou GitHub Pages.

Comments

More Prompts

View all

Research

ChatGPT Web Browsing Research Agent

Structured web research using ChatGPT's browsing capability. Systematic source evaluation, fact-checking, and synthesis with proper citations.

Community

Development

ChatGPT API Integration Blueprint

Design production-ready ChatGPT API integrations. Covers authentication, streaming, function calling, structured outputs, and cost optimization with the latest OpenAI SDK.

Community

Data Analysis

Advanced Data Analysis with Code Interpreter

Step-by-step data analysis pipeline using ChatGPT's Code Interpreter. Upload CSV/Excel files for cleaning, visualization, statistical analysis, and insights.

Community

Productivity

ChatGPT Memory & Personalization Optimizer

Optimize ChatGPT's memory feature for persistent context. Teaches how to structure memories, manage what's stored, and leverage personalization effectively.

Community

Creative

DALL-E 3 Prompt Engineering Master

Generate precise, creative DALL-E 3 prompts. Handles style specifications, aspect ratios, composition rules, and iterative refinement for stunning AI-generated images.

Community

Productivity

ChatGPT Canvas Collaborative Editor

Leverage ChatGPT Canvas mode for iterative document editing, code review, and collaborative writing with inline suggestions and tracked changes.

Community