Comienza Ya. Es Gratis
ó regístrate con tu dirección de correo electrónico
HTML5 por Mind Map: HTML5

1. 1.2 Estructura Global

1.1. Para crearlo se debe utilizar la etiqueta <!DOCTYPE html>

1.1.1. Esta línea debe ser la primera línea del archivo, sin espacios o líneas que la precedan.

1.1.2. Luego de declarar el tipo de documento, debemos comenzar a construir la estructura HTML.

1.1.3. <!DOCTYPE html> <html lang=”es”> </html>

1.1.4. El atributo lang en la etiqueta de apertura <html> es el único atributo que necesitamos especificar en HTML5.

1.1.4.1. Este atributo define el idioma humano del contenido del documento que estamos creando, en este caso es por español.

1.2. su estructura debe proveer forma, organización y flexibilidad

1.2.1. Es estrictamente organizado.

1.2.2. Las etiquetas HTML son palabras clave y atributos rodeados de los signos mayor y menor (< , >)

1.3. Etiquetas

1.3.1. El código HTML insertado entre las etiquetas <html> tiene que ser dividido entre dos secciones principales.

1.3.1.1. la primera sección es la cabecera y la segunda el cuerpo

1.3.1.1.1. Cabecera: <head></head>

1.3.1.1.2. Cuerpo: <body></body>

1.3.2. Algunos cambios e innovaciones fueron incorporados dentro de la cabecera, y uno de ellos es la etiqueta que define el juego de caracteres a utilizar para mostrar el documento.

1.3.2.1. La nueva etiqueta <meta> para la definición del tipo de caracteres es más corta y simple.

1.3.2.1.1. Hay varios tipos de etiqueta <meta> que pueden ser incluidas para declarar información general sobre el documento

1.3.3. <title>

1.3.3.1. La etiqueta <title>, como siempre, simplemente especifica el título del documento

1.3.4. <link>

1.3.4.1. Este elemento es usado para incorporar estilos, códigos Javascript, imágenes o iconos desde archivos externos

2. 1.3 Estructura del cuerpo

2.1. HTML siempre ofreció diferentes formas de construir y organizar la información dentro del cuerpo de un documento.

2.2. Etiquetas

2.2.1. <table>

2.2.1.1. Table nos ayuda a crear tablas que permiten a los diseñadores acomodar datos, texto, imágenes y herramientas dentro de filas y columnas de celdas

2.2.2. <header>

2.2.2.1. la intención de esta es proveer información introductoria (títulos, subtítulos, logos) en el cuerpo o secciones especificas de la pagina

2.2.3. <nav>

2.2.3.1. Es la barra de navegación.

2.2.4. <section>

2.2.4.1. Se utiliza para poder colocar una o varias columnas

2.2.5. <aside>

2.2.5.1. Se utiliza para diferenciar las clases secundarias de información.

2.2.6. <footer>

2.2.6.1. Para finalizar la construcción de la plantilla o estructura elemental de nuestro documento HTML5, solo necesitamos un elemento más

2.2.6.1.1. Nos permite cerrar nuestro diseño para otorgarle un final al cuerpo del documento.

3. 1.4 Dentro del cuerpo

3.1. Esta información estará compuesta por diferentes elementos visuales como títulos, textos, imágenes, vídeos y aplicaciones interactivas, entre otros.

3.2. Etiquetas:

3.2.1. <article>

3.2.1.1. los blogs están divididos en entradas, sitios web normalmente presentan información relevante dividida en partes que comparten similares características, esta etiqueta nos permite identificar cada una de estas partes

3.2.1.2. Este elemento no se limita. Fue creado con la intención de contener unidades independientes de contenido.

3.2.2. <hgroup> y <h1>

3.2.2.1. Dentro de cada elemento <header>, en la parte superior del cuerpo o al comienzo de cada <article>, incorporamos elementos <h1> para declarar un título

3.2.2.2. <h1> son todo lo que necesitamos para crear una línea de cabecera para cada parte del documento

3.2.2.3. Para construir este tipo de cabeceras, podemos aprovechar el resto de las etiquetas H, como <h1>, <h2>, <h3>, <h4>, <h5> y <h6>

3.2.2.3.1. pero siempre considerando que por propósitos de procesamiento interno, y para evitar generar múltiples secciones durante la interpretación del documento por parte del navegador, estas etiquetas deben ser agrupadas juntas

3.2.3. <figure> y <figcaption>

3.2.3.1. La etiqueta <figure> fue creada para ayudarnos a ser aún más específicos a la hora de declarar el contenido del documento

4. 1.5 Nuevos y viejos elementos

4.1. HTML5 fue desarrollado con la intención de simplificar, especificar y organizar el código. Para lograr este propósito, nuevas etiquetas y atributos fueron agregados y HTML fue completamente integrado a CSS y Javascript

4.2. Etiquetas:

4.2.1. <em>

4.2.1.1. es para indicar énfasis (reemplazando la etiqueta <i>)

4.2.2. <strong>

4.2.2.1. es para indicar importancia.

4.2.3. <mark>

4.2.3.1. fue agregada para resaltar parte de un texto que originalmente no era considerado importante pero ahora es relevante acorde con las acciones del usuario

4.2.4. <b>

4.2.4.1. debería ser usado solo cuando no hay otro elemento más apropiado para la situación.

4.2.5. <small>

4.2.5.1. Sirve para presentar la llamada letra pequeña, como impresiones legales, descargos, etc…

4.2.6. <cite>

4.2.6.1. Encierra el título de un trabajo, como un libro, una película, una canción, etc…

4.2.7. <address>

4.2.7.1. Es un viejo elemento convertido en un elemento estructural. No necesitamos usarlo previamente para construir nuestra plantilla, sin embargo podría ubicarse perfectamente en algunas situaciones en las que debemos presentar información de contacto relacionada con el contenido del elemento <article> o el cuerpo completo.

4.2.8. <time>

4.2.8.1. nos permite declarar un texto comprensible para humanos y navegadores que representa fecha y hora

5. 1.1 Componentes básicos

5.1. Es un archivo de texto.

5.2. Para utilizarlo, debe usarse un editor de texto

5.2.1. El archivo debe ser grabado con la extensión .html

5.3. es considerado el producto de la combinación de HTML, CSS y Javascript.