Componente Título
O bloco Título introduz secções e estabelece a hierarquia visual da página, incluindo títulos principais, de secção e subtítulos. Ele orienta o utilizador e organiza o layout.
Informações gerais
O bloco Título introduz secções e estabelece a hierarquia visual da página, incluindo títulos principais, de secção e subtítulos. Ele orienta o utilizador, cria ritmo visual e ajuda a organizar a leitura ao longo da página.
Exemplos visuais do bloco
Variações de layout e composição
O bloco Título pode assumir diferentes composições visuais, mantendo sempre a mesma função principal: introduzir secções e reforçar a hierarquia da página. Os exemplos abaixo ajudam a perceber como este componente se adapta a contextos mais editoriais, mais funcionais ou com maior destaque gráfico.
Como usar na prática
Estrutura e preenchimento
Escreva o título no editor
- No campo de títulos, insira o texto e aplique apenas a formatação essencial.
- Coloque apenas uma ideia por título.
- Prefira títulos entre 3 e 8 palavras.
- Evite títulos que ocupem mais de duas linhas em dispositivos móveis.
Defina a hierarquia
- Use o menu de Estilos do editor para manter consistência entre títulos de secção e subtítulos.
- Evite misturar manualmente tamanhos ou fontes.
- Se precisar explicar algo, use logo abaixo um bloco Texto com um ou dois parágrafos curtos.
Boas práticas de conteúdo
Como manter a componente clara
Clareza
- Títulos curtos e claros funcionam melhor do que títulos longos e demasiado “poéticos”.
- Se o título precisa de muita pontuação para fazer sentido, provavelmente está a tentar dizer duas coisas ao mesmo tempo.
- Mantenha o mesmo tom em toda a página.
Ritmo
- Em páginas longas, use títulos para criar capítulos e evitar scroll sem referência.
- Use o bloco Título para a mensagem principal e deixe o contexto para o bloco Texto logo abaixo.
Configurações avançadas
Imagem + resumo das opções
Imagem de referência das configurações avançadas do componente Título.
Configurações gerais
- Skin seleciona uma variante visual do título.
- Disabled block desativa o bloco sem removê-lo.
- Offset aplica um deslocamento no posicionamento.
- Underlined ativa ou define o estilo de sublinhado do título.
Identificação e espaçamentos
- Block ID cria âncoras e navegação interna.
- Extra Class permite ajustes específicos quando há convenção da equipa.
- Margin controla o espaço externo do bloco.
- Padding controla o espaço interno, sobretudo útil quando existe fundo.
Animação e editor
- Animation on/off ativa ou desativa a animação ao entrar na viewport.
- Scroll animation type define o tipo de animação disponível no tema.
- No editor, dá preferência ao uso de estilos, usa negrito com moderação e evita quebras de linha manuais.
Demo e downloads
Exemplos e configurações