W3C HTML5 Web Semântica Futuro da Web. Semana de Tecnologia FATEC Carapicuíba Outubro 2011

Transcrição

1 W3C HTML5 Web Semântica Semana de Tecnologia FATEC Carapicuíba Outubro 2011

2 Web e W3C Tim Berners-Lee criou / propôs a Web em 1989 (há 22 anos) (URI + HTTP + HTML) 2

3 Web e W3C Tim Berners-Lee criou / propôs a Web em 1989 (há 22 anos) (URI + HTTP + HTML) o W3C em 1994 (há17 anos) 01/10/1994 no MIT, Laboratório de Ciência da Computação 3

4 Web e W3C Tim Berners-Lee criou / propôs a Web em 1989 (há 22 anos) (URI + HTTP + HTML) o W3C em 1994 (há17 anos) 01/10/1994 no MIT, Laboratório de Ciência da Computação Web Semântica 1a. Conferência Internacional WWW 25 a 27/05/

5 O Consórcio World Wide Web (W3C) É um consórcio internacional organizações filiadas, uma equipe em tempo integral, participação do público 5

6 O Consórcio World Wide Web (W3C) É um consórcio internacional organizações filiadas, uma equipe em tempo integral, participação do público para colaborativamente desenvolver padrões universais para a Web. 6

7 Missão do W3C Conduzir a World Wide Web para que atinja todo seu potencial, desenvolvendo protocolos e diretrizes que garantam seu crescimento de longo prazo. 7

8 O W3C desenvolve padrões Conduzir a World Wide Web para que atinja todo seu potencial, desenvolvendo protocolos e diretrizes que garantam seu crescimento de longo prazo. Desde sua fundação, o W3C publicou mais de uma centena de padrões, denominados Recomendações do W3C Web Standards Padrões Web 8

9 Metas W3C Web para todos 9

10 Metas W3C 10 Web para todos Tornar os benefícios da web (seu valor social: comunicação humana, comércio, compartilhar conhecimentos) disponíveis a todos, independente de Hardware Software Infraestrutura de rede Idioma Cultura Localização geográfica Habilidade física Habilidade mental

11 Metas W3C Web para todos Web em qualquer dispositivo 11

12 Metas W3C 12 Web em qualquer dispositivo Possibilitar que o acesso de qualquer tipo de dispositivo seja tão simples, fácil e conveniente quanto de um computador convencional Computadores Desktops Netbooks Telefones PDAs TV digital Sistemas de interação por voz Aparelhos domésticos web ubíqua

13 Metas W3C Web para todos Web em qualquer dispositivo Web base de conhecimento 13

14 Metas W3C Web base de conhecimento Não apenas um grande livro hiperlinkado onde pessoas possam pesquisar, navegar, visualizar e ler informações Possibilitar que computadores interpretem, estabeleçam inferências e relações na web Interoperabilidade Web Semântica 14

15 Metas W3C Web para todos Web em qualquer dispositivo Web base de conhecimento Web confiável e segura 15

16 Metas W3C Web confiável e segura Uma web em que as transações sociais e comunicações com terceiros sejam estabelecidas em relações de confiança, por pessoas, organizações ou serviços Ambiente mas colaborativo responsável seguro Confiança e Confidência 16

17 Não apenas repositório de documentos com o propósito de exibição, mas de automação, integração e reuso em sistemas diferentes Não apenas apresentar, interpretá-los Compartilhar informações (interpretações) com organização em escala e completa integração de recursos 17

18 18 Web sintática Regras e formalidades Web semântica Interpretações, inferências e relações

19 19 Web de (2006) URI - RDF Web Social (2003) Web ( 1992) HTTP - URI HTML/CSS/JavaScript

20 20 Web Browsers Motores de busca HTTP HTML HTML hyper links A HTML hyper links B HTML hyper links C D

21 - HTML5 21

22 - HTML5 HTML 5 [HyperText Markup Language] 1991 html tag Tim Berners Lee 1994 HTML 2 - já incluia tag <img> 1997 HTML HTML XHTML XHTML 1.1 CSS Ian Hickson (Opera) propõe estender HTML: 2004 Web Forms 2.0, Web Apps 1.0 Apple, Mozilla e Opera criam WHAT WG (Web Hypertext Application Technology Working Group) 2007 W3C retorna HTML Working Group 2009 W3C descontinua XHTML Apple, Google, Microsoft, Mozilla e Opera implementam HTML5 22

23 - HTML5 23

24 - HTML5 HTML 5 [HyperText Markup Language] Maio/2011 Last Call Processo W3C padronização : Working Draft (Rascunho de Trabalho) Last Call Candidate Recommendation (Candidato a Recomendação): Chamada para implementação Proposed Recommendation (Proposta de Recomendação): Chamada para revisão de proposta de recomendação W3C Recommendation (Recomendação W3C): Publicação da recomendação 24

25 HTML 5 HTML 5 [HyperText Markup Language] 25

26 - HTML5 HTML 5 [HyperText Markup Language] Formulários <canvas> <video> <audio> Elementos para melhor modelagem página Geolocalização 26

27 - HTML5 HTML 5 [HyperText Markup Language] DOCTYPE: HTML4 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" " <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " XHTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " 27

28 - HTML5 <!DOCTYPE html> 28

29 - HTML5 29 HTML 5 [HyperText Markup Language] Formulários <form> <label for="cep">cep: </label> <input type= text id="cep" required pattern="\d{5}-?\d{3}" /> <input type="submit" value="enviar" /> </form>

30 - HTML5 30 HTML 5 [HyperText Markup Language] VíDEO <video id='videoresource' style='border: black 1px solid; margin-left: 4px; margin-top: 4px; margin-bottom: 0px;' poster='/2009/04/coffee.png'> <source src=" type="video/mp4"/> <source src=" type="video/ogg"/> <text lang='en' type="application/ttaf+xml" src="/2009/02/thisiscoffee61_captions.xml"> </text> <div style='width: 320px; height: 240px; color: white'><p>no Video Support.</p> </div> </video>

31 - HTML5 HTML 5 [HyperText Markup Language] VíDEO 31

32 - HTML5 32 HTML 5 [HyperText Markup Language] IE Firefox Safari Chrome Opera iphone Android H.264+AAC+ MP WebM ? Codecs/ container Theora+Vorbis+ Ogg 6.0+

33 - HTML5 33 HTML 5 [HyperText Markup Language] <canvas>

34 - HTML5 HTML 5 [HyperText Markup Language] Novos elementos <article> <section> <header> & <footer> <hgroup> (agrupamento <h1> <h2> ) <aside> <figure> e <figcaption> Lista completa: 34

35 - HTML5 35 HTML 5 [HyperText Markup Language] HTML4 + CSS

36 - HTML5 36 HTML 5 [HyperText Markup Language] Novos elementos (semânticos) HTML5 + CSS

37 - HTML5 HTML 5 [HyperText Markup Language]

38 38

39 Conectividade CSS3 Acesso de dispositivos Gráficos 3D e Efeitos Multimídia Performance e Integração Semântica Offline e Armazenamento 39

40 40

41 41 Web Browsers Motores de busca HTTP HTML HTML hyper links A HTML hyper links B HTML hyper links C D

42 42

43 43 Web browsers linkados HTTP Mashups de linkados Motores de busca HTTP URI link de A link de B link de C link de D E

44 44

45 45 Web browsers linkados HTTP RDF + HTML5 Mashups de linkados Motores de busca HTTP URI link de A link de B link de C link de D E

46 46 Web browsers linkados HTTP RDF + HTML5 Mashups de linkados Motores de busca HTTP Meta URI link de link de link de link de Meta Meta A B C D E

47 47

48 Web Semântica 48 Web browsers linkados HTTP RDF + HTML5 + OWL + SKOS + SPARQL Mashups de linkados Motores de busca Ontologias HTTP URI link de link de link de link de Vocabulários Meta A B C D E

49

50 50

51 WEB

52 WEB

53 53

54 54

55

56 As coisas e suas relações A é parte da 56

57 A < < < 57

58 58

59 O /futuro_da_web Usar os na web tal como já utilizamos os documentos 59

60 O /futuro_da_web Usar os na web tal como já utilizamos os documentos hiperlinkando e significando 60

61 Dados e meta e vocabulários 61

62 62 Dados e meta e vocabulários Descrição das coisas e de suas relações

63 63 Dados e meta e vocabulários Descrição das coisas e de suas relações

64 64

65 65

66 Exemplo RDF <rdf:rdf xmlns:rdf=" xmlns:dc=" <rdf:description rdf:about=" <dc:creator>rose Bush</dc:creator> <dc:title>a Guide to Growing Roses</dc:title> <dc:description>describes process for planting and nurturing different kinds of rose bushes.</dc:description> <dc:date> </dc:date> </rdf:description> </rdf:rdf> 66

67 Exemplo RDF <rdf:rdf xmlns:rdf=" xmlns:dc=" <rdf:description rdf:about=" <dc:creator>rose Bush</dc:creator> <dc:title>a Guide to Growing Roses</dc:title> <dc:description>describes process for planting and nurturing different kinds of rose bushes.</dc:description> <dc:date> </dc:date> </rdf:description> </rdf:rdf> 67

68 Dublin Core Metadata Initiative

69 69 Dublin Core Metadata Initiative O que o computador vê O que os humanos veem

70 ID ISBN X ID id_xyz Author Title Publisher id_xyz The Glass Palace id_qpr Name Ghosh, Amitav ID id_qpr 70 Publisher s name Harper Collins Year 2000 Homepage City London

71 Exportar como um set de relações 71

72 72

73 73

74 74

75 75

76 76

77 77 Mais conhecimento na Wikipedia = DBPedia

78 78 Relacionado mais relevantes

79 79 Web de Web das coisas Web Semântica Integração de na web

80 80

81 81 obrigado! W3C Escritório Brasil Vagner Diniz, Av. das Nações Unidas, , 7º andar São Paulo, SP - Brasil CEP Telefone (11) Carlinhos Cecconi, carlinhos@nic.br Reinaldo Ferraz, reinaldo@nic.br