Forma correta de utilização dos cabeçalhos HTML

Postado por: Pedro Rogério em

Títulos HTML – Do h1 ao h6

Para aqueles que não sabem, os cabeçalhos HTML, ou títulos, estão divididos em 6 níveis: h1, h2, h3, h4, h5 e h6, os números servem para indicar cada número do cabeçalho, sendo que o de nível 1 tem uma maior importância, e o de nível 6, menor importância. Por exemplo, para descrever o título de uma página, você deve utilizar o h1, ao invés de fazer isso:


<p class="titulo">Título do site</p>

Para títulos de menor importância, deve-se usar o h2, e sucessivamente os cabeçalhos de menor nível, dessa forma você está sendo semântico e os Search Engines agradecem.

Por que o HTML permite a codificação mal estruturada?

Postado por: Pedro Rogério em
HTML

Muita gente pensa que o HTML permite a codificação mal estruturada, por exemplo: <strong><em>alguma coisa</strong></em>. Mas isso não é verdade, se você for validar seu código, verá que ele está estruturado de uma forma errada. Usualmente os bowsers tratam de corrigir essa falha e é por isso que vemos as páginas corretamente.

Algumas vezes a falta da Tag de fechamento não representa problema para os browsers por que eles sempre irão codificar ambiguamente. Antigamente, era muito comum você ver alguém omití-las, como o </p>, mas hoje em dia é recomendado utilizar sempre as tags de fechamento, e para as tags <br>, <img> e <hr> você deve utilizá-las da seguinte forma: <br />, <img /> e <hr />, segundo as especificações do XHTML.

Os 6 erros mais comuns em HTML

Postado por: Pedro Rogério em

Muitas vezes quando vamos validar nosso código junto ao validador HTML do W3C, acabamos nos deparando com erros que as vezes não somos capazes de corrigir, ou, custa bastante tempo descobrir a causa d erro.

Apesar das explicações detalhadas de cada erro encontrado, na maioria das vezes o validador encontra erros que não etão diretamente relacionados com a sintaxe do código e com isso acabamos em um conflito. Abaixo vocês verão uma lista dos erros mais comuns em HTML:

Tags HTML dentro de um elemento SCRIPT

Um erro bastante comum é quando usamos uma linguagem de programação sob a outra de forma incorreta, especificamente quando utilizamos sentenças JavaScript sob linguagem HTML. Não, isso não é um erro, o erro está quando esquecemos de utilizar os caracteres de escape.

Forma Incorreta:


<script type="text/javascript">
<!--
  document.write("</p>");
// -->
</script>

Forma Correta:

<script type=”text/javascript”>
<!–
document.write(“<\/p>”);
// –>
</script>

Como podemos ver no exemplo acima, deve-se utilizar rimeiramente de uma barra invertida para obrigar o user-agent do usuário a entender que a barra que encerra o parágrafo não significa um comportamento especial, e sim, o fim de um bloco de parágrafo.

Ampersands (&) em URLs

Outro erro bastante comum são o de interpretação dos Ampersands em URLs, objetos, imagens e outros:


<a href="http://web.com/?id=12&num=3">Artigo</a>
<a href="http://web.com/?id=12&amp;num=3">Artigo</a>

A segunda opção é a maneira correta para escrita.

Ordem incorreta dos elementos

Outro erro bastante comum, é que em varios objetos aninhados, fechamso uma tag posterior, sendo que deveria ser fechada juntamente com a anterior:


<strong><em>Olá a todos</strong></em>
<strong><em>Olá a todos</em></strong>

A segunda opção é a maneira correta para escrita.

Uso do DOCTYPE em minúsculas

O tipo do documento estabelecido no início do código é sensível a maiúsculas, portanto você deve respeitá-lo sem alterá-lo.

Se requer um sub-elemento no cabeçalho

O elemento Title não só serve para estabelecer um título para página, mas sim é um elemento obrigatório que você deve estabelecer em suas páginas web.

Letras maiúsculas em tags XHTML

Em XHTML, todos os elementos da página devem ser escritos em minúsculo, por exemplo, onMouseOver é inválido em XHTML, mas onmouseover já é válido.

Artigo original: WDG.

Tag <q> funcionando no Internet Explorer

Postado por: Pedro Rogério em

Em um artigo anterior podemos ver que a tag <q> não funciona no Internet Explorer, pra quem não sabe, a tag <q> tem função de indicar citações, as famosas aspas para indicar a fala de alguém. Mas hoje existe uma forma muito simples de contornar isso, apenas utilizando de um arquivo HTC chamado fixQuotes_en.htc, desenvolvido por Will code 4 beer, basta utilizá-lo da seguinte forma:

Basta chamar o arquivo via CSS:


<style type="text/css">
q { behavior:url(fixQuotes_en.htc); }
</style>

Para maiores informações, visite o artigo original: Fixing the Quote Tag in Internet Explorer.

Páginas:«12345678»