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

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

Design para Web 3 XHTML.

Apresentações semelhantes


Apresentação em tema: "Design para Web 3 XHTML."— Transcrição da apresentação:

1 Design para Web Http://tertuliano.wetpaint.com

2 3 XHTML

3 XHTML  De onde veio o XHTML? html para html - Documentação pouco amarrada. Estudo do xml, perfeita documentação para tratar informação. XHTML, uma Meta linguagem feita do XML

4 XHTML  Razões para usar XHTML: XHTML é o padrão de marcação atual, substituindo a HTML; utilização de regras de sintaxe mais precisas e rigorosas; criação de documentos mais consistentes; facilidade de manutenção; extensão do cliente Web além do navegador: PDAs, celulares e outros dispositivos móveis; iniciação dos desenvolvedores Web no ambiente XML.

5 XHTML  As tags… São estruturas de linguagem de marcação que consistem em breves instruções, tendo uma marca de início e outra de fim.linguagem de marcação... Ou

6 XHTML  XHTML Básico.. Seção.. (,.., ) Cabeçalho de texto.. Texto pré-formatado Nova linha.. Parágrafo.. Corpo.. Título.. Cabeçalho.. Documento Tag/AtributosElemento

7 XHTML  XHTML Básico.. Variável/Argumento de programa.. Saída de programa.. Entrada de programa.. Código de programa.. Citação.. Texto fortemente enfatizado.. Texto enfatizado Tag/AtributosElemento

8 XHTML  XHTML Básico - estruturação

9 XHTML  XHTML Básico - estruturação Interessante: http://www.aharef.info/static/htmlgraph/

10 XHTML  XHTML Básico - estruturação Técnica de identação.

11  Elementos obrigatórios em um documento XHTML Título do documento Conteúdo do documento

12 XHTML  Para que serve o DOCTYPE ? A XHTML permite que desenvolvedores criem diversos tipos diferentes de documentos, cada um definido por regras diferentes. As regras de cada tipo são detalhadas na Definição do Tipo de Documento (Document Type Definitions - DTD). Sua declaração DOCTYPE informa aos serviços de validação e aos navegadores modernos qual DTD foi utilizada para elaborar a marcação. Esta deve ser sempre a primeira declaração em um documento Web.

13 XHTML  Os tipos de DOCTYPE STRICT TRANSITIONAL FRAMESET

14 XHTML  Os tipos de DOCTYPE XHTML 1.0 Strict XHTML 1.0 Transitional XHTML 1.0 Frameset

15 XHTML  A declaração namespace A declaração DOCTYPE é imediatamente seguida por uma declaração de namespace em XHTML, associada ao elemento raiz html. Um namespace em XML é uma coleção de tipos de elementos e nomes de atributos associados a um DTD específico. A declaração namespace indica a sua localização.

16 XHTML  Declarando o tipo do conteúdo Para serem interpretados corretamente por navegadores e aprovados nos testes de validação de marcação, todos os documentos XHTML devem declarar o tipo de codificação de caractere que foi usado em sua criação (Unicode, ISO-8859-1, etc). Existem duas formas de fazer isso: version="1.0" encoding="iso-8859-1">

17 Mandamentos XHTML  XHTML 1.todas as tags devem ser escritas em letras minúsculas; 2.o tratamento dos atributos; 3.o uso de tags de fechamento é obrigatório; 4.as tags vazias devem ser fechadas; 5.as tags devem estar convenientemente aninhadas; 6.o tratamento dos comentários.

18 1.Escreverás todas as tags em letras minúsculas Errado: Aqui um texto Certo: Aqui um texto Mandamentos XHTML

19 2. Tratarás os atributos: nomes de atributos. Errado:... Certo:... Mandamentos XHTML

20 valores de atributos. Errado:... Certo:... Mandamentos XHTML

21 sintaxe dos atributos. Errado: Certo: Mandamentos XHTML

22 os atributos id e name. Errado: Certo: Ou: <img src="imagem.gif" id="minha_imagem“ name="minha_imagem" /> Mandamentos XHTML

23 o atributo alt para imagens. Certo: Ou: Mandamentos XHTML

24 3. O uso de tags de fechamento é obrigatório. Errado: Um parágrafo. Outro parágrafo. Certo: Um parágrafo. Outro parágrafo. Mandamentos XHTML

25 4. As tags vazias devem ser fechadas. Errado: Elementos vazios sem terminação Certo: Elementos vazios com terminação Mandamentos XHTML

26 5. As tags devem estar convenientemente aninhadas. Errado: Aqui um texto itálico Certo: Aqui um texto itálico Mandamentos XHTML

27 6. O tratamento dos comentários. Errado: código XHTML do menu Certo: código XHTML do menu Mandamentos XHTML

28 6. O tratamento dos comentários. Errado: código XHTML do menu Certo: código XHTML do menu Mandamentos XHTML

29 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dt ="http://www.w3.org/1999/xhtml XHTML : Testando os elementos Hn O autor do documento. Questões de copyright Importantíssimo: palavras chave para o motor de busca do Google e Yahoo. Descrição do conteúdo da página Nivel 1 Nivel 2 Nivel 3 Nivel 4 Nivel 5 Nivel 6 Exemplo - XHTML

30 XHTML  XHTML Básico Exercícios... O uso das regras básicas do XHTML Utilizando as Tags básicas dos documento XHTML, criar uma página de apresentação de um produto. Como se fosse um anuncio para venda. Pode utilizar as tag´s básicas ou as demais tags apresentadas na apostila. Conter o máximo de elementos XHTML e apresentar de forma atraente e ordenada

31 Web Semântica  Exemplo prático Diferenças visuais - Existe? Diferenças no código - Existe? Quais? Quantidade de Kbs - Existe diferença? Quantidade de Caractere - Existe diferença? http://tertuliano.wetpaint.com/page/XHTML

32  Exercício desafio: Jogo dos 10 erros: http://tertuliano.wetpaint.com/page/XHTML Verificador de erros: http://validator.w3.org/ Web Semântica


Carregar ppt "Design para Web 3 XHTML."

Apresentações semelhantes


Anúncios Google