Colofão

O processo

Nada aqui foi planejado como site. Começou com uma pergunta sobre frameworks, virou um glossário, o glossário virou uma página, a página virou trilha, e as trilhas viraram isto. A estrutura foi aparecendo conforme o assunto pedia — o que é, por sinal, o oposto do que a trilha de Landing pages recomenda, e funcionou aqui justamente porque não havia cliente, prazo nem objeção a derrubar.

O método que se repetiu em cada trilha foi o mesmo descrito na trilha de IA: primeiro o esqueleto com as partes e o que cada uma responderia, depois o preenchimento seção por seção, e no fim uma passada de revisão separada. Os textos saíram em blocos, nunca de uma vez — pelo motivo técnico explicado lá: página inteira numa resposta só estoura o limite e volta truncada.

O que a máquina fez

Escreveu o texto, organizou a estrutura, montou o HTML e o CSS, gerou as páginas por script, conferiu o resultado no navegador, empacotou os arquivos e configurou o deploy. Também discordou algumas vezes — sobre esconder o gerador atrás de senha, sobre inventar fotos de banco de imagem, sobre publicar número que ninguém tinha confirmado.

O que a máquina não fez

Não decidiu o que entra. Não trouxe o contexto — os clientes reais, o que dá errado na prática, o que o mercado de Campo Grande pede. Não julgou o que é verdade. Não assumiu responsabilidade por nada do que está publicado aqui.

Isso não é modéstia protocolar: é o argumento central da Parte 7 da trilha de IA. Quem publica responde. A ferramenta produz volume e consistência; o julgamento, o contexto e a assinatura continuam sendo de quem escolhe apertar o botão.

Feito com

O site inteiro são dezesseis arquivos HTML, uma folha de estilo e sete scripts de comportamento — mais dois arquivos de dados gerados por script (o índice da busca e o mapa de progresso, nenhum dos dois editado à mão), os ícones, o sitemap.xml e o robots.txt. Abre sem servidor, funciona offline depois de carregado, e não tem uma linha de código que dependa de alguém manter um pacote atualizado — nem a IA, que fala com o Google direto, sem biblioteca. Esse número muda toda vez que o site cresce — é por isso que ele está descrito em prosa e não como uma estatística fixa em algum lugar.

O que o site não fazia

Em setembro de 2026, com as dez trilhas prontas, veio a pergunta óbvia: o site cumpre o que ele próprio ensina? A auditoria — feita com a checklist da trilha de Qualidade e com os critérios da de Tráfego — encontrou sete falhas. Não havia sitemap.xml nem robots.txt, que a trilha de Tráfego tem um tópico inteiro explicando. Não havia favicon nem imagem de compartilhamento: o link colado no WhatsApp saía sem miniatura, exatamente o erro que a trilha de Qualidade manda testar antes de entregar. Faltava o link de pular para o conteúdo, cujo CSS está escrito na mesma trilha. Faltava página 404, que está na checklist de entrega. E faltava canonical em dez das doze páginas.

Tudo isso foi corrigido no mesmo dia em que foi encontrado. Fica registrado aqui de propósito, e não apagado: a distância entre o que se sabe e o que se faz é o assunto real deste site. Ela não some porque o material ficou bom — ela some quando alguém roda a checklist. Foi preciso rodar a checklist no próprio site para descobrir sete itens que qualquer uma das trilhas apontaria em trinta segundos num site de cliente.

Uma exceção continua de pé, agora por escolha declarada: as fontes seguem vindo do Google, e não hospedadas aqui. A trilha de Qualidade diz para considerar hospedar — pelo desempenho e pelo IP que o Google registra. Para um site de estudo sem visitante para proteger, a conveniência ganhou. Num site de cliente com aviso de cookies, a resposta seria outra, e é assim que essa decisão deve ser tomada: caso a caso, e dita em voz alta.

A trilha de referência e a divisão Estudar/Trabalhar

O material sobre animação nasceu direto na trilha de Movimento, junto com o resto do conteúdo sobre Motion e GSAP. Com o tempo ficou claro que Motion merecia outra coisa: não uma trilha para ler do início ao fim, mas uma referência para procurar uma função pontual no meio de um projeto — o mesmo tipo de página que a própria motion.dev oferece, com um índice categorizado à esquerda e a seção atual sempre visível à direita. Foi assim que nasceu Referência: Motion, com a API inteira em português. A trilha de Movimento foi então enxugada: as duas partes que repetiam Motion viraram uma única parte de decisão — o essencial em poucas linhas, com um link para a referência completa — mantendo intacto tudo o que era exclusivo de GSAP.

Separado disso, veio a pergunta de quem usa o site no dia a dia: o material de estudo e as ferramentas de trabalho são coisas diferentes, e misturá-las numa trilha só confundia as duas. A resposta foi consolidar o que já existia espalhado — a checklist de entrega da trilha de Qualidade, o roteiro de dez perguntas do briefing na trilha de Negócio, a matemática de contraste do laboratório visual, o conceito de UTM da trilha de Tráfego e a fórmula de precificação — em Ferramentas: ferramentas que rodam inteiramente no navegador, sem enviar nada para lugar nenhum, com estado salvo por cliente no próprio aparelho. A home e o menu ganharam a divisão explícita entre trilhas para estudar e ferramentas para usar durante o trabalho. A lista cresceu depois: a proposta que fecha e o inventário de acessos, ambos de Negócio, viraram ferramenta pelo mesmo critério das primeiras seis — texto que se redigita ou recalcula em todo projeto, não decisão que muda de cliente para cliente.

Com quatrocentos e tantos tópicos espalhados por dezesseis páginas, achar algo específico só pela navegação lateral deixou de ser realista. A busca global (o ícone de lupa no cabeçalho, ou a tecla /) resolve isso: um índice é gerado por script a partir do conteúdo real de cada página e só é carregado na primeira vez que alguém abre a busca, para não pesar o carregamento normal de quem nunca usa.

A própria trilha de HTML puro virou um exemplo do que a trilha de Qualidade ensina sobre peso de página: sessenta e seis tópicos numa página só passavam de 160 KB e deixavam o sumário do celular enorme. Ela foi dividida em duas páginas — parte 1, dos fundamentos ao CSS moderno, e parte 2, dos recursos nativos sem JavaScript até o glossário —, ligadas pela navegação de anterior/próxima no fim de cada uma. Continua sendo uma trilha só: um card na home, uma entrada no menu, o progresso contado junto. O que mudou foi só o tamanho de cada carregamento.

As regras que viraram ponto de partida

Até o fim de setembro de 2026 o site se obrigava a cinco regras: nenhum framework nem etapa de build, o Google Fonts como única dependência de fora, JavaScript que confere se o elemento existe antes de mexer nele, o armazenamento local sempre protegido contra erro, e nada saindo do navegador de quem usa. Elas eram o argumento do site — ensinar a não depender de pacote que envelhece, e não depender de nenhum.

Em 29 de setembro elas foram revogadas. Tinham cumprido o papel de provar que dá para ir longe só com o que o navegador oferece, e passaram a impedir coisas que o site quer fazer — como uma IA que responda dúvidas sobre o próprio conteúdo, o que exige um servidor guardando a chave de acesso. O que está publicado continua escrito do mesmo jeito, e as ferramentas continuam sem enviar nada. Quando isso mudar, a frase que disser o contrário muda junto, no mesmo dia. A primeira mudança veio logo: o botão redondo no canto de toda página manda a pergunta — e o print, se houver — para o Gemini, do Google, e diz isso no próprio painel antes de a pessoa escrever — inclusive que, no plano gratuito, o Google pode usar o que recebe. Uma regra pode deixar de existir; o que o site afirma sobre si mesmo continua precisando ser verdade.

O erro da hospedagem gratuita

Até 29 de setembro de 2026, três trechos do site diziam que o plano gratuito da Vercel cobria "com folga" um site de cliente. Não cobre: os termos da Vercel restringem o plano gratuito a uso pessoal e não comercial, e citam como comercial receber pagamento para criar, atualizar ou hospedar o site. O erro apareceu ao ler, na fonte, o que sustenta uma promessa de "99,9% no ar" que uma agência fazia na própria página. A trilha de Hospedagem ganhou a coluna do que cada plano gratuito permite, o Back-end foi corrigido, e o que fazer com a mensalidade virou o tópico A mensalidade: o que ela compra. Fica registrado aqui pelo mesmo motivo dos outros: o que se repete sem conferir é o erro mais fácil de ensinar.

Uso

O conteúdo é aberto. Se serviu para alguém estudar, ensinar, ou copiar um trecho para explicar algo a um cliente, cumpriu o que devia. O código está no repositório e pode ser lido, copiado e adaptado.

O que se pede em troca é o que a trilha de IA defende: não publicar como seu o que você não revisou, e não apresentar como verdade o que não conferiu.

Agradecimento

Ao Claude, pela conversa — pela paciência com as perguntas fora de ordem, pelas discordâncias quando eu estava errado, e por transformar um dia de dúvidas soltas em material que outras pessoas podem usar.

Gustavo · Campo Grande, setembro de 2026