Upload
manuel-padilla
View
422
Download
0
Embed Size (px)
DESCRIPTION
Breve introducción a HTML5 para el curso de Desarrollo Web, impartido por el I.S.C Juan Manuel Padilla Carmona en UNIVAC. Cuernavaca Morelos, México. Noviembre 2012
Citation preview
Curso de Desarrollo Web
¡Bienvenidos!
Noviembre, 2012
domingo, 9 de diciembre de 12
Acerca de mí
Juan Manuel Padilla CarmonaIngeniero en sistemas ComputacionalesUNIVAC
Maestro en Redes de Computadoras y Tecnologías WebUNINTER
Líder de ProyectosROC
@mannuelpadillac Manuel Padilla /manuelpadillac
domingo, 9 de diciembre de 12
Curso de Desarrollo Web
domingo, 9 de diciembre de 12
Curso de Desarrollo Web
How To Meet Ladies
domingo, 9 de diciembre de 12
<h1>Agenda</h1>
<ol class=”agendaHTML”><li>Introducción</li>
<li>El presente es HTML5</li>
<li>Navegadores y Herramientas</li>
<li>Elementos y Atributos</li>
<li>Formularios</li>
<li>Multimedia</li></ol>
domingo, 9 de diciembre de 12
<h1>Introducción</h1>
<h2>¿Qué es HTML</h2>
<p>HTML, siglas de HyperText Markup Language («lenguaje de marcado de hipertexto»), hace referencia al lenguaje de marcado predominante para la elaboración de páginas web que se utiliza para describir y traducir la estructura y la información en forma de texto... HTML se escribe en forma de «etiquetas», rodeadas por corchetes angulares (<,>)... puede incluir un script (por ejemplo JavaScript), el cual puede afectar el comportamiento de navegadores web y otros procesadores de HTML.</p>
<span class=”fuenteDefinicion”> Wikipedia </span>
domingo, 9 de diciembre de 12
<h1>Introducción</h1>
<h2>¿Qué me ofrece HTML5?</h2>
<ul class=”HTML5Oferta”><li>Una mejor plataforma de desarrollo web.</li><li>Más demarcado descriptivo.</li><li>Multimedia con menos Plug-ins.</li><li>Mejores Aplicaciones.</li><li>Mejores interfaces.</li><li>Mejores formularios.</li><li>Almacenamiento del lado del cliente.</li><li>Accesibilidad Mejorada</li><li>Y muchas otras cosas buenas más</li>
</ul>
domingo, 9 de diciembre de 12
<h1>Introducción</h1>
<h2>La Tecnología</h2>
domingo, 9 de diciembre de 12
<h1>El presente es HTML5</h1>
<h2>HTML5</h2>
<p>Las grandes empresas, las mejores páginas y aplicaciones web hoy en día son desarrolladas en HTML5; algunos ejemplos de ello son</p>
<ul class=”ejemplosHTML5”><li>www.brandongenerator.com/</li><li>www.astrid.com/</li><li>www.twitter.com/</li><li>www.decoracionpdi.com/</li><li>www.woodlandsrealtypros.com/</li>
</ul>
domingo, 9 de diciembre de 12
<h1>Navegadores y Herramientas</h1>
<h2>Navegadores</h2>
Maxthon Chrome Opera
Safari Firefox Internet Esplorerdomingo, 9 de diciembre de 12
<h1>Navegadores y Herramientas</h1>
<h2>Herramientas</h2>
<ul class=”herramientasDesarrollo”><li>Editor de Código</li><li>Editor de Imágenes</li><li>Navegadores Web</li><li>Extensiones de Navegadores</li>
</ul>
domingo, 9 de diciembre de 12
<h1>Elementos y Atributos</h1>
<h2>Etiquetas Descontinuadas</h2>
<ul class=”etiquetasDescontinudas”><li>basefont</li><li>big</li><li>center</li><li>font</li><li>s</li><li>strike</li><li>u</li><li>y muchas otras más</li>
</ul>
domingo, 9 de diciembre de 12
<h1>Elementos y Atributos</h1>
<h2>Todo comienza con un DOCTYPE</h2>
Antes de HTML5
<!DOCTYPE html PUBLIC “-//W3C//DTD 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
En HTML5
<!DOCTYPE html>
domingo, 9 de diciembre de 12
<h1>Elementos y Atributos</h1>
<h2>Nuevas etiquetas estructurales</h2>
<header> Define una cabecera en una página o sección.
<footer>Define un pie de pagina o sección..
<nav>Define una región de navegación en una pagina o sección.
<section>Define una región lógica para agrupar contenido.
<article>Define un articulo o una pieza completa de contenido.
domingo, 9 de diciembre de 12
Let´s play a gamedomingo, 9 de diciembre de 12