Guia de Padrões para o Site Akser Brasil

Estrutura, Estilo e Boas Práticas

Este guia define as diretrizes obrigatórias para construção, edição e manutenção de páginas do site AkserBrasil.org. Ele deve ser seguido integralmente por todos os desenvolvedores, editores e colaboradores.

Todas as páginas devem ser estruturadas dentro de um container <section> com largura máxima de 900px, centralização automática e espaçamento interno definido. Nenhuma alteração arbitrária de cor, fonte ou tamanho é permitida.

Verificar se, nas páginas existentes do site, os vídeos já possuem alguma proteção CSS ou overlay para evitar download ou clique direto.

Revisar cada página com vídeo incorporado. Substituir todos os blocos <video> por versões com:
filter: grayscale(100%) (PB), playsinline loop muted autoplay,
e div sobreposta absoluta para bloquear interação (evita “fazer download” via toque longo ou clique com botão direito).

Padrões de Título e Texto

O título principal da página (h1) deve ter 32px, ser centralizado e usar cor #111.
Subtítulos (h2) devem ter 24px, cor #660000, centralizados.
Parágrafos usam fonte sans-serif de 18px, espaçamento entre linhas 1.6, cor #111 e margem inferior de 20px.

Atenção: expressões compostas como “Karatê-Dō”, “Bō-Jutsu”, “Taiki-Ken” ou “Egami-Ryū” jamais devem ser quebradas entre linhas ou separadas por hífens irregulares em títulos. Utilize   ou CSS com white-space: nowrap se necessário.

Grafia Correta: Shōtō-kan

A grafia correta e recomendada para o estilo de Karatê é Shōtō-kan, com hífen e dois macrons (ō e ū). Evite o uso de formas como “Shotokan”, “Shoto-kan” ou “Shotōkan” sem os dois macrons.

• Correta: Shōtō-kan
• Erradas: Shotokan, Shoto-kan, Shōtōkan, Shotō-kan

Como escrever: copie e cole Shōtō-kan diretamente. Ou use o código HTML:

Shōtō-kan
  

Em dispositivos móveis, mantenha pressionado “o” ou “u” para escolher a versão com macron: ō ou ū.

Elementos Visuais e Interativos

Botões devem ter fundo bordô (#660000), texto branco, padding de 12px 24px, sem sublinhado, bordas arredondadas de 6px, fonte de 16px e devem estar sempre centralizados.

Imagens devem estar sempre centralizadas, com margem inferior de 30px, largura máxima de 100%, altura automática e borda arredondada de 10px. Sempre incluir atributo alt descritivo.

Regras de Qualidade e Segurança

O HTML deve estar sempre validado, sem tags mal fechadas.
As páginas devem conter a meta tag <meta name="robots" content="noindex, nofollow"> quando forem restritas e não devem conter links apontando para si. O acesso deve ser apenas por URL direta.

O conteúdo deve ser escrito com clareza, evitando repetições e mantendo fidelidade histórica. Todas as imagens e links devem ser testados.
Links externos devem abrir em nova aba com target="_blank" e rel="noopener noreferrer".

Instrução de Pesquisa e Recuperação de Conteúdo

A recuperação de dados, imagens, textos ou documentos deve ser feita, sempre que possível, utilizando versões arquivadas do antigo site shotokai.com.br, por meio do Wayback Machine (archive.org) ou fontes equivalentes.

Os conteúdos resgatados devem ser adaptados ao novo padrão visual e textual sem perder fidelidade histórica. Toda transcrição ou adaptação deve ser revisada antes da publicação.

Instrução sobre a Linha Bordô de Separação

Sempre que encerrar um bloco de instrução importante ou uma explicação completa — como a finalização de um kata ou a transição entre seções — insira uma linha horizontal bordô para separar visualmente o conteúdo.

<hr style="border: none; height: 2px; background-color: #660000; margin: 24px 0;">
  

Esse recurso deve ser utilizado com parcimônia e apenas quando houver uma divisão lógica clara no conteúdo.

Bloco de Procedimentos (Aplicação Prática)

• Toda nova página deve seguir exatamente o padrão visual e técnico da página de início.
• Caso uma exceção ou variação seja adotada (como formatação diferenciada, novo tipo de bloco ou funcionalidade), isso deverá ser submetido à equipe responsável e, se aprovado, registrado com atualização oficial neste guia.

• Verificar sempre se há espaço em branco indevido antes do título da página. Isso geralmente ocorre por margens superiores em excesso ou elementos ocultos mal posicionados.