Principais TAG's em HTML

Abaixo listo as principais TAG's em HTML:

Dentro da TAG <head> inserimos a seção de cabeçalho da página. Ela é utilizada para definir características e propriedades do documento. Nesta seção aparecem as TAG's:
- Title: Usada para definir o título da página.
  EX: <title> Título da Página </title>
- Meta (description, charset, robots, viewport):
  - Description: Define a descrição de uma página. Essa descrição é transparente para o usuário. Ela é usada por buscadores e outros serviços web.
    EX: <meta name="description" content="Primeiros passos em HTML, CSS e JavaScript">
  - charset: É utilizada para informar ao browser o conjunto de caracteres que nossa página utiliza.
    EX: <meta charset="UTF-8">
  - Robots: Usada para definir se uma página deve ou não ser exibida em um buscador (noindex, para não exibir determinadas páginas e nofollow, para não indexar links).
    EX: <meta name="robots" content="noindex, nofollow">
  - viewport: Usada para configurar a exibição correta e adequada da página em múltiplos tamanhos de tela ('width=device-width', ajusta a largura do conteúdo para a largura da página e 'initial-scale=1', Define o zoom inicial da página).
    - Width e Height: Definem a uma largura e altura para o viewport. Os valores podem ser em PX ou “device-width”, que determina automaticamente um valor igual a largura da tela do dispositivo.
    - Initial-scale: Define a escala inicial do viewport.
    - User-scalable: Define a possibilidade de o usuário fazer “zoom” em um determinado lugar da tela. É ativado quando o usuário bate duas vezes com o dedo em um lugar da tela.
    EX:- <meta name="viewport" content="width=device-width, initial-scale=1">
    - <meta name="viewport" content="width=320px", initial-scale=1">
- Link: Usada para adicionar arquivos externos como de CSS.
  EX: <link rel="stylesheet" href="style.css">
- Style: Usado para adicionar um código CSS diretamente ao documento.
- Script: Adiciona um arquivo externo javaScript.
  EX: <script type="text/javascript" src="script.js"></script>
Para inserir um Título, usamos a TAG <h>. Ela pode variar de <h1>, para o título principal, ate <h6>, seguindo a hierarquia abaixo:
- <h1>
- <h2>
- <h3>
- <h4>
- <h5>
- <h6>

Para inserir um Parágrago, usamos a TAG <p>.

Para inserir um Link, usamos a TAG <a>. Podemos usar parâmetros como:
- Target: Indica qual a maneira que o site será exibido.
  - _blank: Nova aba do navegador
  - _self: Mesma aba do site atual (padrão).
- Rel: qual a natureza do link:
  - next: Indica link para a próxima parte do documento atual.
  - prev: Indica link para a parte anterior do documento atual.
  - author: Indica que é um link para o site do autor do artigo atual.
  - external: Indica link para site externo.
  - nofollow: impede que os mecanismos de busca indexem esse link.
- Download: Parâmetros para baixar um arquivo. Existe uma lista das principais Medias Types no site Ianna.Org
  - type="application/pdf": Para baixar o arquivo em pdf
  - type="application/zip": Para baixar o arquivo compactado

Para inserir uma Imagem, use a TAG <img>. Nesta TAG temos alguns parâmetros:
- src (source): Define o nome e o endereço da imagem
- Title: Define o título da imagem
- Alt (Alternative Text): Nome de referência da imagem
- Width: Largura da imagem em pixels
- Height: Altura da imgem em pixels
- Border: Define uma moldura ao redor da imagem. O valor padrão é zero.
- Align: Define o alinhamento em relação ao espaço na página que a imagem vai estar (Left, Right, Top, Texttop, Middle, Absmiddle, Baseline, Bottom, Baseline e Absbottom.).
- Hspace: Define o espaço lateral da imagem ao resto da página.
- Vspace: Define o espaço vertical (acima e abaixo) da imagem em relação ao resto da página.

Para inserir Imagens Dinâmicas, usamos a TAG <picture>, conforme exemplo abaixo:

        <picture>
            <source media="(max-width:750px)" srcset="imagens/img-p.png">
            <source media="(max-width:1050px)" srcset="imagens/img-m.png">
            <img src="imagens/img-g.png" alt="imagem flexivel">
        </picture>

Para Envelopar usamos o comando ctrl+shifp+p.

Para endereços, usamos a TAG <address></address>.

Para Negrito, podemos usar a TAG não semântica <b> ou a semântica (termo em destaque) <strong>.

Para Itálico, podemos usar a TAG não semântica <i> ou a semântica (termo em destaque) <em>.

Para destacar um texto como usamos fisicamente os marca-textos, podemos usar a TAG <mark>.

Para marcar texto Deletado, usamos a TAG <del>, antiga <strike>.

Para marcar texto Inserido, usamos a TAG <ins>.

Para marcar texto sobrescrito e subscrito, usamos as TAG's <sub> e <sup>.

Para Trechos de Código, usamos as TAG's <code> e <pre>.

Para marcar texto “Citações”, usamos a TAG <p>, para citações simples. àra citações longas ou em blocos, usamos a TAG <blockquote> e para usar um link para o texto referenciado, usamos a TAG <blockquote cite=""> .

Para deixar o texto ao contrário, usamos a TAG <bdo>.

Para duplicar uma linha ou um bloco de código, você pode usar o comando shift+alt+setinha para baixo.

Para inserir Referência em uma imagem, use as TAG's <figure> e <figcaption>

    <figure>
        <img src="img/comparativo.png" width="40%"  title="Definição de..." alt="dominio">
        <figcaption class="ref"> Fonte: Curso em Vídeo</figcaption>
    </figure>

dominio — Fonte: https://www.iconfu.com/