Heading Hierarchy
Hierarquia de títulos
Uma hierarquia de títulos usa níveis de título para mostrar como as seções da página se encaixam.
Outro exemplo
Um guia médico usa um h1 para “Gerenciando asma.” Ele usa h2 para diagnóstico e tratamento, depois h3 para tipos de medicamentos. Um leitor de tela segue esse esboço mesmo quando o título de um cartão parece menor.
Partes principais
- 01Cabeçalho da página
- 02Título da seção
- 03Cabeçalho de subseção
Use-o quando
Escolha h1–h6 da estrutura da página. Estilize o tamanho de cada título separadamente.
Não o use quando
Não escolha h1–h6 apenas pelo tamanho da fonte. Não pule um nível apenas para obter um estilo predefinido.
Nome usado no código
h1 through h6 selected by section depth Antes de lançar
Before release, check the page structure, keyboard access, visible focus, contrast, and zoom. Also check loading, empty, error, success, cancel, and reduced-motion states.
Outcome: Complete the task with Hierarquia de títulos (Heading Hierarchy). User context: Um guia médico usa um h1 para “Gerenciando asma.” Ele usa h2 para diagnóstico e tratamento, depois h3 para tipos de medicamentos. Um leitor de tela segue esse esboço mesmo quando o título de um cartão parece menor. Recommended pattern: Hierarquia de títulos (Heading Hierarchy). Why it fits: Escolha h1–h6 da estrutura da página. Estilize o tamanho de cada título separadamente. Do not use it when: Não escolha h1–h6 apenas pelo tamanho da fonte. Não pule um nível apenas para obter um estilo predefinido. Product requirements: Define the default, loading, empty, error, success, and recovery states. Keep user input. Give clear feedback after every action. Accessibility and resilience: Use semantic HTML, full keyboard access, and visible focus. Make the layout work when zoomed and support reduced motion. Follow the project’s current rules. Do not add a new UI library unless the project already uses it. Acceptance criteria: The main task works with keyboard only and at 320px width. Focus and status changes are announced. Check loading, failure, retry, cancel, and reduced-motion paths. Evidence and limits (evidence boundary): O padrão cobre apenas o escopo listado. Ele não escolhe o estilo visual, decisão do produto ou exemplo de Vibulary. Unknowns to confirm: Product wording, data source, analytics events, supported devices and languages, and platform limits.
Conferir este pedido
Review how Hierarquia de títulos (Heading Hierarchy) is used now. Definition: Uma hierarquia de títulos usa níveis de título para mostrar como as seções da página se encaixam. Release checks: Before release, check the page structure, keyboard access, visible focus, contrast, and zoom. Also check loading, empty, error, success, cancel, and reduced-motion states. Before changing code, list the evidence, gaps, severity, and the smallest safe fix.