Scribd Logo
Importer

Bienvenue sur Scribd !

  • Que Es El HTML5

    Transféré par

    Aurora Cuapa
    22 vues8 pages

    Titre original

    QUE ES EL HTML5

    Copyright

    © Attribution Non-Commercial (BY-NC)

    Formats disponibles

    DOCX, PDF, TXT ou lisez en ligne sur Scribd

    Avez-vous trouvé ce document utile ?

    Ce contenu est-il inapproprié ?

    Signaler ce document

    Droits d'auteur :

    Attribution Non-Commercial (BY-NC)
    Téléchargez comme DOCX, PDF, TXT ou lisez en ligne sur Scribd
    Signaler comme contenu inapproprié
    22 vues8 pages

    Que Es El HTML5

    Transféré par

    Aurora Cuapa

    Droits d'auteur :

    Attribution Non-Commercial (BY-NC)
    Téléchargez comme DOCX, PDF, TXT ou lisez en ligne sur Scribd
    Signaler comme contenu inapproprié
    sur 8

    QUE ES EL HTML5?

    HTML5 es una coleccin de estndares para el diseo y desarrollo de pginas web. Esta coleccin representa la manera en que se presenta la informacin en el explorador de internet y la manera de interactuar con ella. HTML5 est siendo desarrollado por Ian Hickson de Google Inc. y David Hyatt de Apple Inc. junto con todas las personas que participan en Web Hypertext Application Technology Working Group. Por qu utilizar HTML5? HTML5 nos permite una mayor interaccin entre nuestras pginas web y contenido media (video, audio, entre otros) as como una mayor facilidad a la hora de codificar nuestro diseo bsico.

    Esta nueva versin se bas en el diseo ms comn de las pginas web alrededor del mundo para llegar a un estndar de etiquetas que realicen las mismas tareas de manera ms rpida y eficiente, he aqu algunos ejemplos:

    Un nuevo diseo para pginas web, reflejado en las etiquetas <header>,<footer>, <nav>,<section>,<article> las cuales estn destinadas a remplazar la necesidad de tener una <div> para cada parte de la pgina, y en cambio, tener etiquetas especficas para ello. La nueva etiqueta <video> para insertar un reproductor de video, mejorando el reproductor antiguo utilizado por la etiqueta <embed> y evitndonos la pena de insertar el cdigo de <object>, as como eliminar la necesidad del Flash Player para reproducir videos (lo que nos lleva a un ahorro en la cantidad de memoria utilizada).

    Una nueva tag <audio> para insertar audio en nuestro sitio web, remplazando la vieja etiqueta <embed> con las mismas cualidades de la etiqueta anterior. Una etiqueta <canvas> para manejo de grficos en internet, sea para dibujar vectores o hacer animaciones.

    Cmo utilizar HTML5? Basta con volver a definir nuestras primeras lneas de un archivo HTML para comenzar a usar la nueva versin. De la siguiente manera:

    Conclusiones La nueva versin de HTML contiene elementos dedicados ampliamente a mejorar la experiencia del usuario en nuestra pgina web, haciendo ms fcil al diseador poder agregar elementos de audio, video y en general del web 2.0 as como organizar sus contenidos utilizando menos cdigo. La nueva versin es ms eficiente y ocupa menos recursos en la computadora del cliente, en particular mediante el uso del nuevo reproductor que no requiere flash o adobe player para utilizarse, y siendo el HTML5 compatible con las versiones

    ESTRUCTURA BASICA DE HTML

    Comencemos hablando de semantica, y por su puesto la pregunta obvia es Que es la semantica ? La semantica no es mas que el significado que les damos a las palabras. Dejando a un lado esto hablemos un poco de la importancia en la semantica de HTML, sucede que el lenguaje esta hecho para que cada etiqueta HTML signifique algo, es as que el explorador sabe que pasa cuando encuentra un <img>, sabe que es una imagen, o cuando encuentra un <p> sabe que es un prrafo etc Lo mismo sucede con los buscadores, es por eso que para un buscador es mas importante un <h1> que un <p>. Con forme han pasado los aos y la web ha evolucionado se han depreciado algunas etiquetas HTML y se han implementado nuevas, con la llegada de HTML5 las nuevas etiquetas semnticas, son mas precisas, y cumplen funciones que no se haban tomado en cuenta anteriormente, como por ejemplo la llegada de la etiqueta <nav> que es donde debemos poner nuestro menu. Todo esto es muy interesante per seamos un poco prcticos, empecemos haciendo la estructura basica de un sitio web en HTML5, asi que abramos nuestro explorador de preferencia, y creemos un archivo .html

    Recordemos que HTML es un tipo de documento, no un programa, asi que lo primero es declarar el tipo de documento que vamos a usar, en versiones anteriores a HTML5 de usaban una seria de cosas muy feas ejemplo HTML 4 Transicional

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

    "http://www.w3.org/TR/html4/loose.dtd"> Doctype en HTML5

    <! Doctype html>

    Como pueden ver es bastante facil, as que ya le dijimos a el explorador que eso es un documento HTML5 ahora toca comenzar a escribir el documento eso lo hacemos con la etiqueta <html> a la cual le pondremos un atributo lang en este atributo pondremos el idioma que preferimos en nuestro caso es. Recordemos que en HTML5 debemos cerrar todas las etiquetas de la siguiente manera.

    10

    <!DOCTYPE html>

    <html lang="es"> <head> <!-- aqui pondremos el contenido html --> </head>

    <body>

    </body> </html>

    Espero hayan notado dos cosas, la primera, como escrib el doctype, y es que en HTML5 este se puede escribir en altas, bajas o mesclado como tipo metro%$&$%, perdn por la grosera. La otra es que dentro de la etiqueta <html> escrib un texto que no debe aparecer, y es que esta es la syntaxis para los comentarios, as que si guardan esta pagina y la ejecutan en su explorador no debera salir nada hasta el momento. Estructura basica de una pagina HTML5 25 <!DOCTYPE html>

    <html lang="es"> <head> <meta charset="utf-8" /> <title>Estructura basica de una pagina web en HTML5</title> </head>

    <Body> <header> <nav> <a href="inicio.html">Inicio</a> <a href="nosotros.html">Nosotros</a> <a href="opcion.html">Opcion</a> <a href="opcion.html">Opcion</a>

    </nav> </header> <!-- Cuerpo de la pagina --> <footer> <p>Derechos reservados</p> <p>Contactenos en info@tumaestroweb.com</p> </footer>

    </body> </html> <head>: Nos delimita el encabezado de la pagina, el contenido de esta etiqueta no se ve pero es muy importante ya que es donde declararemos hojas de estilos o CSS ( siguiendo este curso veremos CSS3) <body>: dentro de body tendremos el contenido visible del sitio

    TAGS DE HTML
    Etiquetas HTML 5 La siguiente tabla proporciona una lista de las etiquetas (o elementos ) apoyados en HTML 5 (escrito oficialmente como HTML5 - sin el espacio).Esta lista se basa en el Proyecto de HTML5 de trabajo a partir de febrero de 2009. La versin anterior / actual de HTML es HTML 4.01. Aqu hay una lista de etiquetas HTML 4.01 . Etiqueta <- ... -> Descripcin Especifica un comentario Nuevo en HTML5?

    <! DOCTYPE> Especifica el tipo de documento <a> <abbr> <direccin> <area> <article> <aside> <audio> Especifica un hipervnculo Especifica una abreviatura Especifica un elemento de direccin Especifica un rea dentro de un mapa de imagen Especifica un artculo NUEVO

    Especifica el contenido aparte del contenido de la pgina NUEVO Especifica el contenido de sonido

    Elemento <!-- -->

    Vaco

    Descripcin corta Inserta comentarios ocultos

    Elemento <!DOCTYPE> <a> <abbr> <acronym> <address> <applet> <area> <b> <base> <basefont> <bdo> <big> <blockquote> <body> <br> <button> <caption> <center> <cite> <code> <col> <colgroup> <dd>

    Vaco

    Descripcin corta Establece el tipo de documento Inserta vnculos o marcadores Explica/expande abreviaciones Explica/expande acrnimos Muestra informacin de contacto del autor Inserta un applet (script) Define sectores para un mapa de imagen Convierte texto en negrita Establece la URI base, usada para resolver URIs relativas Establece el tamao de fuente por defecto para todo el documento Anula el algoritmo bidireccional para su contenido Muestra el texto en estilo de fuente "grande" Inserta una cita en forma de prrafo Acta como contenedor para toda la parte representable del documento (cuerpo) Forza un quiebre de lnea Crea un botn que permite contenido HTML (elementos) Establece un ttulo para una tabla Muestra su contenido centrado Inserta una cita o referencia Declara a su contenido como cdigo de computadora Establece atributos generales para las columnas de una tabla Agrupa un nmero de columnas en una tabla Muestra una definicin en una lista de trminos y definiciones

    Elemento <del> <dfn> <dir> <div> <dl> <dt> <em> <fieldset> <font> <form> <frame> <frameset> <h1> <h2> <h3> <h4> <h5> <h6> <head> <hr> <html> <i> <iframe>

    Vaco

    Descripcin corta Incluye texto que debera ser borrado o reemplazado (ya no vlido) Asigna una definicin a un trmino Inserta una lista de directorio (rbol) Define un bloque de contenido Inserta una lista de trminos y definiciones Inserta un trmino en una lista de trminos y definiciones Indica nfasis para su contenido Agrupa controles en un formlario Establece el estilo de fuente para su contenido Inserta un formulario Inserta un marco simple Inserta un conjunto de marcos Define un encabezado de nivel 1 Define un encabezado de nivel 2 Define un encabezado de nivel 3 Define un encabezado de nivel 4 Define un encabezado de nivel 5 Define un encabezado de nivel 6 Encierra el bloque de encabezado del documento (para las declaraciones globales) Dibuja una lnea horizontal Acta como contenedor para el documento entero (encabezado y cuerpo) Muestra su contenido con estilo de fuente itlica Inserta un marco dentro del contenido del documento

    Elemento <img> <input>

    Vaco

    Descripcin corta Inserta una imagen Muestra un control de entrada (texto, contrasea, casillas de verificacin, etc.)

    Vous aimerez peut-être aussi