Colophon
Ferramentas, tecnologias e decisões usadas neste site.
Ponto de partida
Este site foi construído a partir do 11ty Indie Web Blog Starter, de Brennan Brown. O starter foi escolhido por duas razões principais: já vem integrado com os protocolos IndieWeb (webmentions, microformatos h-card e h-entry, feed Atom) e tem acessibilidade como premissa — HTML semântico, navegação por teclado e compatibilidade com leitores de tela desde o início. A partir daí, o design e as funcionalidades foram completamente reescritos.
11ty Indie Web
Blog Starter
Base do projeto. IndieWeb + acessibilidade como premissa. Por Brennan Brown.
github.com/brennanbrownMargem Viva
no GitHub
Repositório privado do site. Código-fonte versionado no GitHub.
github.com/wagnerbeethovenGeração e templates
O site é gerado com Eleventy 3.0+, um gerador de sites estáticos minimalista em Node.js. A escolha foi deliberada: sem framework de frontend, sem hidratação, sem bundle pesado — apenas HTML gerado no build e servido direto. Os templates são escritos em Nunjucks, que oferece lógica suficiente para layouts, coleções e partials sem virar um projeto separado.
Estilos
O design system é construído sobre CSS custom properties nativas — sem CSS-in-JS, sem Sass, sem variáveis compiladas. O Tailwind CSS entra apenas como utilitário de layout pontual; todo o visual do site (cores, tipografia, temas claro/escuro, componentes) vive em tailwind.css, o arquivo fonte que o Tailwind CLI processa. A tipografia usa Inter via Google Fonts, e a iconografia é toda do Font Awesome 7.0 via CDN.
Versionamento e publicação
O código-fonte fica num repositório privado no GitHub. O build (npm run build) é gerado localmente e publicado num branch dist só com o site pronto. Na Hostinger, um cron job puxa esse branch periodicamente e atualiza o site — a hospedagem não roda Node, só serve os arquivos estáticos e os endpoints PHP dos formulários.
IndieWeb e feeds
Este site segue princípios IndieWeb: o conteúdo vive aqui, não em plataformas de terceiros. Todas as páginas relevantes marcam microformatos h-card e h-entry para interoperabilidade com agregadores e leitores. As webmentions são processadas via webmention.io. O site publica quatro formatos de feed cobrindo posts, notas, poesias e receitas — compatíveis com a maioria dos leitores RSS.
Automações de conteúdo
Parte do conteúdo é sincronizada por scripts locais antes de cada publicação. O comando npm run publish consulta as APIs, cria ou atualiza os arquivos de conteúdo, registra mudanças na branch principal, gera o build e publica o branch dist. O cron da Hostinger coloca essa versão no ar.
Bluesky
Notas
Posts do Bluesky são importados como notas em /notes/ durante a publicação.
Pixelfed
Fotos
Fotos publicadas no Pixelfed são sincronizadas em /photos/ durante a publicação.
Analytics
O site usa GoatCounter para análise de tráfego — sem cookies, sem rastreamento de dados pessoais, sem fingerprinting. Os dados são agregados e anônimos. As estatísticas são públicas.
Licença e autoria
Os textos, fotos e conteúdos editoriais deste site são licenciados sob Creative Commons BY-NC-SA 4.0 — você pode compartilhar e adaptar o conteúdo, desde que dê crédito, não use para fins comerciais e distribua sob a mesma licença. O site foi desenvolvido com assistência do Claude Code (Anthropic).
Última atualização: