Criar um site profissional sem precisar mexer em código deixou de ser promessa de futuro e virou rotina pra quem está começando agora no digital. O Hostinger Horizons é a ferramenta que possibilita exatamente isso: você descreve o site que quer em linguagem natural, e a IA constrói, hospeda e publica tudo dentro do mesmo ambiente, sem precisar configurar DNS, FTP ou subir arquivo manualmente.
Tem um detalhe importante nesse processo: a qualidade do site que você vai entregar depende quase totalmente da qualidade dos prompts que você passa para a IA. Pedir “um site bonito” gera resultado genérico e consome créditos sem necessidade. Já um prompt bem estruturado, com objetivo, público, identidade visual e seções definidas, entrega um resultado profissional logo na primeira versão e ainda preserva créditos para os refinamentos que vêm depois.
Foi pensando nisso que organizei o passo a passo completo de como criar um site com IA no Hostinger Horizons em um mapa mental sanfona. Cada bloco abaixo representa uma etapa do processo, do entendimento da ferramenta até a publicação com domínio próprio. Em algumas etapas você encontra também prompts prontos, testados, que pode copiar e usar direto no Horizons.
-
O Horizons é a ferramenta da Hostinger que cria sites e web apps a partir de comandos em linguagem natural, com hospedagem, domínio e banco de dados no mesmo ambiente.
- Diferente do fluxo Claude + WordPress, no Horizons o site já nasce hospedado e publicado direto na infraestrutura da Hostinger, sem precisar configurar DNS, FTP ou subir arquivos manualmente.
- Funciona bem para sites institucionais, landing pages, portfólios, sistemas de agendamento, área do cliente, formulários inteligentes e pequenos SaaS de validação.
- Cada interação com a IA consome créditos do plano. Prompts bem estruturados economizam créditos e tempo, gerando resultados mais profissionais logo nas primeiras versões.
- Limitação importante: o Horizons é um ecossistema fechado. A exportação do código completo para outro provedor é limitada, então o ideal é manter o projeto dentro da Hostinger.
-
O Horizons está disponível em planos diferentes da Hostinger, e cada um oferece uma quantidade de créditos de IA por mês para gerar e refinar projetos.
- Plano básico: ideal para testar a ferramenta em um projeto único, com poucos créditos e sem domínio incluso.
- Plano intermediário: já inclui domínio grátis por 1 ano, comandos por voz e por imagem, e chat ilimitado de orientação da IA. É o ponto de partida confortável para a maioria.
- Plano avançado: libera vários sites por conta, mais créditos, editor de código e venda de produtos e assinaturas online. Bom para quem atende vários clientes.
- Após contratar, acesse o hPanel da Hostinger, vá em “Sites” e clique em “Adicionar site com Horizons” para iniciar o projeto.
- Garantia de reembolso de 30 dias para testar com calma antes de se comprometer com o plano escolhido.
-
Aqui está o segredo: não basta pedir “um site bonito”. Quanto mais contexto você passar no primeiro prompt, melhor o resultado e menos créditos você gasta para chegar onde quer.
- Sempre inclua: objetivo do site, público-alvo, descrição do negócio, tom da comunicação, cores e a estrutura das seções que precisa ter.
- Se já tem identidade visual, descreva. Se ainda não tem, deixe o Horizons sugerir uma paleta moderna e refine depois.
Prompt: Site InstitucionalCrie um site institucional moderno, profissional e responsivo, focado em transmitir credibilidade e gerar contato com o cliente. 1. Objetivo do site: [Explique o objetivo do site. Ex: gerar leads via WhatsApp, captar agendamentos, divulgar serviços de um profissional] 2. Público-alvo: [Descreva para quem é o site] 3. Negócio ou profissional: [Explique o que a empresa faz, quais serviços oferece e qual transformação entrega ao cliente] 4. Tom da comunicação: [Ex: moderno, direto, acolhedor, profissional, sofisticado] 5. Identidade visual: Cor principal: [colocar] Cor secundária: [colocar] Cor de fundo: [colocar] Estilo: [minimalista, com fotos, com ilustrações, com gradientes] 6. Estrutura obrigatória das seções: Header com menu e botão de contato Banner principal com headline forte, subtítulo persuasivo e botão de ação Serviços ou áreas de atuação Como funciona o atendimento ou processo Sobre a empresa ou profissional Prova social ou diferenciais Área de contato com botão de WhatsApp Rodapé com informações da empresa Importante: O site deve ser bonito, responsivo (mobile e desktop), fácil de navegar e pensado para converter o visitante em contato. Use blocos visuais bem espaçados, hierarquia clara e elementos modernos como cards, ícones e seções com fundo alternado. -
Cole o prompt inicial e gere a primeira versão. Ela dificilmente vai sair perfeita, mas serve como base sólida para refinar.
- Cada modificação consome créditos. Agrupe vários ajustes em um único prompt em vez de pedir um por vez, assim você preserva créditos para funcionalidades maiores depois.
- Comandos úteis para usar combinados: “deixe mais moderno”, “melhore a copy do banner”, “destaque os botões de ação”, “ajuste o espaçamento das seções”, “melhore a versão mobile”, “reescreva a seção sobre”.
- Quando o site estiver com uma identidade visual boa, peça para a IA congelar o design e focar só nos textos e ajustes finos.
Prompt: Refinar e MelhorarMantenha a estrutura geral que já construímos e aplique todas as melhorias abaixo em uma única atualização para otimizar o uso dos créditos. Visual: – Deixe o design mais moderno e profissional – Melhore o espaçamento, alinhamento e a respiração entre as seções – Destaque visualmente os botões principais de ação – Ajuste a hierarquia tipográfica (títulos, subtítulos e textos) – Garanta contraste adequado entre texto e fundo Copy: – Reescreva a headline principal de forma mais persuasiva e direta – Melhore os textos das seções para serem mais claros – Crie chamadas de ação que gerem clique – Remova excessos e repetições Responsividade: – Garanta que o site fique perfeito no mobile, tablet e desktop – Ajuste tamanhos de fonte, espaçamentos e quebras de linha em cada tela – Verifique se os botões ficam acessíveis ao toque no mobile Importante: Agrupe todas essas mudanças em uma só atualização. Não me peça confirmação a cada item. Aplique tudo de uma vez e me entregue a nova versão pronta. -
O Horizons tem um editor visual de conteúdo que permite ajustar textos, imagens e cores diretamente no site, sem precisar gastar créditos da IA.
- Use o chat com a IA para mudanças estruturais (criar nova seção, mudar layout, adicionar funcionalidade) e o editor visual para ajustes finos de texto, troca de imagem e cor.
- Essa lógica economiza créditos e ainda deixa o cliente final autônomo para fazer pequenas atualizações no próprio site depois da entrega.
- Dica: antes de pedir qualquer ajuste para a IA, pergunte para si mesma: “isso eu não consigo fazer direto no editor visual?”. Se conseguir, faça manualmente.
- Use também os modelos prontos do Horizons como ponto de partida quando o projeto for parecido com algum template já disponível. Acelera muito a primeira versão.
-
O Horizons não constrói apenas sites estáticos. Ele cria web apps completas com login, banco de dados, pagamento online e integrações com APIs externas.
- Funcionalidades comuns que entregam muito valor: agendamento online, área do cliente, checkout, formulário com cálculo automático, sistema de pedidos, painel administrativo, cadastro de leads.
- Para banco de dados mais robusto, conecte o Supabase nas integrações do Horizons. Ele entrega banco PostgreSQL, autenticação e storage de imagens com plano gratuito generoso.
- Para pagamento, o Horizons suporta Stripe e PayPal nativamente. A configuração é guiada e o cliente recebe instruções para conectar a conta.
Prompt: Adicionar FuncionalidadeQuero adicionar uma nova funcionalidade ao meu site. Mantenha exatamente a identidade visual atual e construa essa área de forma integrada com o resto do site. Funcionalidade desejada: [Descreva o que quer. Ex: sistema de agendamento online com horários disponíveis, área do cliente com login, formulário de orçamento com cálculo automático, checkout para venda de produto digital, área de membros, painel administrativo] Requisitos visuais: – O design precisa estar conectado com o restante do site (mesmas cores, tipografia e estilo) – A funcionalidade deve ser fácil de usar mesmo para quem não é familiarizado com tecnologia – Mantenha a responsividade no mobile, tablet e desktop Requisitos técnicos: – Use o banco de dados integrado do Horizons para salvar as informações – Se for área protegida, crie sistema de login com email e senha – Inclua mensagens claras de sucesso e de erro em cada ação – Adicione validações nos campos do formulário – Garanta que os dados sejam salvos com segurança Importante: Antes de gerar o código, descreva em uma frase como ficará o fluxo do usuário. Depois construa tudo em uma única atualização para economizar créditos. -
Antes de publicar, peça uma revisão técnica completa para garantir que o site esteja otimizado para SEO, performance, acessibilidade e segurança, sem perder o design já construído.
- O Horizons já entrega uma base técnica otimizada nativamente, mas vale fazer essa revisão final para sites que vão ranquear no Google ou aparecer em respostas de IA.
- Configure o domínio próprio direto no hPanel da Hostinger. Como tudo está no mesmo ambiente, não precisa mexer em DNS manualmente.
- A publicação é feita em 1 clique. O site já sai no ar com SSL ativo, otimizações de SEO e responsividade aplicadas.
Prompt: Revisão técnica completaMantenha exatamente o layout do site que já construímos e faça uma revisão técnica completa para deixar o site otimizado para SEO, performance, acessibilidade e segurança antes da publicação. Importante: – Não altere o design nem descaracterize a estrutura visual – Preserve a responsividade – Mantenha todas as funcionalidades já criadas – Todos os botões de contato devem direcionar para: [colar link do WhatsApp ou agendamento] SEO: – HTML semântico em toda a estrutura – Apenas um H1 principal – Hierarquia correta de H2, H3 e H4 – Title e meta description otimizados para a palavra-chave principal – Meta robots configurada – Canonical correta – Open Graph e Twitter Card configurados – Alt text estratégico em todas as imagens – Schema markup em JSON-LD adequado para o tipo de negócio (LocalBusiness, ProfessionalService ou Organization) – Estrutura pensada para Google e mecanismos de busca com IA Performance: – Código limpo e enxuto – CSS otimizado – Imagens preparadas para web (compressão e tamanhos corretos) – Lazy loading nas imagens abaixo da dobra – Boas práticas de Core Web Vitals – Carregamento rápido especialmente no mobile Acessibilidade: – Estrutura clara para leitores de tela – Contraste de cores adequado – Botões e links com texto descritivo – Formulários com labels corretas – Navegação por teclado funcionando Segurança: – Formulários protegidos contra spam – Validação de campos – Boas práticas básicas de segurança aplicadasPrompt: Substituir Links e CTAsAgora substitua todos os links dos botões do site pelos seguintes: Botão principal de ação: [colar link] Botão secundário: [colar link] Botão de WhatsApp: [colar link no formato https://wa.me/55XXXXXXXXXXX?text=mensagem-pre-pronta] Botão de contato ou agendamento: [colar link] Email de contato: [colar email] Telefone para clique de chamada: [colar telefone no formato tel:+55XXXXXXXXXXX] Importante: – Links externos devem abrir em nova aba – O link do WhatsApp precisa vir com a mensagem pré-pronta funcionando – Garanta que todos os CTAs estejam consistentes em todas as seções do site -
Esse é o caminho completo, do prompt inicial até o site publicado com domínio próprio. Salve essa sequência para usar como checklist em todo projeto.
- Entender o que é o Horizons e o que ele entrega antes de começar
- Escolher o plano com créditos suficientes para o projeto
- Criar um prompt inicial detalhado com objetivo, público, cores e estrutura das seções
- Gerar a primeira versão e refinar com prompts agrupados para economizar créditos
- Usar o editor visual para ajustes finos de texto, imagem e cor sem gastar créditos
- Adicionar funcionalidades como login, pagamento ou banco de dados quando fizer sentido para o negócio
- Pedir revisão técnica final de SEO, performance, acessibilidade e segurança
- Substituir os links pelos canais reais de contato e conversão
- Publicar o site com domínio próprio em 1 clique direto no hPanel da Hostinger
Esse é o caminho completo que uso quando preciso entregar um site rápido, sem perder qualidade. Pode parecer um processo longo na primeira leitura, mas na prática funciona como um checklist: você passa por cada etapa uma vez e a partir do segundo projeto o fluxo fica natural.
A escolha do plano faz diferença no resultado final. Se você está começando agora e quer testar com calma, o plano intermediário do Horizons é o ponto de partida confortável: já vem com domínio grátis por 1 ano e créditos suficientes para gerar um site institucional completo, com várias rodadas de refinamento. Se você atende vários clientes ou quer construir um SaaS pequeno, o plano avançado libera mais sites, mais créditos e funcionalidades como venda de produtos e assinaturas online.
Se quiser testar o Hostinger Horizons agora, deixei o link com desconto aqui: descomplicandosites.com.br/hostinger. Ele direciona para a oferta atualizada e tem 30 dias de garantia, então você pode experimentar sem risco. Se em um mês o Horizons não fizer sentido para o seu fluxo de trabalho, é só cancelar e receber o valor de volta.
Uma orientação prática antes de fechar: salve este post nos favoritos. Da próxima vez que for criar um site, abra essa página e siga a sequência. Você vai economizar créditos, ganhar tempo e entregar um resultado muito mais profissional desde a primeira versão.
E se ficou com dúvida em alguma etapa específica, me conta nos comentários qual delas está te travando. Respondo um por um para garantir que ninguém fique parado por causa de um detalhe técnico.
