Manual XHTML

+
XHTML
25H
6/14/11 jgateixeira@gmail.com
De onde vm o XHTML
n
Todas as linguagens da web so baseadas em SGML com a finalidade de servir de base para criao de outras linguagens. O SGML foi usado para criar a XML (Extensible Markup Language). Com XML pode cria os seus prprios elementos de marcao e atributos. XHTML foi criado dentro deste conceito e por isso uma aplicao XML. As tags e atributos da XHTML foram criadas aproveitando as tags e atributos do HTML 4.01 e suas regras. Conclui-se que ao usar XHTML, estamos a escrever um cdigo XML, onde as tags e atributos j esto definidas. XHTML uma linguagem de marcao bastante familiar para quem conhece HTML e a transformao de um documento existente de HTML para XHTML uma tarefa simples.
6/14/11
jgateixeira@gmail.com
Finalidade do XHTML
n
XHTML a sigla em ingls para EXtensible HyperText Markup Language que em traduo resulta em Linguagem Extensvel para Marcao de Hipertexto, uma aplicao XML, escrita para substituir o HTML. No nada mais do que uma HTML "pura, clara e limpa".
6/14/11
Vantagens do XHTML
nCompatibilidade nA
da linguagem XHTML com as futuras aplicaes.
tendncia a de que futuras verses de browsers, deixem de suportar elementos e atributos j em desuso ("deprecated") segundo as Recomendaes do W3C. a linguagem da web do futuro.
nXHTML nXHTML
um cdigo consistente que dispensa uso de "truques" e "hacks" para contornar "bugs". Editar um cdigo XHTML existente uma tarefa simples por se tratar de uma escrita limpa e evidente. tempo de carregamento de uma pgina XHTML mais rpido pois os navegadores tm a interpretar, uma pgina limpa sem ter que decidir sobre renderizao de erros de cdigo. pgina XHTML mais acessvel aos navegadores e s aplicaes dos utilizadores em geral, incrementando a interoperabilidade e a portabilidade dos documentos web. pgina XHTML totalmente compatvel com todas as aplicaes HTML antigas e j ultrapassadas.
nO
nUma
nUma
6/14/11
Vantagens do XHTML
n
XHTML 1.0 uma Recomendao do W3C e sua verso atual data de 26 de janeiro de 2000. Isto significa que trata-se de uma linguagem estvel, oficialmente especificada pelo W3C, tendo sido projectada e revisada pelos seus membros e uma "Padro Web.
6/14/11
Diferenas entre XHTML e HTML

n n n n n n
Todas as tags devem ser escritas em letras minsculas; As tags devem estar convenientemente alinhadas; Os documentos devem ser bem formados; O uso de tags fechadas obrigatrio; Elementos vazios devem ser fechados; Sintaxe para atributos.
6/14/11

n n n
Todas as tags devem ser escritas em letras minsculas; A metalinguagem XML sensvel ao tamanho da fonte. Uma vez que XHTML uma aplicao XML, tambm sensvel ao tamanho e deve ser usada lowercase Errado: <DIV><P>Aqui um texto</P></DIV> Certo: <div><p>Aqui um texto</p></div>
6/14/11
n n n n

n n n n n
As tags devem estar convenientemente alinhadas; Errado: <div><em><p>Aqui um texto negrito</em></p></div> Certo: <div><em><p>Aqui um texto negrito</p></em></div>
6/14/11

n n
Os documentos devem ser bem formados; Um documento diz-se bem formado quando est estruturado de acordo com as regras definidas nas Recomendaes para XML 1.0 [ XML ]. Todos os elementos XHTML devem estar corretamente alinhados dentro do elemento raiz <html>.
6/14/11

n n
O uso de tags fechadas obrigatrio; Em HTML permitido, para determinados elementos, omitir o fecho da tag. XML no permite. Errado:: <p>Um pargrafo.<p>Outro pargrafo. Certo: <p>Um pargrafo.</p><p>Outro pargrafo.</p>
n n n n
6/14/11

n n n n n n n n
Elementos vazios devem ser fechados; Exemplo, <br /> ou <hr></hr>. Errado: Elementos vazios sem terminao <br> <hr> Certo: Elementos vazios com terminao <br/> <hr/>
6/14/11

n n n
Sintaxe para atributos. Nomes de atributos Assim como as tags, os atributos tambm so sensveis ao tamanho deve-se escrever nomes de atributos em minsculas; Errado: <td ROWSPAN="3"> Certo: <td rowspan="3>
6/14/11

n n n
Sintaxe para atributos. Valores de atributos Os valores de atributos devem estar entre "aspas duplas " ou 'aspas simples'; Errado: <td rowspan=3> Certo: <td rowspan="3"> ou <td rowspan='3'>
6/14/11

n n n n n n
Sintaxe para atributos. Valores dos atributos Todos os atributos devem receber um valor; Errado: <input checked /> Certo:<input checked="checked" />
6/14/11
6/14/11

n n n
Sintaxe para atributos. Os atributos id e name; A HTML define o atributo name para os elementos a, applet, form, frame, iframe, img , e map. HTML tambm introduziu o atributo id. Ambos os atributos foram projetados para serem usados como identificadores. Em XML, os identificadores so exclusivamente do tipo ID, e poder existir somente um atributo do tipo ID por elemento. Alm disso um determinado valor do identificador ID deve ser nico no documento.
6/14/11

n
Documentos XHTML 1.0 compatveis com XML e bem estruturados, DEVEM usar o atributo id e no name ao definir identificadores para os elementos listados acima. Notar que em XHTML 1.0, o atributo name destes elementos est formalmente em desuso e possivelmente ser excluido nas verses futuras de XHTML. Errado: <img src="imagem.gif" name="minha_imagem" /> Certo: <img src="imagem.gif" id="minha_imagem" />
6/14/11

n n
O atributo lang; O atributo lang destina-se a definir a lngua em que foi escrito o documento HTML e o atributo xml:lang para definir a lngua em que foi escrito o documento XML. <div lang="it" xml:lang="it">Ciao bella!</div>
6/14/11
Elementos obrigatrios em XHTML

n n
Mandatory XHTML Elements Num documento XHTML tm de existir a declarao DOCTYPE. O elementos html, head, title, e body tm de estar presentes.
6/14/11
DOCTYPES em XHTML
n
A Definio do tipo de documento (Document Type Definitions DTD) especifica qual a sintaxe SGML usada no documento. A DTD usada pelas aplicaes SGML ( tais como HTML ) para identificar as regras que se aplicam a linguagem de marcao usada no documento bem como o conjunto de elementos e entidades vlidas naquela linguagem. Assim uma DTD para um documento XHTML descreve com preciso a sintaxe e a gramtica da linguagem de marcao XHTML.O DOCTYPE deve ser sempre a primeira declarao em um documento web.
6/14/11
Diferentes DOCTYPES em XHTML

n n n n
So trs os tipos de DOCTYPE para XHTML: STRICT TRANSITIONAL FRAMESET
6/14/11

n
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict// EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> A mais rgida das declaraes. No modo Strict no admitem qualquer item de formatao dentro dos elementos. No admite elementos em desuso "deprecated" segundo as recomendaes do W3C. So indicados para uso com folhas de estilo em cascata, com marcao totalmente independente da apresentao.
n n
6/14/11

n
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/ xhtml1-transitional.dtd"> Esta declarao permite uma maior flexibilidade e indicada para documentos que ainda utilizem elementos em desuso ("deprecated"), Regras de apresentao embutidas em tags. Documentos destinados a exibio em browsers sem suporte para CSS. No admite qualquer tipo de marcao para frames.
6/14/11
n n

n
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1frameset.dtd"> Esta declarao permite tudo da declarao transational e mais os elementos especificos para frames.
6/14/11

n
W3C disponibiliza um validador gratuito para documentos XHTML. Digita o URL ou o caminho para a pgina e um rob analisa o documento fornecendo um relatrio completo e detalhado das no conformidades por ventura existentes. uma ferramenta excelente para usar durante a elaborao ou migrao do seu documento para XHTML. Serve como um revisor do cdigo que cria. Link para o validador: http://www.w3schools.com/xhtml/default.asp
n n n
6/14/11
Caminhos relativos e Absolutos

n
Uma ligao relativa pode se parecer com:...
<a href=../aulas-ambiente-internet.xhtml> Notas de aulas </ a>
e uma ligao absoluta:
<a href=http://www.lrodrigo.cjb.net/estacio/aulas-ambienteinternet.xhtml> Notas de aulas </a>

6/14/11
Pontos de ncorasLinks
n
Em HTML para criar um ponto de ncora, associamos um nome ao elemento <a>: Ligao a outro site <a href="http://www.123.com">Visita 123!</a> Ligao dentro do documento <a href="#uteis">Links teis</a> faz o link para <a name="uteis">Links teis :</a> ou <a id="uteis">Links teis :</a>
6/14/11
n n n n n n
Separadores de blocos de cdigos

n
comum o uso de uma sequncia de caracteres dentro da marcao de comentrios (  -------------------------------------------- >
nCerto: n<!-n xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx -->
6/14/11

n
comum o uso de uma sequncia de caracteres dentro da marcao de comentrios (  -------------------------------------------- >
nCerto: n<!-n xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx -->
6/14/11

n n n
Os browsers aceitam trs formatos: GIF, JPEG e PNG Includas nas pginas atravs do elemento <img />. Este elemento possui o atributo alt, utilizado para fornecer um texto alternativo quando a imagem no puder ser visualizada. Atributo src para indicar a localizao da figura. Exemplo: <img src=../papagaio.jpg alt= papagaio /> Ainda tm atributo width e height.
n n n n
6/14/11
Tabelas
n
Todas as tabelas devem conter:
n n n n
Ttulo Cabealho Corpo Rodape
6/14/11
Tabelas
6/14/11
Tabelas
6/14/11
Tabelas
6/14/11
Formulrios
n n
Para criar formulrios usamos a tag <form> Um formulrio pode conter elementos input, text fields, checkboxes, radio-buttons, submit button. Formulrios so usados para passar informao para servidor.
6/14/11
Formulrios
n n
<form action="form_action.asp" method="get"> <input type="checkbox" name="vehicle" value="Bike" /> I have a bike<br /> <input type="checkbox" name="vehicle" value="Car" checked="checked" /> I have a car <br /> <input type="submit" value="Submit" /> </form>
n n
6/14/11
Formulrios
n n
<form action="form_action.asp" method="get"> <input type="radio" name="sex" value="Male" /> Male<br /> <input type="radio" name="sex" value="Female" checked="checked" /> Female<br /> <input type="submit" value="Submit" /> </form>
n n
6/14/11
Formulrios
n
<form action="mailto:someone@example.com" method="post" enctype="text/plain"> Name:<br /> <input type="text" name="name" size="20" /><br /> Email:<br /> <input type="text" name="email" size="20" /><br /> Comment:<br /> <input type="text" name="comment" size="40" /><br / ><br /> <input type="submit" value="Send" /> <input type="reset" value="Reset" /> </form>
6/14/11
n n n n n n
n n
Formulrios
6/14/11
Frames
6/14/11

Manual XHTML

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Manual XHTML

Uploaded by

Copyright:

Available Formats

+

da linguagem XHTML com as futuras aplicaes.

Diferenas entre XHTML e HTML

Diferenas entre XHTML e HTML

Diferenas entre XHTML e HTML

Diferenas entre XHTML e HTML

Diferenas entre XHTML e HTML

Diferenas entre XHTML e HTML

Diferenas entre XHTML e HTML

Diferenas entre XHTML e HTML

Diferenas entre XHTML e HTML

Diferenas entre XHTML e HTML

Diferenas entre XHTML e HTML

Diferenas entre XHTML e HTML

Diferenas entre XHTML e HTML

Elementos obrigatrios em XHTML

Diferentes DOCTYPES em XHTML

So trs os tipos de DOCTYPE para XHTML: STRICT TRANSITIONAL FRAMESET

Diferentes DOCTYPES em XHTML

Diferentes DOCTYPES em XHTML

Diferentes DOCTYPES em XHTML

Diferentes DOCTYPES em XHTML

Caminhos relativos e Absolutos

Uma ligao relativa pode se parecer com:...

<a href=../aulas-ambiente-internet.xhtml> Notas de aulas </ a>

e uma ligao absoluta:

<a href=http://www.lrodrigo.cjb.net/estacio/aulas-ambienteinternet.xhtml> Notas de aulas </a>

Separadores de blocos de cdigos

Aqui comea o menu --> -------------------------------------------- >

Aqui comea o menu --> xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx -->

Separadores de blocos de cdigos

Aqui comea o menu --> -------------------------------------------- >

Aqui comea o menu --> xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx -->

Separadores de blocos de cdigos

Todas as tabelas devem conter:

Ttulo Cabealho Corpo Rodape

You might also like