A apresentação está carregando. Por favor, espere

A apresentação está carregando. Por favor, espere

Desenvolvimento em Ambiente WEB Estrutura de um Documento Profº Alex Mazo XHTML.

Apresentações semelhantes


Apresentação em tema: "Desenvolvimento em Ambiente WEB Estrutura de um Documento Profº Alex Mazo XHTML."— Transcrição da apresentação:

1 Desenvolvimento em Ambiente WEB Estrutura de um Documento Profº Alex Mazo alexmazo@bol.com.br XHTML

2 Fontes utilizadas no slide Proffitt, Brian, Xhtml - Desenvolvimento Web. Editora: Makron Books. Lemary, Laura. Aprenda a criar páginas Web com HTML e XHTML em 21 dias. Ed. Makron Books, 2002.

3 Estrutura de um Documento Planejar a construção do tipo de documento:  Introdução;  Corpo;  Conclusão. Elementos do documento:  Palavras chaves;  Sintaxe bem definida.

4 Estrutura de um Documento Tipo de documento:  Informar ao navegador a DTD (Document Type Definition) que será usada.  Navegador menos robusto; Dificuldade em abrir partes ou a totalidade da página.

5 Estrutura de um Documento Iniciando um documento.  Elemento ! = Símbolo universal para todos os leitores de documentos SGML. PUBLIC = Documento público. FPI = (Identificador público formal) – DTD da W3cC para a linguagem XHTML 1.0 no idioma inglês. strict = CSSs (folhas de estilo em cascata). W3C = atalho para WWWC (World Wide Web Consortium); Responśavel pela manutenção dos padrões da linguagem XHTML na Internet.

6  Estabelecendo o Tipo de Documento Estrutura de um documento DOCTYPE HTML PUBLIC W3C - DTD HTML 4.0 EN http://www.w3.org/TR/REC=html140/strict.dtd Strict.dtd

7 Estrutura de um Documento Estabelecendo o Tipo de Documento  Quando um documento HTML é criado, A DTD que ele precisa referenciar está contida dentro do elemento. Em XHTML 1.0, três DTDs específicas podem ser referenciadas:

8 Estrutura de um Documento Estabelecendo o Tipo de Documento  Strict  Loose (Transitional)  Frameset

9 Estrutura de um Documento Strict  Um documento XHTML do tipo strict (estrito) é aquele que está totalmente de acordo com o padrão XHTML 1.0.  Apenas documentos que se enquadram nesse padrão estão contidos dentro do documento.

10 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd"> Documento HTML "strict" No Início... Este é o primeiro parágrafo. Que é seguido por outro parágrafo.

11 Estrutura de um Documento Loose  Essa DTD que também é conhecida como DTD transitional (transicional) é atualmente a mais utilizada para HTML e XHTML na Web.  Sua principal diferença com relação a DTD strict é a possibilidade de exibição de alguns elementos específicos de navegadores ou elementos que tenham sido reprovados ou eliminados do HTML 4.0.

12 Documento HTML "transitional" O elemento marquee é uma tag específica de navegador. Alguns navegadores criaram suas próprias tags, independentemente de quais sejam os padrões. A tag marquee acima é um desses elementos. Um documento DTD strict não deverá ser capaz de exibir este elemento. Além disso, uma vez que atualmente poucos navegadores não suportam folhas de estilo em cascata, algumas vezes é necessário usar tags de apresentação que fazem parte de padrões HTML mais antigos, como a tag font.

13 Estrutura de um Documento Frameset  A DTD frameset (conjunto de quadros) é utilizada sempre que um documento contenha frames no seu interior.

14 <!DOCTYPE HTML PUBLIC "- //W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/ DTD/frameset.dtd"> Documento XHTML frameset

15 Estrutura de um Documento Validador  Para verificar se um documento segue o padrão DTD declarado, utilize um aplicativo que verifique automaticamente o seu documento.  Um dos melhores validadores disponíveis é: http://validator.w3.org http://validator.w3.org  Tudo o que você precisa fazer é digitar o endereço da sua própria página Web, e o validador lhe informará a compatibilidade do seu documento.

16 Estrutura de um Documento Contêineres.  Armazenar o conteúdo do seu documento.  O elemento é o contêiner de todo o documento XHTML, é vital que a tag seja a última de todas as tags.

17 Estrutura de um Documento Espaços de Nomes XML Entendo melhor o XML. O XML é um subconjunto do SGML; Sem qualquer relação com HTML; Derivado do SGML; Orientada a Conteúdo: Os elementos criados abrangem totalmente a estrutura de um documento.

18 Estrutura de um Documento Então porque usar XHTML?  Entendendo melhor o XHTML; Linguagem híbrida;  Combina os melhores recursos HTML com a capacidade XML para a criação de elementos personalizados; Capacidade de ser modularizado;  PDAs, Celulares, Consoles.

19 Estrutura de um Documento E como utilizar o XHTML com o XML?  Declarando um espaço de nomes: http://www.w3.org/TR/xhtml1/DTD/transitional.dtd xmlns:memo http://www.conteudo.org/schema  Esse exemplo atribui o espaço de nomes para um esquema localizado em outro site web e o associa a uma parte local: memo

20 Exemplo 1 Um memorando em HTML Para: Bill Johnson De: Kathy Whitmore Assunto: A próxima reunião trimestral da equipe Caro Bill: Você poderia informar a sua equipe a respeito da próxima reunião geral que se dará às 15 horas do dia 31 de março na sala de conferências Cordier? Grata, Kathy

21 Exemplo 2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml11/DTD/transitional.dtd"> Um memorando em XHTML Bill Johnson Kathy Whitmore A próxima reunião trimestral da equipe Caro Bill: Você poderia informar a sua equipe a respeito da próxima reunião geral que se dará às 15 horas do dia 31 de março na sala de conferências Cordier? Grata, Kathy

22 Estrutura de um Documento Espaço de nomes:  O exemplo 2 atribui espaço de nomes para um esquema localizado em outro site Web e o associa a uma parte local: memo. Agora toda vez que um elemento contiver: memo, o leitor do documento aplicará os atributos do elemento baseado no que o leitor encontrar no esquema.

23 Estrutura de um Documento Cabeçalhos:  Elemento ; Elementos encontrados no ;  base, link, meta, script, style, title. ;  Exibir um texto na barra de título do navegador;  Adição de fontes de apresentação adicional não funciona.

24 HTML é Fácil! O título deste documento é "HTML é Fácil!"

25 XHTML é Fácil ! O título deste documento é "XHTML é Fácil !"

26 Estrutura de um Documento   Define informações a respeito de um documento que nem sempre estão incluídas no conteúdo visível do documento.  Tipos de elementos AutlhorClassification CopyrigthDescription FormatterGenerator KeywordsRating Robots

27 Estrutura de um Documento  Estabelece a localização na Internet (URL). Usando a Tag Base http://www.conteudo.com/index.html

28 Estrutura de um Documento Corpo:  Elemento ; Controlando cores;  Forma simples de estilizar o seu documento XHTML.  Atributos; bgcolor; background.

29 Estrutura de um Documento  bgcolor; Apresenta tanto um nome de cor como um número hexadecimal de seis dígitos;  RGB. Red, Green, Blue.

30 Estrutura de um Documento Cores para Páginas da Web Esta página apresenta uma cor de fundo azul-clara.

31 Estrutura de um Documento CorValorCorValor Aqua00FFFFNavy000080 Black000000Olive808000 Blue0000FFPurple808000 FuchsiaFF00FFRedFF0000 Gray808080SilverC0C0C0 Green008000Teal008080 Lime00FF00WhiteFFFFFF Maroon800000YellowFFFF00 Cores padrão em HTML

32 Estrutura de um Documento  Caracteres Coloridos; Textos.  Atributo text do elemento. Cores em Textos Cuidado com a escolha das cores.

33 Estrutura de um Documento  Caracteres Coloridos; Links  Os links são coloridos para indicar seu status e para serem vistos com mais facilidade. Atributos:  link, alink e vlink Os valores das cores para esses atributos são atribuídos pelos nomes das cores ou por um valor RGB.

34 Estrutura de um Documento Biografias On-Line Autores Famosos Dê um clique nos links abaixo para visualizar biografias resumidas dos seus autores favoritos ao longo da história. Homero William Shakespeare Jonathon Swift Mark Twain

35 Estrutura de um Documento  Scripts; Atributos:  Projetados para iniciar scripts quando uma página é inicialmente carregada ou descarregada. onload. onunload

36 Estrutura de um Documento Exige Senha! <!--início do script...... final do script --> Login <table border="3" cellpadding="2" cellspacing="5" bgcolor="black" bordercolor="red" bordercolorlight="blue" bordercolordark="red"> ID do usuário : <font size="3" color="turquoise" face="arial"> Senha: <input type="password" size="15" name="senha" maxlength="12">

37 Desenvolvimento em Ambiente WEB Estrutura de um Documento Profº Alex Mazo alexmazo@bol.com.br XHTML


Carregar ppt "Desenvolvimento em Ambiente WEB Estrutura de um Documento Profº Alex Mazo XHTML."

Apresentações semelhantes


Anúncios Google