Preparação para Entrevista de
Desenvolvedor Web Júnior: HTML
Resumo de HTML
HTML (HyperText Markup Language) não é uma linguagem de programação, mas sim
uma linguagem de marcação. Ela é utilizada para estruturar o conteúdo de uma
página web, definindo como os elementos (texto, imagens, vídeos, etc.) devem ser
organizados e exibidos. O HTML consiste em uma série de elementos, que são usados
para delimitar ou agrupar diferentes partes do conteúdo.
Anatomia de um Elemento HTML
Um elemento HTML é composto por:
1. Tag de abertura: Indica o início do elemento (ex: <p> ).
2. Tag de fechamento: Indica o fim do elemento (ex: </p> ). É crucial não esquecê-
la.
3. Conteúdo: O que está entre as tags de abertura e fechamento (ex: Meu gatinho
é muito mal humorado ).
4. Elemento: A combinação da tag de abertura, tag de fechamento e o conteúdo.
Elementos também podem ter atributos, que fornecem informações extras sobre o
elemento e não são exibidos no conteúdo real. Atributos são definidos na tag de
abertura (ex: <p class="editor-note"> ).
Aninhamento de Elementos
Elementos podem ser colocados dentro de outros elementos, um processo chamado
aninhamento. É fundamental que os elementos sejam aninhados corretamente, ou
seja, a ordem de fechamento deve ser inversa à ordem de abertura (o último a abrir é
o primeiro a fechar).
Elementos Vazios
Alguns elementos não possuem conteúdo e são chamados de elementos vazios. Eles
não têm tag de fechamento. Um exemplo comum é o elemento <img> , que é usado
para incorporar imagens na página.
Anatomia de um Documento HTML
Um documento HTML básico possui a seguinte estrutura:
<!DOCTYPE html> : Declara o tipo de documento, garantindo que o navegador
renderize a página corretamente.
<html></html> : O elemento raiz que engloba todo o conteúdo da página.
<head></head> : Contém metadados sobre a página, como o título, links para
folhas de estilo CSS, e informações para mecanismos de busca. O conteúdo
dentro de <head> não é exibido diretamente na página.
<meta charset="utf-8"> : Define a codificação de caracteres para UTF-8,
permitindo que o navegador exiba corretamente uma ampla gama de
caracteres de diferentes idiomas.
<title></title> : Define o título da página, que aparece na aba do
navegador e nos favoritos.
<body></body> : Contém todo o conteúdo visível da página, como texto,
imagens, vídeos, etc.
Imagens
O elemento <img> é usado para incorporar imagens. Ele requer o atributo src
(source) para especificar o caminho da imagem e o atributo alt (alternative) para
fornecer um texto descritivo para usuários que não podem ver a imagem (por
exemplo, usuários de leitores de tela ou quando a imagem não carrega).
Marcação de Texto
O HTML oferece diversos elementos para marcar e estruturar o texto, como:
Cabeçalhos: <h1> a <h6> para títulos e subtítulos, indicando a hierarquia do
conteúdo.
Parágrafos: <p> para blocos de texto.
Ênfase: <em> para ênfase (geralmente itálico) e <strong> para forte ênfase
(geralmente negrito).
Listas: <ul> para listas não ordenadas e <ol> para listas ordenadas, com <li>
para cada item da lista.
Links: <a> para criar hiperlinks para outras páginas ou recursos.
Dominar esses fundamentos é essencial para qualquer desenvolvedor web júnior, pois
o HTML é a base sobre a qual todas as páginas web são construídas.
10 Questões Comuns de Entrevista sobre HTML
1. O que um doctype faz?
2. Como você serve uma página com conteúdo em vários idiomas?
3. Para que servem os atributos data- ?
4. Considere o HTML5 como uma plataforma web aberta. Quais são os blocos de
construção do HTML5?
5. Descreva a diferença entre um cookie , sessionStorage e localStorage .
6. Descreva a diferença entre <script> , <script async> e <script defer> .
7. Por que geralmente é uma boa ideia posicionar os <link> s CSS entre <head>
</head> e os <script> s JS logo antes de </body> ? Você conhece alguma
exceção?
8. O que é renderização progressiva?
9. Qual é a diferença entre canvas e svg ?
10. O que são elementos vazios em HTML?