Site institucional gerado por IA: os bastidores do WebSir

Criei um gerador de sites institucionais por IA. Este relato técnico explica porque construí o WebSir, como funciona o pipeline de geração do WebForge e porque é que HTML estático servido na edge bate em Core Web Vitals um site feito à mão. Com um código de desconto no fim.

Criei um gerador de sites institucionais por IA: eis o que acontece mesmo por baixo do capô

Estou na origem do WebSir (websir.fr), uma plataforma SaaS que gera um site institucional completo, publicado e acessível em menos de 30 minutos a partir de um briefing em linguagem natural. Este artigo é um relato técnico: porque construí esta ferramenta, como funciona o pipeline de geração e porque é que um site institucional gerado por IA pode bater em Web Vitals um site feito à mão no Webflow. Bónus no fim: um código de desconto de 20 %.

Landing page do WebSir, o utilizador descreve o seu projeto em francês ao assistente conversacional e a geração arranca. Texto alternativo sugerido: «Página inicial do WebSir com a interface de chat para criar um site institucional em conversa com uma IA».

Porquê mais um gerador de sites institucionais por IA?

Como programador, vi passar o mesmo pedido durante anos junto de artesãos, freelancers e microempresas: «só quero um site simples, que carregue depressa, onde possa mudar um número de telefone sem ter de ligar a alguém». A resposta da indústria foi WordPress mais um tema ElementorClick ou, mais recentemente, Wix, Webflow e afins. Nos dois casos o problema é o mesmo: a stack é pesada, o DOM renderizado do lado do cliente é obeso e a mais pequena alteração editorial obriga a navegar numa interface visual com a complexidade de um Photoshop low-cost.

Quando os LLM ficaram bons o suficiente a produzir HTML e CSS estruturados, quis pegar no problema ao contrário: em vez de ensinar o utilizador a manobrar um builder, pedir-lhe que descreva em francês o que quer. E, por trás, não gerar mais um site WordPress, mas HTML estático puro, servido a partir da edge, sem framework JavaScript do lado do cliente. Foi isso que me levou ao WebSir.

O percurso do utilizador, visto de fora

O utilizador regista-se (e-mail mais palavra-passe, Google, Facebook ou Apple), escreve uma frase do género «sou osteopata em Lyon, quero um site sóbrio, mais para o verde-salva, com uma página de apresentação, uma página de preços, uma página de contacto e uma página de menções legais» e o chat conversacional trata do resto. O agente recolhe precisões (cores, tom, setor, estrutura pretendida) e depois lança a geração. O progresso chega em streaming, em tempo real: o utilizador vê a IA a trabalhar por etapas sucessivas, estrutura, conteúdo, design, código, assets, validação, sem ter de adivinhar o que se passa dentro da caixa negra.

Ao fim de alguns minutos, o site está pronto a pré-visualizar. O utilizador pode então pedir alterações (sempre por chat, nunca um editor visual imposto) e ajustar as imagens, as cores e a árvore de páginas. Quando está satisfeito, entra num funil de publicação em 5 etapas: SEO, domínio, social, pagamento, contacto. E só na etapa de pagamento é que o Stripe entra em cena: gerar um site completo é totalmente gratuito, só a publicação efetiva desencadeia a faturação. Modelo freemium radical e assumido: se a IA não conseguir produzir um site que agrade, o utilizador não gastou nada.

Por baixo do capô: o WebForge, o motor de geração

É aqui que a coisa fica interessante para os programadores. O WebForge é um binário Node.js / TypeScript independente que concebi especificamente para este caso de uso. Orquestra toda a geração do site: análise do briefing, escrita do conteúdo, escolha do design, montagem do código, otimização dos assets e validação final. Tudo é conduzido internamente e o progresso é exposto em tempo real à aplicação web, de modo que o utilizador nunca fica parado à frente de uma ampulheta muda.

Vista do editor do WebSir durante uma geração: a coluna da esquerda mostra em tempo real as fases do WebForge (escrita do código, validação do template, QA) e o painel central mostra o site a ser montado. Texto alternativo sugerido: «Editor WebSir a mostrar em tempo real as fases de geração do WebForge e a pré-visualização do site institucional a ser criado pela IA».

Várias fases visíveis durante a geração

Em vez de pedir a uma única chamada monolítica que produza um site completo (receita clássica para um resultado dececionante), o WebForge encadeia várias fases especializadas. Vês essas fases a desfilar literalmente no painel da esquerda enquanto o site é gerado.

Uma parte destas fases é conduzida pela IA, as que exigem juízo criativo ou redatorial (enquadrar o projeto, escrever o conteúdo, escolher o design, produzir o código). Outras fases são inteiramente determinísticas, sem uma única chamada a um LLM: tratam do build, da validação e da autocorreção. São elas que apanham os erros típicos de uma geração por IA, uma classe CSS inexistente, um slot esquecido, uma paleta de cores incoerente, um ritmo de página que empilha duas vezes a mesma secção.

O resultado desta divisão é simples: a criatividade fica para a IA, o rigor fica para código testado. É essa a chave para entregar um site institucional gerado por IA que não alucina e que sai do pipeline com um nível de qualidade reproduzível, em vez de à sorte.

Uma caixa de ferramentas própria para o agente

O agente de IA não escreve o site «à mão», em modo de completação bruta. Dispõe de uma caixa de ferramentas tipada que defini especificamente para a produção de sites institucionais: leitura, escrita e edição de ficheiros, instanciação de componentes a partir de uma biblioteca interna, validação de templates e toda uma bateria de ferramentas de imagem (geração de ilustrações, geração de logótipo, geração de favicon, edição de imagem, remoção de fundo).

O agente escolhe sozinho as ferramentas pertinentes em função da fase em curso, e um subconjunto de ferramentas fica restringido conforme o contexto, por exemplo, não queremos que uma fase de revisão crítica se ponha a reescrever código às escondidas. É esta disciplina de ferramentas que separa uma demo de Twitter de um produto que aguenta em produção.

Depois de o site estar gerado, o utilizador pode obviamente continuar a dialogar com a IA por chat, mas pode também clicar diretamente em qualquer bloco da página para o alterar em contexto: mudar um título, ajustar uma call to action, substituir uma imagem. O editor mantém o conhecimento da estrutura (hero, serviços, testemunhos, footer…) e propõe as alterações adequadas ao tipo de bloco selecionado.

Seleção visual direta de um bloco «hero» num site gerado: o utilizador clica na zona a alterar e o editor aplica a mudança sem partir a estrutura. Texto alternativo sugerido: «Edição em contexto de um bloco hero num site institucional gerado por IA no editor WebSir».

Porquê HTML estático em 2026?

Muitas plataformas equivalentes produzem uma aplicação JavaScript monstruosa (o Wix carrega facilmente 2 a 3 MB de JS na primeira página). O WebSir faz o inverso radical: os sites gerados são HTML / CSS / Vanilla JS ES2022+. Zero frameworks do lado do cliente. Zero React, zero Vue, zero Alpine.js, zero jQuery. A regra é aplicada pelo CI: um script bloqueia qualquer merge que reintroduza uma dependência proibida.

Consequências mensuráveis:

  • LCP mínimo, sem hidratação, sem bundle JS para interpretar antes de mostrar o conteúdo
  • FID imediato, pouco JavaScript na main thread
  • Bundle leve, alguns kilobytes de JS para as interações (menu mobile, acordeões), e nada mais
  • Acessibilidade natural, sem DOM virtual, o HTML é legível tal como está pelos leitores de ecrã e pelos crawlers de SEO
  • Robustez, um site que continua a funcionar na perfeição mesmo com o JS desativado

Do lado da infraestrutura, o site é servido através de uma rede de distribuição mundial (edge CDN). Na prática, cada página é servida no ponto de presença mais próximo do visitante, esteja ele onde estiver. Sem servidor aplicacional para escalar, sem cache para invalidar à mão: o upload, a injeção das meta tags, a configuração de DNS e a purga da cache estão totalmente automatizados a cada nova publicação. Os domínios personalizados gerem-se em poucos cliques, com certificado SSL automático.

O sistema de variáveis tipadas: um passo à frente no RGPD

É provavelmente a parte de que mais me orgulho tecnicamente, e aquela que as outras plataformas não fazem. Qualquer dado público recorrente de um site, número de telefone, e-mail, morada, SIRET, nome do alojador, ano em curso, passa por uma etiqueta <var data-key="…"> ou por um atributo data-bind-{attr}="key".

O LLM nunca vê o valor real. O WebForge recebe apenas as chaves e os metadados (label, tipo, obrigatório ou não). A substituição real acontece a seguir, no momento da publicação, através de um motor de renderização que injeta os valores mesmo antes de o site ir para o ar.

Benefícios concretos: os dados pessoais reais não passam por um fornecedor de IA terceiro, é possível alterar um número de telefone em todo o site numa única operação e é possível ativar uma flag «dado sensível» que desencadeia uma cifra adicional nas variáveis que não se destinam à publicação. Para quem tenta gerar um site institucional profissional por IA sem sair da conformidade com o RGPD, esta separação entre conteúdo e dados é determinante.

Segurança e higiene operacional

Alguns detalhes que contam num blogue de programador:

  • 2FA TOTP obrigatório
  • Anti-brute-force em dois níveis: 5 tentativas falhadas bloqueiam a conta durante 15 minutos
  • Formulários de contacto protegidos por várias camadas de segurança, entre elas honeypot, tempo mínimo de preenchimento, recusa dos domínios descartáveis, verificação MX e Turnstile, 100 % automatizado
  • Upload de ficheiros nos formulários: whitelist MIME, tamanho máximo por submissão, ClamAV do lado do servidor

Porque é que um site gerado por IA pode bater um site feito à mão

O argumento intuitivo é: «um humano faz sempre melhor do que uma máquina na parte criativa». Ainda é parcialmente verdade no design, mas é cada vez menos verdade na performance técnica, que é o verdadeiro terreno de jogo do SEO moderno.

Um freelancer que entrega um site Webflow ou um tema WordPress remendado tem poucas hipóteses de bater, nos Core Web Vitals, um pipeline concebido de raiz para gerar HTML estático otimizado, validado por uma bateria de verificações determinísticas e publicado numa edge mundial. Junta a isto:

  • Etiquetas Schema.org injetadas sistematicamente em cada página (LocalBusiness, Article, BreadcrumbList conforme o contexto)
  • Um sitemap.xml gerado e submetido automaticamente
  • Meta tags Open Graph e Twitter Cards configuradas na etapa «Social» do funil
  • Uma analytics nativa integrada, sem SDK externo para carregar
  • Imagens servidas em WebP ou AVIF quando o navegador o suporta

…e obténs um site que, sem esforço adicional, já cumpre as principais recomendações do Google Page Experience. Quando um crawler chega, encontra HTML legível, não um esqueleto React por hidratar. Quando um visitante clica, a página aparece em algumas centenas de milissegundos a partir do ponto de presença mais próximo.

Auditoria Google Lighthouse de um site institucional gerado pelo WebSir: 100/100 em Desempenho, Acessibilidade, Boas práticas e SEO. Sem qualquer otimização manual, a pontuação sai da própria fase de geração. Texto alternativo sugerido: «Pontuação Google Lighthouse 100/100/100/100 num site institucional gerado pela IA do WebSir, medida em Desempenho, Acessibilidade, Boas práticas e SEO».

Preços e código promocional (a parte que estavas à espera)

A oferta ativa chama-se simplesmente Site vitrine. 39,90 € sem IVA por mês, com uma opção anual a 430,92 € sem IVA por ano que poupa 10 %. Estão incluídos:

  • Até 20 páginas, menções legais e política de privacidade incluídas
  • Um domínio personalizado ou um subdomínio em *.websir.fr
  • O certificado SSL gerido automaticamente
  • Uma CDN mundial na edge
  • Uma analytics nativa sem banner de cookies para mostrar
  • Formulários de contacto ilimitados, com upload de ficheiros e antispam
  • As alterações ilimitadas por chat (a IA continua acessível depois da publicação)
  • O suporte por e-mail

E eis a parte que me levou a escrever este artigo hoje: para os leitores deste blogue, criei um código de desconto de 20 % na primeira subscrição.

Código promocional: SITE20
20 % de desconto, a introduzir na etapa Checkout do funil de publicação.

Lembra-te: a geração do site é gratuita. Podes criar uma conta, dar o briefing à IA, ver o resultado completo, pedir todas as alterações que quiseres e usar o código SITE20 só no momento em que decides mesmo pôr o site online. Se o resultado não te agradar, não gastaste nada.

O que (ainda) não existe no WebSir

Por honestidade intelectual, eis o que hoje não existe. As ofertas site dinâmico e e-commerce estão previstas mas ainda não estão disponíveis. A tecnologia alvo ainda não está decidida, já sei o que não vou usar (nem WordPress, nem PrestaShop, nem Shopify), mas ainda não sei com o que vou ficar. Se precisas de uma loja online ou de um back-office de gestão já hoje, o WebSir não será a resposta certa, prefiro dizer-to antes de introduzires o cartão e não depois.

Do mesmo modo, o WebSir aponta prioritariamente ao mercado francófono. O conteúdo gerado é em francês por predefinição, as páginas legais seguem o direito francês e o agente conversacional percebe melhor os briefings em francês do que noutras línguas. O suporte multilingue chegará, mas não é a prioridade do momento.

Conclusão: o que isto muda para um programador

Se és programador e os teus amigos não técnicos ainda te pedem «não me arranjas aí um sitezito», sabes bem como este pedido se torna penoso de satisfazer de graça. Recomendar o WebSir para a necessidade «site institucional profissional depressa online, com domínio e formulários de contacto que funcionam» liberta-te o fim de semana. E se és freelancer e aceitas trabalhos de sites institucionais em subcontratação, podes usar o WebSir como acelerador: deixa a IA produzir a base e fatura o tempo de personalização ao teu cliente final.

O código SITE20 continua válido para todos os leitores deste blogue. Vai a websir.fr, cria uma conta, descreve o que queres e vê o pipeline a trabalhar. Se quiseres aprofundar a parte técnica, o WebForge merece provavelmente um artigo dedicado, diz-me nos comentários e detalho o sistema de templates e o mecanismo de autocorreção num próximo post.

Artigo escrito pelo criador do WebSir, para os programadores que querem perceber o que se passa realmente quando se gera um site institucional por IA em 2026.

Damien Flandrin Programador web desde 2010, criador da Gekkode e do Email Impact. Cada artigo é testado num projeto real antes de ser publicado. Contacto
Newsletter

Os novos testes, tutoriais e projetos, por e-mail.

Testes reproduzíveis, código versionado, resultados datados. Nunca spam.