Loading presentation...

Present Remotely

Send the link below via email or IM

Copy

Present to your audience

Start remote presentation

  • Invited audience members will follow you as you navigate and present
  • People invited to a presentation do not need a Prezi account
  • This link expires 10 minutes after you close the presentation
  • A maximum of 30 users can follow your presentation
  • Learn more about this feature in our knowledge base article

Do you really want to delete this prezi?

Neither you, nor the coeditors you shared it with will be able to recover it again.

DeleteCancel

Make your likes visible on Facebook?

Connect your Facebook account to Prezi and let your likes appear on your timeline.
You can change this under Settings & Account at any time.

No, thanks

¿Que es HTML5?

Esta presentacion da una definicion al concepto de HTML5. desde los cambios que le precedieron y le dieron origen. Para encontrarla es necesario adentrarnos en el concepto de WEB que es donde se define realmente el HTML5, y las especificaciones de su fun
by

luis jhefeerson

on 31 May 2012

Comments (0)

Please log in to add your comment.

Report abuse

Transcript of ¿Que es HTML5?

http://dougmcinnes.com/html-5-asteroids/ QUE ES HTML5? HTML5? html 2
html 3.2
html 4
html 4.01 XHTML 1 se estableció en enero de 2000 como una reformulación de html con sintaxis xml. Desde entonces parecía evidente que los futuros desarrollos de html se harían bajo la bandera del Xhtml Whatwg y HTML5 en 2007, el W3C reconoció el trabajo del Whatwg y lo tomó como base para su propia actividad con el fin de proponer una actualización del estándar básico del Web. Y a pesar de que el desarrollo de html estaba cerrado, el W3C se concentró en definir html5. http://www.thewildernessdowntown.com/ siglas de HyperText Markup Language (Lenguaje de Marcado de Hipertexto), es el lenguaje de marcado predominante para la elaboración de páginas web. Es usado para describir la estructura y el contenido en forma de texto, así como para complementar el texto con objetos tales como imágenes. Html 1991 1995 Html 2.o 1997 1998 Html 3.2 Html 4.0 Html 4.1 1999 2000 2001 2008 XHtml 1 XHtml 1.1 HTML 5 Linea del Tiempo Para que sirve HTML5? HTML5 sirve como lenguaje para presentar y estructurar contenidos para la WWW. HTML5 nuevas caracteristicas sintacticas que contribuyen al uso y desarrollo de sitios modernos que mejorar la experiencia del usuario en Internet. La inclusión y manejo de material multimedial sobre los documentos web es ahora mucho mas sencillo sin necesidad de plugins y software propietario. HTML5 incorpora nuevas API que dan nuevas funcionalidades como elementos de canvas, servicio de edición de documentos, tecnologias web storage y web messaging. Caracteristicas y nuevos elementos Canvas 2D
Multimedia
Almacenamiento Off-Line en la web
Nuevas etiquetas para espacios dentro documento
Nuevos atributos para manejar formularios
Comunicación entre documentos - Web Messaging.
Microdata Canvas 2D El elemento canvas será un estándar más y nos permitirá entre otras cosas renderizar con detalle nuestras gráficas de datos, gráficos para videojuegos y otras imágenes al vuelo (en tiempo real).

Elemento de canvas es una nueva etiqueta que hace parte de la implementación que se haga en cierta aplicación; ...

... Que es Html? ...
<canvas id="canvas_ejemplo" width="300" height="100" style="background-color:#6600CC;">
... Multimedia La nueva caracteristica acerca del uso y manejo de material de audio y video ya no va a depender mas de plugins y programas propietario.

Aparece dos nuevos etiquetas que permite la insercion de material multimedia en documentos web, tales como <video> y <audio> donde se hace uso de atributos para respectivas configuraciones. ...
<audio src="audio.mp3" controls="controls">
<video src="video.ogg" width="300" height="150" controls>
... Formularios Esta nueva caractistica permite definir los dominios de los distintos atributos que se esten capturando por medio de la interfaz grafica. HTML5 permite la integración de caracteristicas que antes se podian lograr unicamente atraves del acoplamiento de un javascript que realizara alguna funcionalidad especifica.

La validación de los datos suministrados por el usuario mediante la interfaz grafica se puede hacer directamente con codigo html, sin la necesidad de tener framework, API ó js. Comunicación entre documentos
Web Messaging Es un API que permite comunicar documentos atraves de diferentes origenes o dominios de fuente.

Para poder enviar algun mensaje se hace uso de un metodo llamado 'postMessage' donde se le pasara un atributo para poder definir en donde le aparecera el texto enviado.

Por otro lado el receptor, hace uso de metodo 'event' para poder recibir el mensaje, este trae consigo distintos atributos tales como; data, origen y source. Microdata Es una forma estandarizada para agregar semantica a los diversos contenidos dentro de una sitio web.

Se puede utilizar microdata para poder compartir información de contactos en un archivo vCard colgado en alguna sesión de un sitio web para poder intercambiar datos respectivos con clientes de correo electronico.

La microdata ayuda a facilitar la labor de busqueda de información en internet, dado que por medio de esta, se puede describir la información contenida en el sitio web. Espacios dentro del
documento Menores tiempos de carga.
Imagenes dinamicas.
Mejora de la estructura de las páginas con etiquetas específicas.
Videos sin players
Geolocalizacion instantanea
Mejora busqueda semantica.
Audio y video.
Aplicaciones offline.
Dibujar sobre un lienzo.
Adiós a las etiquetas obsoletas.
Ofrece innovación y nuevas características. Ventajas de HTML5 El diseño web es el campo mas importante de aplicación de este lenguaje.

Tiene gran potencialidad gracias a las novedades y características ya mencionadas.

Aunque se encuentra aun en construcción, pues no se encuentra adoptado totalmente, se cree que va a ser el futuro de la web.

Debido a que simplifica (en muchos casos) puede llegar a ser adoptado facilmente por desarrolladores. Campos de aplicación:
Diseño web. Es nativo.
No le pertenece a nadie.
Mantiene la experiencia de usuario general en la web
Todos los elementos con todos los efectos y todas las jerarquias necesarias para construir una interfaz grafica totalmente funcional para soportar una aplicacion web es 100% posible usando HTML5+CSS+Javascript.
Adaptable, flexible, escalable, multiplataforma.
Accesibilidad.
El esfuerzo necesario y el resultado final.
Muerte de flash? HTML5 VS FLASH Ejemplos: WEB Y HTML5 http://www.thewildernessdowntown.com/ http://www.klowdz.com/ http://www.pushhere.com/ http://www.danielscholten.com/ http://kevs3d.co.uk/dev/canvask3d/k3d_test.html# http://mrdoob.com/projects/harmony/ http://www.apple.com/html5/showcase/gallery/ http://html5demos.com/geo (Geolocalizacion) Microdata Por:
Juan J Albornoz Pretel
Luis Jhefferson Gallardo
Andrés Felipe Tazcon Ávila
Johan Andrés Lozano Galindo
Juan David Echeverry Arbelaez Universidad del valle
Escuela de Ingeniería de Sistemas y Computación EL LENGUAJE html es uno de los puntales del Web. Desde hace más de dos décadas ejerce una función primordial en el proceso de distribuir información a través de internet. En todo ese tiempo ha experimentado algunos cambios en respuesta a las necesidades de los productores de contenido y de los usuarios del web, y ahora se encuentra a punto para el cambio siguiente: el World Wide Web Consortium (W3C) está esbozando html5. Aplicaciones en la Web y Redes Inalámbricas "HTML5 Es un paso a la WEB Semantica ¿Como surge Codigo sin microdata:
<section> Hello, my name is John Doe, I am a graduate research assistant at the University of Dreams. My friends call me Johnny. You can visit my homepage at <a href="http://www.JohnnyD.com">www.JohnnyD.com</a>. I live at 1234 Peach Drive Warner Robins, Georgia.</section>

Adición de la microdata 'Persona'<section itemscope itemtype="http://data-vocabulary.org/Person"> Hello, my name is <span itemprop="name">John Doe</span>, I am a <span itemprop="title">graduate research assistant</span> at the <span itemprop="affiliation">University of Dreams</span>. My friends call me <span itemprop="nickname">Johnny</span>. You can visit my homepage at <a href="http://www.JohnnyD.com" itemprop="url">www.JohnnyD.com</a>. <section itemprop="address" itemscope itemtype="http://data-vocabulary.org/Address"> I live at <span itemprop="street-address">1234 Peach Drive</span> <span itemprop="locality">Warner Robins</span> , <span itemprop="region">Georgia</span>. </section> </section> HTML5? Ejemplo Microdata Muchas Gracias... web semantica La Web semántica es la "Web de los datos".Se basa en la idea de añadir metadatos semánticos y ontológicos a la World Wide Web. Esas informaciones adicionales que describen el contenido, el significado y la relación de los datos se deben proporcionar de manera formal, para que así sea posible evaluarlas automáticamente por máquinas de procesamiento. El objetivo es mejorar Internet ampliando la interoperabilidad entre los sistemas informáticos usando "agentes inteligentes". Relacion con internet En la actualidad, la World Wide Web está basada principalmente en documentos escritos en HTML.

La Web Semántica se ocuparía de resolver estas deficiencias. Para ello dispone de tecnologías de descripción de los contenidos, como RDF y OWL, además de XML. Estas tecnologías se combinan para aportar descripciones explícitas de los recursos de la Web (ya sean estos catálogos, formularios, mapas u otro tipo de objeto documental). De esta forma el contenido queda develado, como los datos de una base de datos accesibles por Web, o las etiquetas inmersas en el documento . Esas etiquetas permiten que los gestores de contenidos interpreten los documentos y realicen procesos inteligentes de captura y tratamiento de información Como iniciativa de WHATWG, Comunidad formada por Apple, Mozilla y Opera en 2004.

Como Resultado de la preocupacion de esta asociacion hacerca del rumbo de la XHTML de la W3C y su poco interes en HTML.

Como reemplazo de HTML4.01 y XHTML1.0

Como soporte para nuevos atributos existentes, que proporcionan una web mas semantica Barreras Las tecnologías para expresar la información en el formato que requiere una web semántica existen hace años. Quizás la componente más especializada sea OWL, que existe como estándar del W3C desde 2004. El componente tecnológico que falta es el que permita convertir de forma automática el abundante contenido de texto de las páginas web en marcas OWL. En 2009 la web semántica requiere que los creadores de las páginas web traduzcan "a mano" su contenido en marcas OWL, para que pueda ser interpretado por agentes semánticos. .


La otra barrera que se opone pasivamente a la web semántica es el modelo de negocio de gran cantidad de páginas web, que obtienen ingresos de la publicidad. Estos ingresos son posibles únicamente si sus páginas son visitadas por una persona, y se pierden si los datos quedan disponibles para que los interprete un proceso automático.

El siguiente ejemplo arbitrario y parcial ilustra este concepto: para un trabajo de investigación para la escuela sobre la vida de un prócer, un sistema semántico realiza la investigación y presenta en pantalla el resultado: fecha de nacimiento y defunción, batallas en las que participó, hechos destacados, frases célebres, y todo esto sin necesidad de acceder a ninguna página web específica, y por lo tanto sin consumir la publicidad de los sitios que pusieron a disposición esa información. "QUE ES

SEMANTICA? web Añadir metadatos de manera formal Componentes de la
web semantica * XML aporta la sintaxis superficial para los documentos estructurados, pero sin dotarles de ninguna restricción sobre el significado.
* XML Schema es un lenguaje para definir la estructura de los documentos XML.
* RDF es un modelo de datos para los recursos y las relaciones que se puedan establecer entre ellos. Aporta una semántica básica para este modelo de datos que puede representarse mediante XML.
* RDF Schema es un vocabulario para describir las propiedades y las clases de los recursos RDF, con una semántica para establecer jerarquías de generalización entre dichas propiedades y clases.
* OWL añade más vocabulario para describir propiedades y clases: tales como relaciones entre clases (p.ej. disyunción), cardinalidad (por ejemplo "únicamente uno"), igualdad, tipologías de propiedades más complejas, caracterización de propiedades (por ejemplo simetría) o clases enumeradas. Usabilidad "Los nuevos elementos de HTML5 definen y facilitan los metadatos * Los documentos etiquetados con información semántica (compárese ésta con la etiqueta <meta> de HTML, usada para facilitar el trabajo de los robots). Se pretende que esta información sea interpretada por el ordenador con una capacidad comparable a la del lector humano. El etiquetado puede incluir metadatos descriptivos de otros aspectos documentales o protocolarios.
* Vocabularios comunes de metadatos (Ontología (Informática)) y mapas entre vocabularios que permitan a quienes elaboran los documentos disponer de nociones claras sobre cómo deben etiquetarlos para que los agentes automáticos puedan usar la información contenida en los metadatos (p.ej. el metadato author tenga el significado de "autor de la página" y no el del "autor del objeto descrito en la página"). CUALES SON
los nuevos
ELEMENTOS? Article
asid
audio
canvas
datagrid
datalist
datatemplate
embed
event-source
figure footer
header
mark
nav
nest
output
progress
source
video "DIFERENCIAS La especificación de html5 no se adscribe a una sintaxis o a la otra, sino que admite ambas serializaciones: Html y Xhtml. De esta manera, los creadores de contenido pueden escoger entre un enfoque práctico aunque poco riguroso (sintaxis html) y una visión académica y estricta (sintaxis Xhtml). Con el tiempo, el W3C ha acabado aceptando que Xhtml sea una recomendación paralela que puede coexistir con Html. http://dev.w3.org/html5/spec/Overview.html lkasjdlkjasldasdlkaslkdjaskldjasldjlkasjdlasjdlkjaslkdjlaskdjasdasdklasdjd
Full transcript