DOCTYPE
<!DOCTYPE html>
Convoca um comportamento do navegador para que leia em formato HTML, já que cada um tem sua propia maneira de ler o HTML.
<html> e </html>
demarca a página web, onde vai todo seu conteudo e parametos;
O HTML possui duas divisões basicas, uma para as configurações da pagina, e a parte do conteudo apresentavel.
Divisões Basicas
head
<head> e </head>
Aqui fica todos os ajustes e informações referente a estrutura da pagina.
<meta> é a tag responsavel por passar informações para pagina. como
<meta charset
="UTF-8">
<meta name
="viewport" content
="width=device-width, initial-scale=1.0">
<title> e </title> define o titulo da aba no navegador;
body
Os Elementos entre <body> e </body>
é a informação visível na página;
Elementos
Titulos
O texto entre <h1> e </h1> é exibido como cabeçalho;
Cada um h representa um subinivel h1, h2, h3,h4, h5 e h6 do anterior, uma tangente do assunto.
A tag <p> e <p> apresentam o conteudo dos paragrafos.
Divisões do Material ou Grouping Tags
Para uma melhor vusualização e organização do codigo utilizamos a tag <div> com intuito de genericamente dividir o conteudo. A mesma vai ficar em box level.
Também pode ser usado a tag <span>, porém esta é inline level.
Quando as divisões forem para formulario utilize a tag <fieldset>
Conteudo importante
Utilizamos a tag <main> para dar notoriedade a um determinado tipo de conteudo.
header
Demarca o cabecalho.
Section
É um texto genérico ou uma seção.
Article
Uma peça independente do conteudo do documento, como um blog ou jornal.
Aside
Conteudo pouco relacionado.
Figure
conteudo independente, como video e imagem.
Footer
Rodapé , informações sobre direitos autorais.
Listas
Utilizamos a tag <ol> para uma lista ordenada.
E a tag <ul> para uma lista não ordenada.
A tag <li> é utilizada para demarcar o item
Navegação
Utilizamos a tag <nav> para uma lista de navegação.
Tabelas
Utilizamos a tag <table> dentro da mesma o border realizara as bordas e o bgcolor a cor de fundo.
A tag <thead> indica a linha do cabeçario
A tag <th> indica o titulo da coluna
A tag <tbody> indica o corpo da tabela
A tag <tr> indica a linha
E a tag <td> para indicar as celulas.
Campo de texto
A tag <input> indica onde o usuario deve inserir os dados. Geralmente vem em <form>
<input type="text" nome = 'primeiro'>
Input
Area para inserção de dados e interação com usuario.
Ulitlize a tag <input>
Etiqueta
A tag <label> cria um rotulo para o ponto de seleção.
É possivel localizar a seleção através do getElementsByName 'name'['local'].checked
Legenda
A tag <legend> é exelente para nomear enunciados de input.
Formulario
O formulario é a area declarada para recolhimento de inputs.
Utilize a tag <form>
Utilize o site Mobile input types para adequar melhor a tela de celular
Obrigatorio
Para exigir o input respecifique na tag a palavra reservada required.
Marcado
A tag inpult deve conter a paralavra reservada checked para que a pagina carregue previamente selecionada.
Links
Utilizando a tag <a>
Para link externo use <a href="http://exemplo.ai" target = "blank"></a>
<iframe>
Abre uma especie de janela para conteudos externos como maps
O youtube tambem trabalha com iframe