Ambientes de DesenvolvimentoXML-XHTML
Paulo Sousa
ISEP/IPP
Portugal
XML-XHTML 2
Conteúdo
Tecnologias XML
XML
DTD
XHTML
XML-XHTML 3
Tecnologias XML
Um conjunto de tecnologias para representação e manipulação de dados (essencialmente) para sistemas desenvolvidos sobre a Internet
Quase na totalidade normas W3C
XML
XSL-T
XSL-FO
XSDDTD
SOAP
.NET
XLink
XPointer
XHTML
SAX
XML-XHTML 4
URL
XML-XHTML 5
XML
XML = eXtensible Markup Language Baseada em SGML Elementos + atributos Case-sensitive Atributos entre aspas ou pelicas Bem formada
“Língua Franca” para a representação de dados (estruturados)
XML-XHTML 6
XML (2)
Firewall Firewall
Internet
Server Server
Workstation
PC
Laptop
Workstation
iMac
PDAPDA
.xml
XML-XHTML 7
<?xml version="1.0"?><pessoas>
<pessoa id='1'><nome>Manuel</nome><data-nascimento>
<dia>2</dia><mes>5</mes><ano>1922</ano>
</data-nascimento><telefone rede='TMN' num='964123456' />
</pessoa> </pessoas>
XML (3)
Exemplo documento XML
Indicação XML
Raiz do documento
Elemento com atributo
Elemento sem dados
Demo
Demo
XML-XHTML 8
XML (4)
pessoas
Data-nascimentonome telefone
pessoapessoa pessoa
mesdia ano
... ...
XML-XHTML 9
XML (5)
Exercício Criar um documento XML para CDs e visualizar no
browser
Dicas Caracteres portugueses
<?xml version="1.0" encoding="ISO-8859-1" ?>
XML-XHTML 10
XML (6)
Solução possível
<?xml version="1.0"?><CDs>
<cd titulo=“All that you can’t leave behind”><artista>U2</artista><data-lancamento formato=‘Ma’>Outubro 2000</data-lancamento><editora>Polygram Records</editora><faixas quant=‘11’ duracao=’44:47’>
<faixa num=‘1’ titulo=‘Beautiful Day’ duracao=‘4:08’><letra>Bono</letra><musica></musica>
</faixa>...
</faixas></cd> ...
</CDs>
“lista” de faixas
Atributo dá significado/interpretação
ao conteúdo
Demo
Demo
XML-XHTML 11
XML (7)
Problema...
Cada pessoa fez a sua solução Nome dos elementos Nome dos atributos Ordem e agrupamento dos elementos Ordem e agrupamento dos atributos Significado dos elementos Significado dos atributos
XML-XHTML 12
DTD
DTD = Document Type Definition
Regras de validação da sintaxe de documentos XML
Embutido no documento ou externo
Utilizado por editores de XML para garantir a conformidade de um documento
XML-XHTML 13
<!ELEMENT pessoas (pessoa*)><!ELEMENT pessoa (nome, data-nascimento?, telemovel?)><!ATTLIST pessoa id CDATA #REQUIRED><!ELEMENT nome (#PCDATA)><!ELEMENT data-nascimento (dia, mes, ano)><!ELEMENT dia (#PCDATA)><!ELEMENT mes (#PCDATA)><!ELEMENT ano (#PCDATA)><!ELEMENT telefone EMPTY><!ATTLIST telefone rede CDATA #IMPLIED><!ATTLIST telefone num CDATA #REQUIRED>
DTD (2)
Exemplo de DTDElemento composto por
repetições de outro elemento
Elemento opcional
Lista de atributos de um elemento (facultativos e
obrigatórios)
Elemento sem dados
CodeCode
XML-XHTML 14
DTD (3)
Sintaxe Elementos:
!ELEMENT nome-elemento composição
Atributos: !ATTLIST nome-elemento nome-atributo tipo-dados tipo-valor
Agrupamentos & Cardinalidade: () , | * ? +
Tipo de dados: #PCDATA ou CDATA ou EMPTY ou ANY
Tipo de valor: #REQUIRED ou #IMPLIED ou #FIXED
XML-XHTML 15
<?xml version="1.0"?><!DOCTYPE pessoas [<!ELEMENT pessoas (pessoa*)><!ELEMENT pessoa (nome, data-nascimento?, telemovel?)><!ATTLIST pessoa id CDATA #REQUIRED><!ELEMENT nome (#PCDATA)><!ELEMENT data-nascimento (dia, mes, ano)><!ELEMENT dia (#PCDATA)><!ELEMENT mes (#PCDATA)><!ELEMENT ano (#PCDATA)><!ELEMENT telefone EMPTY><!ATTLIST telefone rede CDATA #IMPLIED><!ATTLIST telefone num CDATA #REQUIRED>
]><pessoas>
...</pessoas>
DTD (4)
DTD embutido num documento XML
Inicio DTD
Fim do DTD embutido
Conteúdo XML
Conteúdo DTD
CodeCode
XML-XHTML 16
<?xml version="1.0"?><!DOCTYPE pessoas SYSTEM “pessoas.dtd”><pessoas>
<pessoa id='1'><nome>Manuel</nome><data-nascimento><dia>2</dia><mes>5</mes><ano>1922</ano></data-nascimento><telefone rede='TMN' num='964123456' />
</pessoa>...
</pessoas>
DTD (5)
DTD externo ao documento XML
Indicação DTD externo e localização (URL)
Ficheiro pessoas.dtd tem o conteúdo DTD
XML-XHTML 17
DTD (6)
Exercícios Criar um DTD externo para documento XML de
exercício anterior: CDs
Utilizando um editor XML (por ex. XML Writer) validar o documento XML de acordo com DTD elaborado
Solução CodeCode
XML-XHTML 18
XHTML
XHTML = eXtensible HTML HTML = HyperText Markup Language Etiquetas que especificam formatação de páginas
web Estende o HTML usando as regras do XML e
“forçando” o HTML a ser um dialecto XML Especificação W3C
http://www.w3.org/TR/xhtml1/ http://www.w3.org/TR/html401/
XML-XHTML 19
<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>Virtual Library</title> </head> <body> <p>Moved to <a href="http://vlib.org/">vlib.org</a>.</p> </body></html>
XHTML (2)
Exemplo documento XHTML
Indicação XML
Especificação DTD
Raiz do documento
cabeçalho
Demo
Demo
Corpo do documento
XML-XHTML 20
XHTML (3)
1º) indicação de documento XML e codificação dos caracteres. <?xml version="1.0" encoding="UTF-8"?> UTF-16 ou ISO-8859-1 para caracteres em Português
2º) indicação do DTD para XHTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Strict//EN“ "DTD/xhtml1-strict.dtd">
3º) conteúdo do documento <html xmlns="http://www.w3.org/1999/xhtml"
xml:lang="en" lang="en">
XML-XHTML 21
XHTML (4)
4º) cabeçalho <head> ... </head>
Conteúdo possível: Título do documento <title>texto</title> Meta-dados <meta name=‘nome’ content=‘conteúdo’ />
XML-XHTML 22
XHTML (5)
5º) corpo do documento <body>conteúdo</body>
Alguns atributos Cor de fundo para o documento bgcolor=‘cor’ Imagem de fundo para o documento background=‘URL’
XML-XHTML 23
XHTML (6)
Conteúdo possível Parágrafos <p>texto</p> Mudanças de linha <br /> Separadores horizontais <hr /> Caracteres especiais & < > ã á à â
€ ç
XML-XHTML 24
XHTML (7)
Conteúdo possível (cont.) headings <h1>texto</h1> até <h9>texto</h9> Enfatizar ou itálico <em>texto</em> ou <i>texto</i> Realçar ou negrito <strong>texto</strong> ou <b>texto</b> Sublinhar <u>texto</u>
XML-XHTML 25
XHTML (8)
Conteúdo possível (cont.) Formatação de código fonte <code>texto</code> Texto pré-formatado <pre>texto</pre> Hiperligações <a href=‘URL’>texto</a> Imagens <img alt=‘texto’ src=‘URL’ />
XML-XHTML 26
XHTML (9)
Conteúdo possível (cont.) Listas ordenadas <ol>itens</ol> Listas de pontos <ul>itens</ul> Item de uma lista <li>texto</li>
Demo
Demo
XML-XHTML 27
XHTML (10)
Conteúdo possível (cont.) Tabelas <table>tabela</table> Linhas de uma tabela <tr>itens</tr> Uma célula como cabeçalho de uma tabela <th>itens</th> Célula normal de uma linha de tabela <td>texto</td> Dem
oDem
o
XML-XHTML 28
XHTML (11)
Conteúdo possível (cont.) Alguns atributos para os elementos de tabelas border=‘grossura’ aplica-se: table width=‘comprimento’ aplica-se: table tr th td height=‘altura’ aplica-se: table tr th td celpadding=‘pix’ aplica-se: table celspacing=‘pix’ aplica-se: table colspan=‘pix’ aplica-se: th td rowspan=‘pix’ aplica-se: tr Dem
oDem
o
XML-XHTML 29
XHTML (12)
Exercício Elabore uma pequena página pessoal ou acerca de um
assunto de seu interesse usando as diferentes etiquetas apresentadas.