Search

Diseño Web HTML5 CSS3 Javascript

Diseño Web – Amit Kvint

Category

Html5

Esquema de Contenido en HTML5

Buenas noches…

No como en nuestro amigo de toda la vida HTML4, donde hemos tenido basicamente solo dos categorias de elementos de contenido – inline elements & bloc elements – o sea elementos en linea & elementos en bloque, con HTML5 tenemos 7(!) importantes diferentes categorias:

  1. Metadata – esta categoria en realidad ya la conocemos aqui va la informacion del documento en relacion con otros documentos o informacion añadida a los buscadores o usaurios que no son humanos…por ejemplo – title, link, script etc…
  2. Embedded – aqui entran todos los elementos que son externos & que se van a aplicar a nuestro documento, por ejemplo – img, embed, object, video
  3. Interactive – los elementos que permiten al usuario interactivar con la pagina o activar algo en la pagina – por ejemplo – a, audio & video (cuando añadimos los controles) & input (de los cuestionarios)
  4. Heading – aqui entra el encabazedo de nuesta pagina web, el Heading con los Sections difine la esquema de la pagina, las etiquetas aqui son H1-H6 & Header
  5. Phrasing – el texto de la pagina parecido al inline del HTML4, aqui esta el contenido real de la pagina
  6. Flow – la mayoria de los elementos que usamos dentro del BODY entran aqui, es digamos lo que se presenta en el flujo normal de un documento HTML, es uno significa nad a la hora de mostrar lo como inline o bloc !
  7. Section – se usa para dividir nuestro documentos en diferentes secciones – da sintaxis a los antiguos DIV

http://dev.w3.org/html5/html-author/#categories

Esquema del algoritmo de HTML5

  1. Section & Heading (secciones & encabezados) determinan la esquema del algoritmo que se esta produciendo el HTML5
  2. El BODY se establece como la ruta de la esquema
  3. A partir del BODY cada vez que se encuentra un SECTION se añade un articulo
  4. Los HEADING se usa para nombrar las diferentes secciones
  5. SECTION dentro de SECTION es anidada (?)

Article / Aisde / Section / Nav / H1-H6 – crean secciones en el documento

Aqui esta una buena pagina explicando como es la esquema en HTML5

http://html5doctor.com/outlines/

& Aqui una buena herramienta para probar codigo –

http://gsnedders.html5.org/outliner/

 

Ya esta…por ahora

 

Amit

 

Intro HTML5

Aquí esta el vinculo del W3 :

http://validator.w3.org/

HTML5 – la versión completa para profesionales :

http://dev.w3.org/html5/html-author/

& Aqui esta la guía de referencia del W3 :

http://www.w3schools.com/html5/html5_reference.asp

Hoy vamos a ver como transformamos nuestro código escrito en HTML4 con las nuevas posibilidades del HTML5.

  1. Para que nos sirven los nuevos cambios en HTML5 ?
  2. Como definimos una nuevo archivo en HTML5 ?
  3. El nuevo sintaxis de HTML5
    1. las etiquetas & atributos que se puede quitar
    2. escribiendo mal código…
    3. la anulación del cierre de etiquetas
  4. HEADER
  5. NAV
  6. SECTION
  7. ARTICLE
  8. ASIDE
  9. FOOTER
  10. El modelo nuevo de contenido
  11. Algoritmo de esquema

Nuevos elementos y Input type en HTML5

En HTML 5 se han añadido unos Input type nuevos, en general son para indicar al navegador que tipo de información se va a insertar el usuario, ayuda a la hora de validar el cuestionario de una forma automática (según el navegador) &  da al usuario mas accesibilidad e interfaz mas intuitivo, ademas de mejorar la accesibilidad en los móviles Smartphone, Androide, Iphone, Tabletas etc…. Continue reading “Nuevos elementos y Input type en HTML5”

Blog at WordPress.com.

Up ↑

%d bloggers like this: