A web é muito mais do que arquivo s HTML. A web é feita de dados.

Apresentação em tema: "A web é muito mais do que arquivo s HTML. A web é feita de dados."— Transcrição da apresentação:

1 A web é muito mais do que arquivo s HTML. A web é feita de dados.
Passado, presente e futuro da Web 15ª Semana Integrada do CEATEC – PUC Campinas Campinas – 11 de setembro de 2013 Reinaldo Ferraz, Vanessa Me Tonini – W3C.br

2 Vanessa Me Tonini @vanessametonini
Desenvolvedora front-end, apaixonada por web. Analista de projetos no W3C Brasil São Paulo

3 Um pouco do W3C

4 O W3C no Brasil

5

6

7 O passado da Web era um conjunto de poucos códigos
O passado da Web era um conjunto de poucos códigos. A web surgiu como uma forma de fazer hiperlinks entre documentos, mas a possibilidade de colocar cores criava coisas assim. Passado

8 Passado História da Web Fonte: Tecmundo
A história da Web passa por diversos outros grandes momentos da história da internet. Passado Fonte: Tecmundo

9 Vamos falar do ano de Queda do muro de Berlin, Eleição de Fernando Color de Melo para Presidente do Brasil e Inauguração do Memorial da América Latina. 1989

10 Web em 1989 Nesse ano, Tim Berners-Lee inventa a Web Passado

11 Web em 1989 Esse é o desenho da Web, que Tim Berners-Lee criou pensando em solucionar alguns problemas ao acessar documentos: Problemas com arvores: Como abrir um documento referenciado em outro documento? Havia um problema pois era necessário identificar a referência do documento, fechar o documento atual e abrir o outro. Problemas com Keywords: Dependiam de combinações de teclado e duas pessoas nem sempre escolhem a mesma combinação de teclas. Keywords só funcionariam bem para pessoas que conhecem bem o aplicativo. Por causa disso, Tim criou seu primeiro exemplo, de dados “hiperlincados”, utilizando o Hipertexto. Passado

12 Web em 1989 Passado

13 Web em 1989 Passado

14 Web em 1989 Passado

15 Web em 1989

16

17 Futuro da Web

18 Em 1994 é criado o W3C

19 Web em 2001

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

21 A Web começou a criar produtos

22 Durante a primeira conferência WWW, em 1994, Tim Berners Lee fala pela primeira vez em Espaços Colaborativos, com colaborações sincronizadas, anotações, e principalmente Web Semântica.

23 Durante a primeira conferência WWW, em 1994, Tim Berners Lee fala pela primeira vez em Espaços Colaborativos, com colaborações sincronizadas, anotações, e principalmente Web Semântica.

24 For example, a document might describe a person
For example, a document might describe a person. The title document to a house describes a house and also the ownership relation with a person. Adding semantics to the web involves two things: allowing documents which have information in machine-readable forms, and allowing links to be created with relationship values. Only when we have this extra level of semantics will we be able to use computer power to help us exploit the information to a greater extent than our own reading. An important effect of developing security protocols on the web is the abstract space of web information is linked to reality. By taking verifiable responsibility for web statements, a party guarantees an isomorphism between the web and reality.

25 This means that machines, as well as operating on the web information, can do real things. For example, a program could search for a house and negotiate transfer of ownership of the house to a new owner. The land registry guarantees that the title actually represents reality.

26 Qualquer um pode criar um padrão.

27

28

29

30 Conforme a tecnologia evolui, padrões proprietários podem ter problemas.
Proximo slide: vanessa

31 Presente Qual o problema hoje?
Estamos na era da informação, mas hoje a informação necessita de dispositivos. Presente

32 HTML 5 [HyperText Markup Language]
1991 – html tag – Tim Berners Lee – HTML 2 - já incluia tag <img> 1997 – HTML – HTML – XHTML – XHTML 1.1 – CSS – Ian Hickson (Opera) propõe estender HTML: Web Forms 2.0, Web Apps – 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 Como o HTML evoluiu até hoje? Falar do XHTML WhatWG Descontinuação do XHTML e trabalho junto com o WHATWG HTML5 - Futuro da Web

33 Hoje o HTML5 é um candidato a recomendação e é esperado que vire uma recomendação em 2014!
Mas o que ele trouxe de bom? HTML5 - Futuro da Web

34 <SCRIPT LANGUAGE="JavaScript">
<! > <!-- Begin var now = new Date(); var month_array = new Array("Janeiro","Fevereiro","Março","Abril","Maio","Junho","Julho","Agosto","Setembro","Outubro","Novembro","Dezembro"); document.write("<form name=date_list><table bgcolor=silver><tr><td>"); document.write("<select name=month onchange=change_month(this.options.selectedIndex)>"); for(i=0;i<month_array.length;i++) { if (now.getMonth() != i) {document.write ("<option value="+i+">"+month_array[i]);} else {document.write ("<option value="+i+" selected>"+month_array[i]);} } document.write("</select>"); document.write("</td><td>"); document.write ("<select name=year onchange=change_year(this.options[this.options.selectedIndex])>"); for(i=1950;i<3000;i++) if (now.getYear() != i) {document.write("<option value="+i+">"+i);} {document.write("<option value="+i+" selected>"+i);} document.write("</select></td></tr><tr><td colspan=2><center>"); document.write("<table bgcolor=white border=0 cellspacing = 0 cellpading = 0 width=100%><tr bgcolor=gray align=center>"); document.write("<td><font color=silver>S</font></td><td><font color=silver>T</td><td><font color=silver>Q</td><td><font color=silver>Q</td><td><font color=silver>S</td><td ><font color=silver>S</td><td ><font color=silver>D</td>"); document.write("</tr><tr>"); for(j=0;j<6;j++) for(i=0;i<7;i++) document.write("<td align=center id=d"+i+"r"+j+"></td>") document.write("</tr>"); document.write("</table>"); document.write("</center></from></td></tr></table>"); var show_date = new Date(); function set_cal(show_date) begin_day = new Date (show_date.getYear(),show_date.getMonth(),1); begin_day_date = begin_day.getDay(); end_day = new Date (show_date.getYear(),show_date.getMonth()+1,1); count_day = (end_day - begin_day)/1000/60/60/24; input_table(begin_day_date,count_day); set_cal(show_date); function input_table(begin,count) init(); j=0; if (begin!=0){i=begin-1;}else{i=6} for (c=1;c<count+1;c++) colum_name = eval("d"+i+"r"+j); if ((now.getDate() == c)&&(show_date.getMonth() == now.getMonth())&&(show_date.getYear() == now.getYear())) {colum_name.style.backgroundColor = "blue";colum_name.style.color = "white";}; colum_name.innerText = c; i++; if (i==7){i=0;j++;} function init() colum_name.innerText = "-"; colum_name.style.backgroundColor =""; colum_name.style.color =""; function change_month(sel_month) show_date = new Date(show_date.getYear(),sel_month,1); function change_year(sel_year) sel_year = sel_year.value; show_date = new Date(sel_year,show_date.getMonth(),1); // End --> </script> <!-- Script Size: KB --> Um exemplo, é o datepicker, que precisavamos ter um codigo com mais de 200 linhas de javascript para ter esta funcionalidade

35 <input type="date">
Hoje com html5, precisamos de apenas 1 linhas de código.

36 O com isso o html5 tambem permite a melhor adaptacao dos disposivos à sua aplicação, por exemplo este, onde o teclado se adapta de acordo com campo do formulario. Diferença entre os teclados number url

37 As principais areas de atuação da web sendo acessadas pelos mais diversos aplicativos.
HTML5 - Futuro da Web

38 Semantica, Offline Storage, Device access (interoperabilidade), conectividade, multimidia, efeitos 3D, Performance e estilos. Ok? Mas a plataforma aberta da web é só marcação? Vou mostrar pra vcs neste video que a open web platform vai muito além da simples linguagem de marcação de conteúdo HTML5 - Futuro da Web

39

40 Web em 2001

41 Web em 2011 Tudo evoluiu. Os dispositivos, o browser, e os documentos web

42 Web em 2001 Web Browsers Motores de busca A B C D HTML hyper links

43 Mashups de dados linkados
Web em 2011 Web browsers dados linkados Motores de busca A B C D link de dados Mashups de dados linkados dados E HTTP RDF + HTML5 URI Repositorio de dados, que se conectamcom HTML5 e RDF para entregar um conteúdo customizado ao usuário.

44 No passado a guerra dos browsers era menor.
Hoje temos muito mais opções. E todos correndo para seguir os padrões da melhor forma possível e não fazendo o desenvolvedor desenvolver para um tipo de browser. E considerando o acesso aos mais diversos browsers e dispositivos que podemos fazer uma breve análise de como vai ser o futuro da web.

45 Reinaldo Futuro

46

47 Long Live the Web – Scientific American

48

49

50

51 Noticia de 2012

52 When the FT first switched from native to HTML5 on iOS in 2011, it was seen in some quarters as a snub to Apple. Although that was partly true – the FT and Apple disagreed over control of subscriber data – a more important reason was the desire to make porting and maintaining the app across multiple platforms and devices easier in the longer term.

53

54 Princípios do W3C Web para todos, em qualquer dispositivo, em qualquer lugar, segura e confiável! Foto: everystockphoto.com - woodleywonderworks

55 Reinaldo Ferraz e Vanessa Tonini
Obrigado! Reinaldo Ferraz e Vanessa Tonini W3C Escritório Brasil @vanessametonini