Presentación Multimedia - HTML5

Es la última evolución de la norma que define HTML. El término representa dos conceptos diferentes:

• Se trata de una nueva versión del lenguaje HTML

• Tiene un conjunto más amplio de tecnologías que permite a los sitios Web y las aplicaciones más diversas y de gran alcance.

Diseñado para ser utilizable por todos los desarrolladores de Open Web, esta referencia página enlaza numerosos recursos sobre las tecnologías de HTML5, que se clasifican en varios grupos según su función.

• Semántica • Conectividad • Desconectado y almacenamiento .• Multimedia • Gráficos y efectos 2D/3D • Rendimiento e Integración • Dispositivo de Acceso• Styling

Hoe| HTML5| Estructura Semántica| Nuevos Elementos | Elementos eliminados | Soportado por |FuentesHome | HTML5 | Componentes | Estructura Semántica | Nuevos Elementos | Elementos eliminados | Soportado por | Fuentes


<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" /> <title>Using main</title> </head><body>

<header> My page</header>

<nav> <a href="#">Home</a></nav>

<main> <article> <h1>My article</h1> <p>Content</p> </article>

<aside> <p>

More information </p> </aside></main>

<footer> Copyright 2013</footer>

</body></html>



Tag Descripción

<canvas> Used to draw graphics, on the fly, via scripting (usually JavaScript)

Nuevos Elementos Semánticos/ Estructural

Tag Descripción<article> Defines an article

<aside> Defines content aside from the page content

<bdi> Isolates a part of text that might be formatted in a different direction from other text outside it

<command>

Defines a command button that a user can invoke

<details> Defines additional details that the user can view or hide

<dialog> Defines a dialog box or window

Tag Descripción

<datalist> Specifies a list of pre-defined options for input controls

<keygen> Defines a key-pair generator field (for forms)

<output> Defines the result of a calculation

Nuevos Elementos Form



http://www.w3schools.com/tags/tag_canvas.asp

http://www.w3schools.com/tags/tag_article.asp

http://www.w3schools.com/tags/tag_aside.asp

http://www.w3schools.com/tags/tag_bdi.asp

http://www.w3schools.com/tags/tag_command.asp

http://www.w3schools.com/tags/tag_command.asp

http://www.w3schools.com/tags/tag_details.asp

http://www.w3schools.com/tags/tag_dialog.asp

http://www.w3schools.com/tags/tag_datalist.asp

http://www.w3schools.com/tags/tag_keygen.asp

http://www.w3schools.com/tags/tag_output.asp

<summary> Defines a visible heading for a <details> element

<figure> Specifies self-contained content, like illustrations, diagrams, photos, code listings, etc.

<figcaption> Defines a caption for a <figure> element

<footer> Defines a footer for a document or section

<header> Defines a header for a document or section

<mark> Defines marked/highlighted text

<meter> Defines a scalar measurement within a known range (a gauge)

<nav> Defines navigation links

<progress> Represents the progress of a task

<ruby> Defines a ruby annotation (for East Asian typography)

<rt> Defines an explanation/pronunciation of characters (for East Asian typography)

<rp> Defines what to show in browsers that do not support ruby annotations

<section> Defines a section in a document

<time> Defines a date/time

<wbr> Defines a possible line-break



http://www.w3schools.com/tags/tag_summary.asp

http://www.w3schools.com/tags/tag_figure.asp

http://www.w3schools.com/tags/tag_figcaption.asp

http://www.w3schools.com/tags/tag_footer.asp

http://www.w3schools.com/tags/tag_header.asp

http://www.w3schools.com/tags/tag_mark.asp

http://www.w3schools.com/tags/tag_meter.asp

http://www.w3schools.com/tags/tag_nav.asp

http://www.w3schools.com/tags/tag_progress.asp

http://www.w3schools.com/tags/tag_ruby.asp

http://www.w3schools.com/tags/tag_rt.asp

http://www.w3schools.com/tags/tag_rp.asp

http://www.w3schools.com/tags/tag_section.asp

http://www.w3schools.com/tags/tag_time.asp

http://www.w3schools.com/tags/tag_wbr.asp

Tipo de dato SintáxisBúsqueda <input type=“search” name=“busqueda”>

Teléfono <input type=“tel” name=“telefono”>

Url <input type=“url” name=“url”>

Email <input type=“email” name=“correo”>

Fecha y hora <input type=“datetime” name=“fechahora”>

Fecha <input type="date" name="fecha">

Número <input type="number" name="num" min="0" max="50">

Rango <input type="range" name="rango" min="0" max="50">

Color <input type="color" name="color">



• <acronym>• <applet>• <basefont>• <big>• <center>• <dir>• <font>• <frame>• <frameset>• <noframes>• <strike>• <tt>





• iPhone

• iPod Touch

• iPad

• Android OS

• Blackberry

• Firefox 3.5+

• Chrome 3.0+

• Safari 3.1+

• Opera 10.5+

• IE 9.0+

https://html5test.com



Explorer 8.0



Explorer 11.0



Firefox 22.0



Chrome 32





Integrantes:Borrás, GénesisMartínez, RobertMontemarano, DanielaSegura, Karem FIN.

Presentación Multimedia - HTML5

Education

Transcript of Presentación Multimedia - HTML5