Rogério Lino

Web development and tips

Escrevendo O Primeiro XHTML

Mãos à obra, vamos agora escrever nosso primeiro código XHTML. Abaixo o código já pronto e comentado:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pt" lang="pt">
    <head>
        <title> Título </title>
        <meta name="Generator" content="" />
        <meta name="Author" content="" />
        <meta name="Keywords" content="" />
        <meta name="Description" content="" />
        <meta name="language" content="pt-br" />
        <!-- Favicon -->
        <link rel="shortcut icon" href="favicon.ico" />
        <!-- Style -->
        <link rel="stylesheet" href="style.css" type="text/css"/></em>
    </head>
    <body>
    </body>
</html>

Antes de iniciar a tag html é declarado o tipo da página, o Doctype, se você não sabe o que é: leia aqui e/ou aqui.

Nesse caso foi definido como Strict, caso você ainda não esteje preparado pode utilizar como Transitional.

1

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Você deve estar se perguntando: Por que aquele “xmlns” dentro da tag html ?

É chamado de namespace e serve para mostrar para o browser quais elementos pertencem a qual linguagem no documento. Dúvida? Mais? Mais!

As tags meta servem para colocar informações adicionais, tais como, autor, idioma, palavras-chave e etc. - essas tags são utilizadas por mecanismos de buscas, como o Google por exemplo, para localizar os sites. Um site bem estruturado e definido tem chance maior de aparecer primeiro na busca.

Logo abaixo aparece a tag link referenciando um arquivo externo, ícone. Chamado Favicon - ícone do favoritos - que é nada mais nada menos do que aquele íconezinho que fica aparecendo no browser ao lado do endereço do seu site e nos favoritos também é claro. Caso ainda tenha dúvida veja aqui.

Depois como já vimos aparece novamente a tag link para “puxar” o arquivo de estilo da página - CSS.

Fecha-se a tag head, abre e fecha a body e fecha a html, e pronto. O seu XHTML já está pronto.

Na próxima veremos o um layout já pronto com o CSS.

Comments