Carregar apresentação
A apresentação está carregando. Por favor, espere
1
HTML 5 Introdução Prof. Rosemary Melo
2
EVOLUÇÃO DAS LINGUAGENS DE MARCAÇÃO DE HIPERTEXTO
HTML (HyperText Markup Language) desde 1999 ficou estacionada na versão 4.01 sem evolução. XML (Extensible Markup Language) o consórcio W3C decidiu criar uma nova linguagem para melhorar o desempenho para Web. criação das linguagens XML, SVG e XHTML. SVG (Scalable Vector Graphcs) para trabalhar com a parte gráfica. XHTML versão do html baseada no XML. os navegadores não tiveram interesse de mudar radicalmente seus códigos. HTML 5 os navegadores voltaram a desenvolver o próprio htlm. organizações de navegadores como Mozilla, Opera e Apple se uniram para atualizar o HTML e implementar novos e interessantes recursos. os navegadores começaram a ter poder de decisão.
3
HTML 5 1. Objetivos do código HTML mais recente 2. TAG’S básicos da linguagem 3. Linguagens utilizadas no HTML
4
1. OBJETIVOS DA LINGUAGEM HTML 5
especificar comportamento atuais de navegadores que sejam interoperáveis funcionamento em todos os navegadores do mesmo jeito definir a manipulação de erro pela primeira vez começa a tratar erro evoluir a linguagem para autoria mais simples de aplicações web tornar a internet mais simples e mais rápida (dinâmica)
5
Mudanças no HTML 5 aplicações na web cada vez mais imitam as aplicações desktop. a internet torna-se cada vez mais Orientada a Objetos. novas APIs (Interface de Programação de Aplicações) são definidas para DOM (Modelo de Objetos de Documento). DOM é uma Convenção Multiplataforma e independente de linguagem para representação e interação com OBJETOS em documentos HTML. Ex.: aplicação Wix – monta página como se fosse um editor gráfico novas APIs ajudam a arrastar e soltar objetos enviados pelo servidor, como: desenho , vídeos e similares. necessidade de uma padrão aberto livre que possa competir com padrões proprietários como Adobe Flash ou Microsoft SILVERLIGHT.
6
Mudanças no HTML 5 necessidade de trabalhar com linguagens como JavaScript e CSS para poder criar páginas mais dinâmicas sem precisar de animação. Ex.: possibilidade de criar um jogo só com JavaScript sem precisar de plugins como o do Flash.
7
Especificação do HTML 5 Desenvolvida pelo consórcio W3C (World Wide Web Consortium) e pelo grupo WHATWG (Web Hipertext Application Technology Working Group) Versões de especificação do html5: - versão oficial da W3C versão e passível de alteração
8
HTML 5 1. Objetivos do código HTML mais recente 2. TAG’S básicos da linguagem 3. Linguagens utilizadas no HTML
9
2. TAG’S BÁSICOS DA LINGUAGEM
TAG <html> Indica que está criando uma página html TAG <head> especifica o cabeçalho da página TAG <body> especifica o conteúdo da página
10
Estrutura básica do HTML5
2. TAG’S BÁSICOS DA LINGUAGEM Estrutura básica do HTML5 <!DOCTYPE html> <html lang="pt-br"> <head> <meta charset="utf-8"/> <title>Entendendo a estrutura e semântica do HTML5</title> </head> <body> <p>Olá mundo !</p> </body> </html> Informa ao navegador que tem que renderizar uma página html Informa o tipo de linguagem vai usar no html cabeçalho Informa que tipo de caracter vai ser usado na tela corpo
11
2. TAG’S BÁSICOS DA LINGUAGEM
TAG <DOCTYPE> Indica o tipo de documento que será aberto. TAG <head> Área só de informação para a página, não é vista pelo usuário Tudo que é especifico fica nesta área Serve para informar o cabeçalho da página Apresentar as informações meta Informar se tem código JavaScript e CSS
12
2. TAG’S DO HTML 5 Definição de Metas
Comandos encontrados no <head> : Definição de cabeçalho <title> representa o título do documento </title> Ligação com arquivos CSS externos <link rel=“stylesheet” href=“mystyle.css”> Traz código do css para dentro do html Definição de Metas <meta charset="utf-8"/> Comando para chamada de rotinas em JavaScript <script> function myFunction { document.getElementById(“demo”).innerHTML=“Hello JavaScript”; } </script> muito usado para validação do formulário
13
2. TAG’S DO HTML5 Comandos encontrados no <head> :
TAG <meta> serve para informar o navegador que vai renderizar sua página o que ele deve fazer. deve colocar os comandos <meta> separados para cada coisa para o navegador renderizar a página mais rápido. EXEMPLO DE TAGs <meta> <head> <meta charset="utf-8"/> <meta name=“description” content=“Páginas para alunos da Estácio”/> <meta name=“keywords” content=“HTML,CSS,XML,JAVA SCRIPT”/> <meta name=“author” content=“ João Silva”> <meta http-equiv=“refresh” content=“30”> </head> Dica: usar aplicativos da web que definem como montar meta “Como montar meta para página na web ?”
14
HTML 5 1. Objetivos do código HTML mais recente 2. TAG’S básicos da linguagem 3. Linguagens utilizadas no HTML
15
3. LINGUAGENS UTILIZADAS NO HTML5
CSS dita como formatar a apresentação em html serve para descrever a apresentação de páginas LINGUAGEM JAVA SCRIPT linguagem orientada a objetos linguagem de programação no lado do cliente pode modificar várias coisas no lado do cliente trata todos os elementos da página como objetos distintos serve para criar páginas web dinâmicas e interativas DOM modelo de objetos implementa tudo numa árvore estruturada (árvore DOM) indicando posições específicas para nós e pontos (uso de seções para facilitar) permite o acesso aos pontos mais rápido.
16
APRENDA MAIS Coluna de Érica Sarti:
Equipe W3C no Brasil: Coluna de Ana Paula Pereira no site:
Apresentações semelhantes
