10 erros de HTML que você realmente não deve cometer

HTML é uma linguagem de marcação que possibilita, dentre outras coisas, apresentar informações na Internet. Basicamente, tudo o que se vê na internet tem alguma parte escrita em HTML ou em um de seus "irmãos"/ derivados.

Faça o curso de HTML

Errar é humano, então se você errou perdoamos, mas cometer o mesmo erro sempre ai já é burrice. Para evitar estes erros comuns, esta lista é útil, ela mostra os erros mais comuns e ajuda, mostrando uma solução alternativa. As dicas incluem: escrever a marcação valida, fazer escolhas semânticas, evitar tags obsoletas e muito mais.

Erro 1: colocar elementos de bloco dentro de elementos inline

Os elementos HTML podem ser exibidos de duas formas, em bloco ou inline. Cada tag por padrão é naturalmente um elemento em bloco ou inline. Elementos em bloco incluem divs, parágrafos, que compõem a estrutura do documento. Elementos inline, por outro lado deve estar dentro de elementos de bloco e para dar continuidade ao fluxo da página, os exemplos incluem âncoras (links) e tags spam. Com isto em mente, os elementos inline devem sempre ir dentro dos elementos de bloco e nunca o contrário.

Erro 2: Não incluir o atributo ALT em imagens

O atributo ALT é um elemento necessário em todas as imagens exibidas em uma página. Ele ajuda os usuários a determinar de que é a imagem, se eles tiverem usando um leitor de tela ou tenha uma conexão lenta. O atributo ALT deve descrever a imagem que está sendo mostrada, usar alt=”imagem” é uma prática ruim. Se a imagem é puramente para fins decorativos, basta adicionar o atributo alt vazio, como alt=””.

Erro 3: Não usar listas quando necessário

A tag UL (e OL) pode ser usada para várias coisas e são extremamente versáteis para a exibição de todos os tipos de itens da página. Não é novidade que a tag de lista não ordenada faz um ótimo trabalho para exibir uma lista de informações, então nem pense em usar um monte de quebras de linha para criar uma lista.

Erro 4: Usar <b> e <i> para negrito e itálico

As tags <b> e <i> são usadas para deixar o texto em negrito e itálico, respectivamente, mas semanticamente elas são classificadas como tags de apresentação, pois o efeito seria mais bem aplicado com os estilos font-weight e font-style do CSS. Se a passagem do texto sugere uma área de importância, deve ser destacados com as tags <strong> ou <em>, que basicamente faz a mesma coisa que o <b> e <i>, mas também torna o mundo um lugar melhor.

Erro 5: Usando muitas quebras de linha

A tag de quebra de linha <br /> só deve ser usada para inserir uma quebra de linha única no fluxo de texto de um parágrafo. Não deve ser usada para fazer lacunas entre os elementos, ao contrário, você deve dividir o texto em parágrafos separados, ou ajustar a margem pelo CSS.

Erro 6: Usar errado as tags de tachado

Antigamente se usava as tas <s> e <strike> para informar que um texto foi editado. No entanto elas estão agora classificadas como tags obsoletas, o que significa que ainda funcionam, mas estão em transição. O certo é usar um novo conjunto de tags <del> e <ins>. Estas novas marcas são utilizadas em conjunto para mostrar que este foi excluído e o texto que foi posteriormente inserido no documento.

Erro 7: Usar estilo inline

Você já deve ter ouvido milhares de vezes, que um estilo inline é ruim. O certo de acordo com a semântica (e a facilidade) é ter a estrutura HTML em um documento e o estilo CSS em outro, por isto simplesmente não faz sentido ir colocando estilo diretamente no documento HTML. Lembre-se de manter os estilos em um arquivo de CSS que eles pertencem.

Erro 8: Adicionar ou remover bordas pelo HTML

O atributo border é outro com efeito de apresentação e de modo semanticamente correto, deve ser deixado para o CSS, mesmo que seja para remover a borda de um elemento.

Erro 9: Não usar tags de cabeçalho

As tags de cabeçalho estão disponíveis de <h1> a <h6>, e são uteis para separar o seu documento em seções intituladas. Se você tem uma seleção de palavras que indicam o conteúdo que deve aparecer abaixo é provável que uma das tags de cabeçalho irá caber direitinho. A escolha da tag de cabeçalho vai depender do fluxo do documento, naturalmente, tente inseri-los na ordem de 1 a 6.

Erro 10: O uso de <blink> ou <marquee>

Além de não serem parte da coleção oficial de tags padrão do HTML aprovado pelo W3C, as tags <blink> e <marquee> são pura feiura. Se há algo que você precisa prestar atenção, tenho certeza que você pode utilizar outras alternativas para chamar a atenção para uma região ou texto sem tem que fazê-lo piscar ou ficar navegando pela página.