1) Construindo a estrutura básica do HTML ``` <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="wi

muito bom jovem . além de praticar os código esta praticando o latim . sucesso para você bons estudo

mão na massa | HTML e CSS: ambientes de desenvolvimento, estrutura de arquivos e tags

Construindo a estrutura básica do HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Atividade html</title>
</head>
<body>
    
</body>
</html>

Adicionando conteúdo ao HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Atividade MaoNaMass</title>
</head>
<body>
    <h1>Título recomendado </h1>
    <p>Meu primeiro parágrafo</p>
</body>
</html>

Trabalhando com meta tags e título

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> //meta tag adicionada
    <title>Atividade MaoNaMass</title>
</head>
<body>
    <h1>Título recomendado </h1>
    <p>Meu primeiro parágrafo</p>
</body>
</html>

Organizando conteúdo com tags HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Atividade MaoNaMass</title>
</head>
<body>
    <h1>Título recomendado </h1>
    <h2>Um bom título para começar</h2>
    <p>
        Lorem ipsum dolor sit amet consectetur adipisicing elit. Odio doloribus, velit laudantium magnam earum dignissimos quas dolor assumenda fugiat incidunt quidem facilis expedita! Numquam, cupiditate vel sapiente quo totam incidunt?
    </p>
</body>
</html>

Adicionando imagens com acessibilidade

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Atividade MaoNaMass</title>
</head>
<body>
    <h1>Título recomendado </h1>
    <h2>Um bom título para começar</h2>
    <p>
        Lorem ipsum dolor sit amet consectetur adipisicing elit. Odio doloribus, velit laudantium magnam earum dignissimos quas dolor assumenda fugiat incidunt quidem facilis expedita! Numquam, cupiditate vel sapiente quo totam incidunt?
        <img src="html.png" alt="logo html5">
    </p>
</body>
</html>

Listando Itens em HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Atividade MaoNaMass</title>
</head>
<body>
    <h1>Título recomendado </h1>
    <h2>Um bom título para começar</h2>
    <ul>
        <li>Ligue o computador</li>
        <li>acesse a ALURA</li>
        <li>assista os vídeos</li>
        <li>leia os conteúdos</li>
        <li>pratique todos os dias</li>
    </ul>
    <p>
        Lorem ipsum dolor sit amet consectetur adipisicing elit. Odio doloribus, velit laudantium magnam earum dignissimos quas dolor assumenda fugiat incidunt quidem facilis expedita! Numquam, cupiditate vel sapiente quo totam incidunt?
        <img src="html.png" alt="logo html5">
    </p>
</body>
</html>

Explorando o impacto do DOCTYPE no HTML Realmente. Verifiquei a página com e sem o !DOCTYPE html. o navegador identifica a versão o que pode ocasionar a não visualização da página no modo Quirks.
Automatizando a atualização da página com Live Server O live server é uma ótima ferramenta. já utilizava no meu vscode. acredito que vcs salvavam direto no ctrl+s pra termos o caminho onde não nego que não conhecia.