Realizando as atividades, eu aprendi sobre a importância de um layout HTML bem estruturado e personalizado, devido ao fato de que seu objetivo como linguagem está relacionado especificamente à estruturação mais pura das informações dentro de uma página. Tudo fora disso deve ser tratado como responsabilidade do CSS. Gostei bastante da simplificação proporcionada pelo Emmet para toda essa estrutura, de uma forma mais matemática.
Atividade 01
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Portfólio</title>
</head>
<body>
<div>
<h1>Portfólio </h1>
<h2>Trabalhos e projetos desenvolvidos pelo autor.</h2>
<p>Sejam bem-vindos ao portfólio.</p>
<a href="https://www.instagram.com/">Instagram</a>
<a href="https://github.com/">Github</a>
<img src="html.png" alt="Logo HTML">
</div>
</body>
</html>
Atividade 02
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Portfólio</title>
</head>
<body>
<header>
<img src="ls.png" alt="Logo do Projeto" width="100" height="100">
</header>
<main>
<h1>Título do Portfólio</h1>
<p>Modelo de parágrafo simples</p>
<a href="https://www.instagram.com/">Instagram</a>
<a href="https://github.com/">Github</a>
<img src="html.png" alt="Logo HTML">
</main>
<footer>
<p>2018-2026 - Todos os direitos reservados</p>
</footer>
</body>
</html>
Atividade 03
Acredito que alterar a linguagem do site para PT-BR talvez facilite para mecanismos de busca de locais específicos. Agora, o UTF-8 define os tipos de caracteres identificáveis, sendo ele o padrão com maior compatibilidade. A compatibilidade com o Edge garante que ele sempre utilize sua versão mais atualizada para rodar o código, e o viewport melhora a visualização independentemente do tamanho do dispositivo, garantindo responsividade.
<html lang="pt-br">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<title>Portfólio Teste</title>
Atividade 04
Essa eu usei mais para prática, não estava com muita criatividade hoje:
<h1> Portfólio <strong>Oriyon</strong> </h1>
<p>Empresa Jurídica.</p>
<a href="https://www.instagram.com/">Instagram</a>
<a href="https://github.com/">Github</a>
Atividade 05
<img src="logo.png" alt="Logo da empresa de advocacia">
