Inserir vídeos do Youtube em XHTML válido

Postado por: Pedro Rogério em

O código para inserir vídeos do Youtube em sites que respeitam os WebStandards é uma dor de cabeça para desenvolvedores e para bloggers, pois o Youtube proporciona um código para você copiar e colar em nosso blog para reproduzir os vídeos de uma forma rápida e simples, mas o código não é correto como deveria:


<object width="425" height="373">
<param name="movie" value="http://www.youtube.com/v/O0G7iKj6PS0&rel=1&border=1"></param>
<param name="wmode" value="transparent"></param>
<embed src="http://www.youtube.com/v/O0G7iKj6PS0&rel=1&border=1" type="application/x-shockwave-flash" wmode="transparent" width="425" height="373"></embed>
</object>

Se você for validar o código, verá os seguintes problemas:

  • Se utiliza a tag object corretamente, mas ocorre a falta de alguns parâmetros como data e type.
  • As tags param em XHTML devem ser fechadas com a sua mesma tag de abertura.
  • O uso da tag não standard embed podem produzir incompatibilidades em browsers que não a utilizam, como, dispositivos móveis e leitores de tela.
  • Não se proporciona um método alternativo caso o dispositivo não tenha suporte a Flash.

Continuar lendo »

Quais são as versões do HTML?

Postado por: Pedro Rogério em

O HTML foi desenvolvido originalmente por Tim Bernes-Lee no CERN (Centro Europeu de Física de Partículas), e foi popularizado pelo navegador Mosaic, esse desenvolvido pela NCSA (National Center for Supercomputing Applications). Devido ao seu rápido crescimento na Web, foi necessário criar um padrão para que todos os autores e navegadores pudessem reconhecer quaisquer versões do HTML, que são as seguintes: HTML 2.0, HTML 3.2, HTML 4.0 e o HTML 4.01.

Alguns crêem que o HTML não tem futuro algum devido a existência do XHTML mas se fomos ver bem, o browser mais utilizado hoje não suporta XHTML como deveria. As versões do HTML mais utilizadas hoje em dia são HTML 4.01 e XHTML 1.0. Essas 2 versões foram definidas pelo W3C a mais ou menos 7 a 8 anos, e agora estão sendo desenvolvidas novas versões que são o HTML 5 e o XHTML 2.

Apesar de cada versão, cada uma tem suas variantes que sempre devem ser definidas no documeno HTML:

  • HTML 4.01 Strict: O mais utilizado, onde podem ser utilizadas tags do HTML 4.01, só que não são permitidas tags obsoletas.
  • HTML 4.01 Transitional: Esse permite utilizar tags de todas as versões HTML, mas não é muito recomendado.
  • HTML 4.01 Frameset: Tem suporte a frames, um modelo muito antiquado.

Artigo recomendado: Evolução do HTML.

Esse artigo é uma tradução do original de: Carlos Leopoldo.

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.

Páginas:«1234»