Your SlideShare is downloading. ×
0
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Desenvolvimento para a Internet - Aula 02
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Desenvolvimento para a Internet - Aula 02

2,085

Published on

0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,085
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
0
Comments
0
Likes
4
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Aula 2 - HTML Editores e Documento HTML / XHTML Prof. Leandro Rezende Carneiro de Mendonça, MSc.
  • 2. Editores HTML <ul><li>Página Web : basicamente um arquivo de texto, escrito em uma linguagem. </li></ul><ul><ul><li>Página HTML (arquivo de texto ASCII, contendo tag’s HTML e extensão .htm ou .html). </li></ul></ul><ul><li>Criação de uma página Web : pode ser auxiliada com editores WYSIWYG (What You See Is What You Get). </li></ul><ul><ul><li>Editores WYSIWYG: Macromedia Dreamweaver, Microsoft FrontPage, NVU etc… </li></ul></ul>
  • 3. Editores HTML - Dreamweaver
  • 4. Editores HTML - FrontPage
  • 5. Editores HTML - NVU
  • 6. Documento HTML <ul><li>Visualização de uma página : </li></ul><ul><ul><li>Solicitação HTTP (Navegador -> Servidor Web). </li></ul></ul><ul><ul><li>O Servidor recebe a solicitação e verifica se possui a página solicitada. </li></ul></ul><ul><ul><li>Em caso afirmativo o servidor empacota o conteúdo HTML (utilizando TCP) e os endereça (utilizando HTTP) e os envia através da rede. </li></ul></ul>
  • 7. Documento HTML <ul><ul><li>Se o servidor Web não encontra a informação solicitada, ele constrói uma página contendo uma mensagem de erro, empacota esta página e a envia ao navegador do cliente. </li></ul></ul><ul><ul><li>A mensagem enviada pelo servidor Web ao navegador é denominada Resposta HTTP . </li></ul></ul>
  • 8. Documento HTML <ul><li>Informações Transportadas </li></ul><ul><ul><li>URL ( U niform R esource L ocator ). </li></ul></ul><ul><ul><li>Cabeçalho HTTP. </li></ul></ul><ul><ul><li>Corpo HTTP. </li></ul></ul>
  • 9. Arquitetura Cliente Servidor
  • 10. Documento HTML <ul><li>Acrônimo de H yper T ext M arkup L anguage (L inguagem de Marcação de Hipertexto). </li></ul>
  • 11. Documento HTML <ul><li>Exemplo: </li></ul><ul><li>Documento HTML </li></ul>
  • 12. Documento HTML <ul><li>Tags HTML </li></ul>
  • 13. Documento HTML <ul><li>Exemplo: </li></ul><ul><li>exemplo_tag.html </li></ul>
  • 14. Documento HTML <ul><li>Categorias de Marcadores (Tags): </li></ul><ul><ul><li>Estruturais: são marcadores que determinam a estrutura de um documento, dando a esse sua forma e integridade. Ex: <p>, <h1> etc... </li></ul></ul><ul><ul><li>Estilísticos : são marcadores que indicam como o conteúdo de um elemento será apresentado no navegador. Ex: <b>, <i> etc... </li></ul></ul><ul><ul><li>Descritivos : são conhecidos também como marcadores semânticos e descrevem a natureza do conteúdo de um elemento. Ex: <title>, <address> etc... </li></ul></ul>
  • 15. XML e HTML = XHTML <ul><li>XHTML : linguagem que utiliza o vocabulário de HTML com a sintaxe de XML. </li></ul><ul><li>Como documentos XHTML utilizam a gramática de XML eles podem ser analisados e apresentados por agentes que lêem documentos XML. </li></ul>
  • 16. XML e HTML = XHTML <ul><li>Importância de HTML : linguagem amplamente utilizada por milhões de pessoas. </li></ul><ul><li>A Introdução de alterações no padrão implica em Problemas que implica em Solução que implica em Reformulação da linguagem HTML. </li></ul><ul><li>Melhor solução : unir as melhores características de cada uma delas. </li></ul>
  • 17. XML e HTML = XHTML <ul><li>Benefícios da XHTML: </li></ul><ul><ul><li>Portabilidade : utilizando-se documentos bem formados, qualquer que seja o navegador utilizado, um documento será visualizado sempre da mesma maneira. A apresentação torna-se independente do navegador, fato que não ocorre hoje com HTML. </li></ul></ul><ul><ul><li>Facilidades de extensão da linguagem através dos DTD . </li></ul></ul>
  • 18. Diferenças entre HTML e XHTML <ul><li>Um documento XHTML deve fornecer a declaração de um DTD no início do documento </li></ul><ul><ul><li><!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Transitional//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&quot;> </li></ul></ul>
  • 19. Diferenças entre HTML e XHTML
  • 20. Diferenças entre HTML e XHTML <ul><li>Deve-se incluir uma referência ao namespace XML no elemento <html> do documento </li></ul><ul><ul><li><html xmlns=&quot;http://www.w3.org/1999/xhtml&quot;> </li></ul></ul>
  • 21. Diferenças entre HTML e XHTML
  • 22. Documento XHTML <ul><li>Exemplo: </li></ul><ul><li>estrutura_documento_xhtml.xhtml </li></ul>
  • 23. Diferenças entre HTML e XHTML <ul><li>XML diferencia letras maiúsculas de minúsculas (linguagem case sensitive ). </li></ul><ul><li>Os marcadores XHTML devem ser inseridos em letras minúsculas. </li></ul>
  • 24. Diferenças entre HTML e XHTML <ul><li>Todos os marcadores iniciados devem ser fechados “ documentos bem formados ”. </li></ul><ul><li>Não se pode omitir os marcadores <head> e <body> e o primeiro elemento do elemento head deve ser o marcador <title>. </li></ul>
  • 25. Diferenças entre HTML e XHTML <ul><li>Exemplo de Documentos mal formados : </li></ul><ul><ul><li>documento_html_mal_formado.html </li></ul></ul><ul><ul><li>documento_xhtml_mal_formado.xhtml </li></ul></ul>
  • 26. Diferenças entre HTML e XHTML <ul><li>Todos os atributos de um elemento devem ser apresentados entre aspas. </li></ul><ul><li>Elementos vazios : escrever estes elementos com um espaço entre o nome do marcador e a barra <br />. </li></ul>
  • 27. Diferenças entre HTML e XHTML <ul><li>Todos os atributos de um elemento devem ser apresentados entre aspas e não devem ser simplificados. </li></ul><ul><li>Elementos vazios : escrever estes elementos com um espaço entre o nome do marcador e a barra <br />. </li></ul>
  • 28. Diferenças entre HTML e XHTML <ul><li>Elementos sem conteúdo : e lementos que não sejam elementos vazios devem sempre utilizar os marcadores de abertura e fechamento <title> </title> </li></ul>
  • 29. Informações <ul><li>W3C </li></ul><ul><ul><li>http://www.w3c.org </li></ul></ul><ul><li>Macromedia Dreamweaver </li></ul><ul><ul><li>http://www.macromedia.com </li></ul></ul><ul><li>Microsoft FrontPage </li></ul><ul><ul><li>http://www.microsoft.com </li></ul></ul><ul><li>NVU / N-View </li></ul><ul><ul><li>http:// www.nvu.com </li></ul></ul>
  • 30. Perguntas? <ul><li>boolean duvida; </li></ul><ul><li>String pergunta=“”, resposta=“”; </li></ul><ul><li>Read (duvida); </li></ul><ul><li>while (duvida){ </li></ul><ul><li>Read (pergunta, resposta); </li></ul><ul><li>System.out.println (pegunta+resposta); </li></ul><ul><li>Read (duvida); </li></ul><ul><li>} </li></ul><ul><li>System.out.println (“Congratulações”); </li></ul><ul><li>System.exit (0); </li></ul>
  • 31. Atividade <ul><li>Elaborar uma página HTML no Notepad , contendo título e alguma informação textual no corpo do documento. </li></ul><ul><li>Salvar o documento com o nome: </li></ul><ul><ul><li>index.htm </li></ul></ul><ul><li>Visualizar o resultado no Navegador. </li></ul>

×