Minha resolução para o desafio de organização do projeto

Solucionado (ver solução)

Solucionado
(ver solução)

2
respostas

Referente ao curso HTML e CSS: ambiente, estrutura e estilo, no capítulo Explorando as tags HTML e atividade Solução do desafio

por Diego de Farias Cardoso

| 14.2k xp | 8 posts

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Tags HTML</title>
</head>
<body>
    <h1>Acesse o conteúdo das aulas através dos links abaixo:</h1>

    <h2>Título:</h2>

    <ul>
        <li>
            <a href="tags/titulos.html" target="_blank">Títulos de H1 a H6</a>
        </li>
    </ul>    

    <h2>Break:</h2>

    <ul>
        <li>
            <a href="tags/break.html" target="_blank">Função do break</a>
        </li>
    </ul>    
    
    <h2>Negrito:</h2>

    <ul>
        <li>
            <a href="tags/negrito.html" target="_blank">Textos em negrito</a>
        </li>
    </ul>

    <h2>Itálico:</h2>

    <ul>
        <li>
            <a href="tags/italico.html" target="_blank">Textos em itálico</a>
        </li>
    </ul>

    <h2>Sup e Sub:</h2>

    <ul>
        <li>
            <a href="tags/sup-sub.html" target="_blank">Função Sup e Sub</a>
        </li>
    </ul>

    <h2>Imagens:</h2>

    <ul>
        <li>
            <a href="tags/imagens.html" target="_blank">Imagens para computador, tablet e celular</a>
        </li>
    </ul>

    <h2>Como fazer com que parte do código vire um comentário:</h2>

    <ul>
        <li>
            <a href="tags/comentario.html" target="_blank">O "//" do JavaScript no HTML</a>
        </li>
    </ul>

    <h2>Listas ordenadas e desordenadas:</h2>

    <ul>
        <li>
            <a href="tags/ol.html" target="_blank">Listas ordenadas</a>
        </li>
        <li>
            <a href="tags/ul.html" target="_blank">Listas desordenadas</a>
        </li>
    </ul>

    <h2>Criando link externo com 'a':</h2>

    <ul>
        <li>
            <a href="tags/link.html" target="_blank">Links da WEB</a>
        </li>
    </ul>

</body>
</html>

2 respostas

solução!

por Lorena Garcia

| 13961.2k xp | 20708 posts

Instrutor

2 dias atrás

Oi, Diego! Parabéns pela conclusão do desafio e pela excelente organização dos seus arquivos.

É muito positivo ver que você não apenas seguiu as instruções, mas também personalizou a estrutura do seu index.html. Ao agrupar os links com subtítulos (H2), você tornou a navegação muito mais clara para quem acessa o seu projeto. Essa atenção à hierarquia visual é um passo importante no aprendizado de Front-end.

Notei alguns pontos muito interessantes na sua resolução:

Organização de pastas: Você utilizou o caminho tags/ nos seus links (ex: tags/titulos.html). Isso demonstra que você já está pensando na organização de diretórios, o que ajuda muito quando o projeto começa a crescer.
Acessibilidade e SEO: Seguir a regra de manter apenas um H1 por página é uma prática excelente. Isso ajuda os motores de busca e os leitores de tela a entenderem qual é o assunto principal daquela página específica.
Curiosidade técnica: Achei sensacional o link sobre "Como fazer com que parte do código vire um comentário", fazendo o paralelo com o JavaScript. Esse tipo de associação ajuda muito a fixar o conhecimento entre diferentes linguagens.

Pra continuar evoluindo, vale dar uma olhada na documentação da MDN sobre Semântica HTML. Nela, você verá como escolher tags que, além de formatar o texto, explicam para o navegador o que aquele conteúdo representa.

Conte com o apoio da comunidade Alura na sua jornada. Abraços e bons estudos!

por Diego de Farias Cardoso

| 14.2k xp | 8 posts

2 dias atrás

Olá, Lorena! Espero que esteja bem.

Muito obrigado pelo feedback e por compartilhar a documentação da MDN.

Tenha um ótimo dia!

Trilhas por carreira

Carreiras de IA

Carreiras de Dados

Carreiras de Cyber

Carreiras de DevOps & Cloud

Carreiras de UX & UI

Carreiras de Mobile & Front-End

Carreiras de Back-End

Carreiras de Negócios

Cursos universitários FIAP

Tópicos relacionados

Conteúdos Alura com o tema