Seguindo a atividade "Simulando a navegação por títulos em HTML", aqui está o resumo da minha atividade:
O tema escolhido foi um Glossário de RPG de mesa, a fim de trazer termos comumente utilizados desse passatempo que gosto.
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Glossário de RPGs de Mesa</title>
</head>
<body>
<h1>Glossário de RPGs de Mesa</h1>
<h2>Termos Comuns</h2>
<p>D&D -> <a href="https://www.dndbeyond.com/" target="_blank">Dungeons & Dragons</a></p>
<p>RPG -> Role-Playing Game</p>
<p>D20 -> Dado de 20 lados e/ou sistema </p>
<h3>Termos de Personagem</h3>
<p>PV -> Pontos de Vida</p>
<p>Spell Slot -> Espaço para conjurar magias</p>
<p>CA - Classe de Armadura</p>
<h4>Termos de Jogo</h4>
<p>Mestre ou Narrador -> Personagem que orienta a narrativa do jogo e interpreta NPCs</p>
<p>Teste -> Ação realizada para determinar o sucesso ou fracasso de uma ação escolhida pelo jogador</p>
<p>NPC -> Personagem não-jogador, controlado pelo mestre</p>
</body>
</html>
Após submeter à revisão da IA, me foi pontuado 2 coisas que realmente fizeram sentido para um melhor entendimendo da minha página:
A hierarquia de Hs estava confusa com “Termos de Jogo” (h4) pertencente a “Termos de Personagem” (h3). Como os termos Mestre, Teste e NPC são conceitos gerais de jogo, a relação não era adequada.
- A sugestão foi padronizar tudo em h2 e eu acatei.
Meu documento declarava
<html lang="en">mas o conteúdo está em português. A IA indicou que isso poderia prejudicar tecnologias assistivas, especialmente leitores de tela, que podem tentar pronunciar o conteúdo usando regras do inglês.- A sugestão foi alterar para
<html lang="pt-BR">e eu acatei.
- A sugestão foi alterar para
Assim, o código da minha página ficou da seguinte maneira
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Glossário de RPGs de Mesa</title>
</head>
<body>
<h1>Glossário de RPGs de Mesa</h1>
<h2>Termos Comuns</h2>
<p>D&D -> <a href="https://www.dndbeyond.com/" target="_blank">Dungeons & Dragons</a></p>
<p>RPG -> Role-Playing Game</p>
<p>D20 -> Dado de 20 lados e/ou sistema </p>
<h2>Termos de Jogo</h2>
<p>Mestre ou Narrador -> Personagem que orienta a narrativa do jogo e interpreta NPCs</p>
<p>Teste -> Ação realizada para determinar o sucesso ou fracasso de uma ação escolhida pelo jogador</p>
<p>NPC -> Personagem não-jogador, controlado pelo mestre</p>
<h2>Termos de Personagem</h2>
<p>PV -> Pontos de Vida</p>
<p>Spell Slot -> Espaço para conjurar magias</p>
<p>CA -> Classe de Armadura</p>
</body>
</html>
Algo que também foi pontuado pela IA foi a tag com link <a href="https://www.dndbeyond.com/" target="_blank">Dungeons & Dragons</a>. A IA pontou que a tag estava escrita de outra maneira, pontuada abaixo:
<a href="[https://www.dndbeyond.com/](https://www.dndbeyond.com/)" target="_blank">
Entretanto, essa formatação foi oriunda do próprio chat com a IA e não do meu código, por isso, relevei já que não se aplicava ao meu conteúdo.
Conte com o apoio da comunidade Alura na sua jornada. Abraços e bons estudos!