Como pode ver, essa opção pode ser usada para listar uma série de itens mas sem nenhum grau de priorização.

Já a tag

A lista ordenada é usada quando se quer enumerar os itens de uma lista, em ordem de prioridade, por exemplo.

Como você já deve ter notado nos exemplos acima, a tag

Além desses dois tipos de listas, mais comuns, há também a lista de definições. Essa não é uma lista de itens, mas sim uma lista de termos e explicações desses termos. Cada lista de definição começa com a tag

, cada termo começa com a tag

e cada definição começa com a tag

.

computer

Tag Semântica

A correta utilização das tags semânticas no seu site fará com que ele seja mais acessível e legível, tanto para os usuários, como para os mecanismos de busca.

Links e imagens

Nos primórdios da internet, as páginas eram apenas um amontoado de textos. Um conteúdo pouco atrativo, mas ainda assim revolucionário e muito útil. Pouco tempo depois, começou a possibilidade de incorporar imagens e outros conteúdos interessantes nas páginas da web.

A tag tem uma funcionalidade semelhante a tag de inclusão de links . Isso porque, a imagem não é inserida na sua página, e sim, é criado um link para a imagem de forma que ela apareça como se estivesse mesmo inserida no texto.

A tag é utilizada para inserção de links no seu site. Ao inserir um hiperlink, as pessoas que estiverem a ler o seu conteúdo podem acessar rapidamente as informações que constam em outra página do seu próprio site ou mesmo um conteúdo externo.

Você também pode criar links para que o leitor acesse rapidamente outra seção da página, otimizando a navegação e permitindo que o usuário acesse rapidamente o conteúdo que deseja ler naquele momento.

O hiperlink é um texto, imagem ou ícone em que se pode clicar e ser redirecionado para outra página, conteúdo ou parte do documento. Normalmente os links aparecem em azul ou sublinhados em uma página, mas é possível personalizar.

O texto que consta entre as tags de abertura e fechamento é conhecido como texto âncora. O ideal é que ele possua entre três e cinco palavras e que sejam um "resumo" daquilo que o usuário vai encontrar ao clicar no link.

Exemplo de texto âncora:

Encontre um professor particular de HTML na Superprof.

Exibição:

Encontre um professor particular de HTML na Superprof.

O processo de inclusão de um hiperlink na web é geralmente parecido com o de um editor de texto como o Word, por exemplo. Primeiro você deve copiar a URL que você quer adicionar, destacar o texto âncora, localizar o ícone de hiperlink, geralmente representado por elos de uma corrente 🔗, colar a URL e pressionar enter. Pronto, você já terá incluído o link. A outra opção é sempre usar as tags de abertura e fechamento.

Inserir links no seu site pode trazer várias vantagens. Além de otimizar a navegação, como já dito, ainda melhora a otimização do SEO e valoriza o seu conteúdo.

As imagens são muito importantes para tornar a sua página da web mais atrativa, para trazer um respiro quando o conteúdo tem muito texto, para ilustrar e exemplificar e tornar a sua homepage mais chamativa.

attachment

Nota importante!

As imagens possuem direitos autorais, por isso, antes de incluir uma imagem em seu site, você tem de certificar-se que é o dono da imagem, ou que você tem a permissão do autor da imagem para utilizá-la, ou ainda usar uma imagem de domínio público.

As imagens suportadas pelos navegadores podem ter a extensão .jpg, .png, .gif ou ainda outros formatos. Certifique-se de que a imagem inserida está sendo lida corretamente pelos principais navegadores. Para inserir a imagem na web usamos a tag que deve ser usado em conjunto com o atributo source - src. É esse segundo que aponta o caminho para a imagem que deseja incorporar.

É importante que a sua imagem tenha um nome de arquivo descritivo, pois os mecanismos de burca da internet também leem nomes de arquivos para o SEO.

Sempre que inserir uma imagem, não se esqueça de incluir o texto alternativo (atributo alt). Ele deve ser uma descrição textual da imagem, que será usada em situações que a imagem não pode ser exibida, quando a conexão está lenta ou quando a página leva muito tempo para ler a imagem. Além disso, o texto alternativo é útil para quando o usuário é deficiente visual e utiliza um leitor de tela para ler o conteúdo da página.

Formulários e controles de formulários

Superadas as tags mais básicas que já detalhamos, é hora de partir para estruturas mais complexas do HTML. Os formulários, quando bem estruturados, podem ajudar que seu site seja ainda mais acessível e interativo.

Através de formulários, você pode coletar dados dos leitores, recolher impressões, fazer pesquisas de opinião e muito mais.

O elemento define um formulário no HTML, e há ainda uma série de atributos que vão definir a forma como esse formulário se comporta. Todo o conteúdo do formulário vai estar dentro dessa tag .

Atributo action: define o local ao qual serão envidos os dados coletados através de uma URL

Atributo method: define o método HTTP que o formulário irá lidar (GET ou POST)

Ainda dentro dos formulários HTML, existem diversos elementos que vão compor o formulário. Entenda quando usar cada um deles.

Fique por dentro de todas as novidades do HTML5.

Essa tag define ou cria campos de entrada de dados. É usada dentro da tag

para que os dados coletados sejam processados e encontrados em outro documento. Essa é uma das poucas tags do HTML que não possuem fechamento. Dentro da tag input, temos uma série de tipologia de entrada de dados, como por exemplo: button, checkbox, data, arquivo, password, texto e outras.

Essa tag define um botão genérico. É normalmente a última seção de um formulário, contendo apenas um botão de submeter os dados, por exemplo.

Essa tag define uma lista selecionável, também chamada de drop-down ou um menu de opções. Também é usada dentro de uma tag .

Listamos aqui algumas tags básicas, e outras nem tão básicas assim. Para compreender em detalhe cada uma dessas funcionalidades do HTML, você pode agendar uma aula particular com um professor de HTML disponível na plataforma da Superprof.

Resumir com IA:

Você curtiu esse artigo? Deixe uma nota!

5,00 (1 note(s))

Loading...

Camila Reis

Administradora, Mestre em Economia e Gestão da Inovação, mineira, mãe. Apaixonada por viagens e pela vida, me arrisco na cozinha, amo ler, conhecer pessoas e passear em dias frios com sol.

Deixe um comentário

Cancelar resposta

O seu comentário

Nome *

E-mail *

Current ye@r *

Leave this field empty