Your SlideShare is downloading. ×
0
Módulo: 4 – Desenvolvimento de Páginas Web Estáticas:  HTML DOCTYPE
Módulo: 4 – Desenvolvimento de Páginas Web Estáticas:  HTML DOCTYPE
Módulo: 4 – Desenvolvimento de Páginas Web Estáticas:  HTML DOCTYPE
Módulo: 4 – Desenvolvimento de Páginas Web Estáticas:  HTML DOCTYPE
Módulo: 4 – Desenvolvimento de Páginas Web Estáticas:  HTML DOCTYPE
Módulo: 4 – Desenvolvimento de Páginas Web Estáticas:  HTML DOCTYPE
Módulo: 4 – Desenvolvimento de Páginas Web Estáticas:  HTML DOCTYPE
Módulo: 4 – Desenvolvimento de Páginas Web Estáticas:  HTML DOCTYPE
Módulo: 4 – Desenvolvimento de Páginas Web Estáticas:  HTML DOCTYPE
Módulo: 4 – Desenvolvimento de Páginas Web Estáticas:  HTML DOCTYPE
Módulo: 4 – Desenvolvimento de Páginas Web Estáticas:  HTML DOCTYPE
Módulo: 4 – Desenvolvimento de Páginas Web Estáticas:  HTML DOCTYPE
Módulo: 4 – Desenvolvimento de Páginas Web Estáticas:  HTML DOCTYPE
Módulo: 4 – Desenvolvimento de Páginas Web Estáticas:  HTML DOCTYPE
Módulo: 4 – Desenvolvimento de Páginas Web Estáticas:  HTML DOCTYPE
Módulo: 4 – Desenvolvimento de Páginas Web Estáticas:  HTML DOCTYPE
Módulo: 4 – Desenvolvimento de Páginas Web Estáticas:  HTML DOCTYPE
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

Módulo: 4 – Desenvolvimento de Páginas Web Estáticas: HTML DOCTYPE

2,541

Published on

Curso Técnico de Gestão e Programação de Sistema Informáticos, ano lectivo 2010/2011.

Curso Técnico de Gestão e Programação de Sistema Informáticos, ano lectivo 2010/2011.

Published in: Education
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
2,541
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
63
Comments
0
Likes
0
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. DTD HTML Agrupamento de EscolasdaBatalha MiguelaFernandes Novembro 2010
  • 2. Sumário Iremos abordar: Revisões TAG - META DTS – definição DTS – browser DTS – tipos DTS – exemplos Exercício prático MF. 2 DTS HTML
  • 3. Revisões - estrutura da página Estrutura da página HTML: html> <head> <title>Título da Página</title> <meta http-equiv=“Content-Type” content=“text/html; charset=iso-8859-1”> </head> <bodybgcolor=“#CCCCCC”> Aulas de Redes de Comunicação </body> </html> MF. 3
  • 4. Revisões - tags <html> e </html> - Início e Fim do conteúdo de um documento HTML <head> e </head> - Área reservada para o cabeçalho <title> e </title> - Define o título da página <body> e </body> - Corpo do documento. Onde será inserido o conteúdo da página. MF. 4
  • 5. TAG – META (1) <meta> - utilizada pelos programadores para definir quais serão as palavras utilizadas para procurar nos sites de busca. Ex: <title>Cisco Systems, Inc</title> <meta http-equiv="Content-type“content="text/html; charset=UTF-8"/> <meta name="concept" content="Welcome to Cisco"/> <meta name="accessLevel" content="Guest"/> <meta name="country" content="US"/> <meta name="og: title" content="Welcome to Cisco"/> MF. 5
  • 6. TAG – META (2) <meta name=“Author” content=“MF”> Define quem foi o criador da página HTML <meta name=“Keywords” content=“aula, html, css, RC”> - Define quais palavras-chaves que poderão ser utilizadas pelos sites de busca <meta http-equiv=“Content-type” contet=“text/html; charset=iso-8859-1”> - Especifica o conjunto de caracteres utilizados na página: iso-8859-1 MF. 6
  • 7. DTS: definição (1) DocumentTypeDefinition - indica ao browser o tipo de formato e versão (HTML 3.2, HTML 4.01, XHTML, etc.) em que a página está escrita, informa-o como agir. Coloca-se na 1ª linha da página, antes da tag<html>. O browser entende que deve tratar a página conforme os padrões da W3C*. O elemento doctypemesmo estando entre <> não é uma tag, mas sim uma instrução. MF. 7 * http://www.w3.org/QA/2002/04/valid-dtd-list.html#DTD
  • 8. DTS : definição (2) Exemplo simples: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd"> <HTML> …… A declaração DOCTYPE está dividida em duas partes, um identificador público (publicidentifier) e um URL. MF. 8
  • 9. DTS : definição (3) Identificador público PUBLIC "-//W3C//DTD HTML 4.01//EN“ URL - endereço do DTD na Internethttp://www.w3.org/TR/html4/strict.dtd MF. 9
  • 10. DTS - browser Um browser, ao encontrar a declaração DOCTYPE, não vai ler o documento referido no URLe interpretar o HTML de acordo com este. Porém, vai basear-se no identificador público e na presença ou não do URL para decidir como interpretar o documento. Esta decisão vai ter influência na forma como os estilos CSS são aplicados ao documento HTML. MF. 10
  • 11. DTS – 3 tipos Existem 3 tipos de DTDs para HTML/CSS: Strict – Permite todos elementos e atributos que não estão obsoletos ou que não usam o frameset (usar). Transitional – engloba DTD strict mais elementos e atributos obsoletos (formatações visuais). Frameset – usada com páginas HTML que utilizem framesets (evitar). MF. 11
  • 12. DTS – Strict Permite todos elementos e atributos que não estão obsoletos ou que não usam o frameset (usar). Exemplo: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN“ http://www.w3.org/TR/html4/strict.dtd"> MF. 12
  • 13. DTS – Transitional Engloba DTD strict mais elementos e atributos obsoletos (formatações visuais). Exemplo: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> MF. 13
  • 14. DTS – Frameset Usada com páginas HTML que utilizem framesets(evitar). Exemplo: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> MF. 14
  • 15. DTS - exemplo <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html><head><title>Title of the document</title></head><body>Página de redes de comunicação......</body></html> MF. 15
  • 16. Exercício prático Verifica que tipo de DTDs usam os seguintes sites: http://www.w3.org/TR/html4/struct/global.html _____________________ http://www.w3.org/_____________________ http://www.iol.pt/ _____________________ http://aeiou.expresso.pt/ ____________ _________ MF. 16
  • 17. Webgrafia e Bibliografia http://www.w3.org/TR/html4/sgml/dtd.html http://www.speaking-in-styles.com/index.php/the-book/css-dhtml-ajax-visual-quickstart-guide/ http://www.obasicodaweb.com/html-esqueleto-de-um-documento-html-parte-1-doctype/ Teagu, J. C. (2004). DHTML and CSS for the World Wide Web (2ª Ed.). USA:Peachpit Press. Validar CSS: http://jigsaw.w3.org/css-validator/ Validar HTML http://validator.w3.org/ MF. 17

×