SlideShare a Scribd company logo
1 of 15
Download to read offline
Karen Balandrán
Carlos Martínez
Adrían Ramírez
 Jessica Delgado
  Dana Saucedo
  Pedro Gómez
HTML 4
● El lenguaje HTML 4.0 es una especificación del lenguaje
  html aprobada por el World Wide Web Consortium.

● El HTML 4 desarrolla el lenguaje HTML con
  mecanismos para hojas de estilo, ejecución de scripts,
  marcos, objetos incluidos, soporte mejorado para texto
  de derecha a izquierda y direcciones mezcladas, tablas
  más ricas y mejoras en formularios, ofreciendo mejoras
  de accesibilidad para personas con discapacidades.
HTML 4
● El HTML 4.01 es una revisión que corrigió algunos
  errores que tenía el HTML 4.
Características
●   Esta especificación, además de las características relativas a texto,
    multimedia e hipervínculos de las versiones anteriores de HTML (HTML
    3.2 , y HTML 2.0), HTML 4 soporta más opciones de multimedia,
    lenguajes de scripts, hojas de estilo, mejores capacidades de
    impresión, y documentos más accesibles a usuarios con
    discapacidades. HTML 4 también da un gran paso adelante hacia la
    internacionalización de los documentos, con la intención de hacer la Web
    auténticamente universal.
●   HTML4 es una aplicación de SGML conforme al estándar internacional
    ISO 8879 -- Standard Generalized Markup Language [ISO8879].
●   HTML 4.01, que es parte de la línea de especificaciones de HTML 4. La
    primera versión de HTML 4 fue HTML 4.0, publicado el 18 de diciembre
    de 1997 y revisado el 24 de abril de 1998. Esta especificación es la primera
    Recomendación HTML 4.01. Incluye cambios no editoriales desde la
    versión del 24 de abril de HTML 4.0.
Características
● Mejor distinción entre la estructura y la presentación de
  un documento, aconsejando la utilización de hojas de
  estilo en lugar de elementos y atributos de presentación
  de HTML.
● Mejores formularios, incluyendo la adición de teclas de
  acceso, la posibilidad de agrupar semánticamente los
  controles de un formulario, la posibilidad de agrupar las
  opciones SELECT semánticamente, y los rótulos activos.
● La posibilidad de codificar una descripción textual de un
  objeto incluido (con el elemento OBJECT).
● Un nuevo mecanismo de mapas de imágenes en el lado
  del cliente (el elemento MAP) que permite a los autores
  integrar vínculos de imagen y de texto.
Características
● El requerimiento de que se incluya texto alternativo acompañando a las
  imágenes dentro del elemento IMG y a los mapas de imágenes dentro
  del elemento AREA.

● Soporte de los atributos title y lang en todos los elementos.

● Soporte de los elementos ABBR y ACRONYM

● Un espectro más amplio de medios utilizables por hojas de estilo (tty,
  braille, etc.).

● Tablas mejores, incluyendo títulos, grupos de columnas y
  mecanismos para facilitar su representación no visual.

●   Descripciones largas para tablas, imágenes, marcos, etc.
Elementos HTML 4 Removidos del HTML 5
 1.   <acronym>
 2.   <applet>
 3.   <basefont>
 4.   <big>* se usa para hacer el texto más grande.
 5.   <center>* se usa para centrar el texto.
 6.   <dir>
 7.   <font>*
 8.   <frame> inserta un marco o un conjunto de marcos es utilizado para dividir el espacio de
      trabajo del documento donde se encuentra, y cargar un documento html diferente en cada
      marco.
 9.   <frameset>
10.   <noframes>
11.   <strike>* se usa para dibujar una línea horizontal por encima del texto. una alternativa a esta función
      es usar el atributo text-decoration: line-through; mediante CSS
12.   <tt>*
*Algunas de estas funciones pueden seguir siendo usadas pero mediante CSS*
Nuevos Elementos
●   <article /> elemento que nos permite declarar un trozo del contenido como artículo. Ideal para blogs o
    periódicos.
●   <aside /> representa un trozo de contenido que se relaciona muy levemente con el resto del contenido.
●   <dialog /> elemento que permite reprensetar conversaciones.
●   <figure /> podrás usarlo para asociar con un caption un contenido incrustado, como por ejemplo
    gráficos o vídeo:
●   <footer /> Sección de la página para contener información sobre el autor, copyright, etc,…
●   <header /> representa a la sección de cabecera.
●   <nav /> representa la sección de la página orientada a la navegación.
●   <section /> elemento que indica que se trata de una sección genérica.
●   <audio /> y <video /> para el contenido multimedia.
●   <embed /> es un elemento dedicado para contenido de plugins.
●   <m /> representa el texto marcado.
●   <meter /> usado para representar medidas, por ejemplo el tamaño del disco usado…
●   <time /> usado para mostrar fechas y/o tiempo.
●   <canvas /> usado para mostrar gráficos renderizados en tiempo real, por ejemplo gráficos, juegos, etc,…
●   <commnad /> relacionado con los comandos que el usuario puede invocar.
●   <datagrid /> ideal para mostrar un arbol de datos o una tabla tabulada.
●   <details /> muestra información adicionar si el usuario lo demanda.
●   <datalist /> junto con el nuevo atributo list para los <input /> puede ser usado para crear comboboxes:
●   <event-sources /> puede ser usado para capturar eventos enviados desde servidor.
●   <output /> nos indica que tipo de salida vamos producir con nuestra página.
●   <progress /> representa una barra de proceso de una tarea, por ejemplo descargar,…
Nuevos Atributos
●   media: Para conseguir una mayor consistencia con el link en los elementos <a />
●   ping: Especificacremos una lista separada por espacios donde produciremos un ping
    cuando se siga el enlace, para los elementos <area /> y <a />
●   target: Disponible para mejorar la consistencia con el elemento <a />.
●   autofocus: Destinado para indicar el elemento <input /> (no hidden), <select />,<textarea
    /> o <button /> que ha de coger el foco al cargar la página.
●   form: Atributo para <input />, <ouput />, <select /> <textarea />, <button /> y<fieldset
    /> que permite que se sococien con un simple formulario.
●   replace: atributo para <input /&gt; <button /> y <form /> que le afectará cuando el
    contenido del elemento sofra algún cambio.
●   data: Para <form />, <select /&gt; y <datalist />.
●   required: Para elementos <input /> (Excepto hidden e image) y <textarea />, indica que
    el campo es obligatorio.
●   inputmode: Atributo para <input /> y <textarea />.
●   disabled: Para <fieldset />, permite desactivar el fieldset completo.
●   autocomplete, min, max, pattern, step: Para elementos <input /> permite delimitar las
    posibilidades de nuestros elementos de entrada.
●   list: Para elementos <datalist /> y <select />.
●   template: Para <input /> y <button /> podrá usarse para repetir templates.
●   scoped: Para elemento <style />, permitirá usar hojas de estilo “scoped” ??
●   async: Para el elemento <script /> el ajax hecho atributo.
Compatibilidad e Incompatibilidad entre
navegadores

Según varias estadísticas consultadas, el navegador Internet Explorer pierde
cada vez más usuarios, frente a otros navegadores que usan el motor de
Netscape (Netscape Navigator, Mozzila, Firefox). Y esto resulta un tanto
curioso, ya que muchas páginas están 'Optimizadas' solo para IE5 ó superior.

Algunos generadores de estadísticas como Nedstat Basic o RE
INVIGORATE instalados en diversas Web confirman que casi la tercera parte
utiliza navegadores como Safari, Opera o Netscape. Esto representa un factor
muy importante a la hora de desarrollar una página accesible al mayor número
posible de usuarios.
Compatibilidad
El problema radica en que cada explorador puede interpretar o no ciertas
etiquetas, debido sobre todo a razones generales de política comercial y
desarrollo del Web: cuando se realizan nuevas extensiones compatibles con la
última versión de HTML, se hacen incluso antes de que se establezcan los
estándares, intentando incluir las nuevas funciones incluidas en los borradores.
Si un navegador no reconoce una etiqueta, la ignora y nada de ella aparecerá en
la página visualizada. Para realizar las extensiones de estos navegadores se
añaden nuevos atributos a las etiquetas ya existentes, o se añaden nuevas
etiquetas.
Compatibilidad
Además, añadido al problema de los diferentes navegadores, está el problema
de las diferentes versiones de un mismo navegador. En particular las versiones
3 y anteriores de Netscape Navigator e Internet Explorer no soportan casi nada
de DHTML (uso de HTML 4, CSS y Javascript) y el soporte del mismo en sus
versiones 4 es bastante limitado. Y del lado del usuario resulta en gran medida
frustrante encontrarse con mensajes del tipo: 'Su navegador no soporta...',
'Web optimizada para navegador tal...', etc.

La solución más práctica a todos estos problemas es ajustarnos a los estándares
(cada vez más aceptados) especificados por la W3C (www.w3c.org) sobre
HTML 4.01 y CSS. Si a la hora de escribir el código fuente de la página,
utilizamos una herramienta de autor del tipo Microsoft FrontPage,
Macromedia Dreamweaver o Adobe Golive, en más de una ocasión nos
generarán un código incompatible a los estándares. Y el tener que arreglar este
código puede llegar a ser un proceso bastante pesado.
DTD y versión de HTML
● Un documento HTML válido declara qué versión de
   HTML se utiliza en el documento. La declaración del
   tipo de documento especifica la definición del tipo de
   documento (DTD) que se usa en el documento

● HTML 4.01 especifica tres DTDs, de modo que los
   autores deben incluir una de las siguientes
   declaraciones del tipo de documento en sus
   documentos. Los DTDs varían en cuanto a los elementos
   que soportan.
Doctype (DTD)
●   Strict Strict DTD incluye todos los elementos y atributos que no han sido
    desaprobados o que no aparecen en documentos con marcos. Para los documentos
    que usen este DTD, utilice esta declaración del tipo de documento:
     ○ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http:
         //www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
●   Transitional(Transitional DTD) incluye todo lo que incluye el DTD estricto más los
    elementos y atributos desaprobados (la mayoría de los cuales están relacionados con
    la presentación visual). Para los documentos que usen este DTD, utilice esta
    declaración del tipo de documento:
     ○ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
         "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
●   Frameset DTD incluye todo lo que incluye el DTD Transicional más los marcos.
    Para los documentos que usen este DTD, utilice esta declaración del tipo de
    documento:
     ○ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http:
         //www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
Bibliografía
http://www.anieto2k.com/2007/06/16/las-principales-diferencias-entre-html5-y-
html4/
http://www.w3schools.com/
http://html.conclase.net/w3c/html401-es/intro/intro.html#h-2.3
http://desarrolloweb.info/2009/07/10/html5-tabla-con-las-diferencias-con-
html4/
http://html.conclase.net/w3c/html401-es/struct/global.html

http://html5demos.com/canvas-grad
**chequen estás ligas*
Liga de diferencias entre Html 4 y 5 extensa---->
http://desarrolloweb.info/2009/07/10/html5-tabla-con-las-diferencias-con-html4/

HTML 4.0 Guidelines for Mobile Access --->
http://www.w3.org/TR/1999/NOTE-html40-mobile-19990315/

More Related Content

What's hot

Dreamweaver Interfaz
Dreamweaver InterfazDreamweaver Interfaz
Dreamweaver Interfazr2diseno
 
Tipos de usuarios en una base de datos
Tipos de usuarios en una base de datosTipos de usuarios en una base de datos
Tipos de usuarios en una base de datosjenpes
 
Programacion Orientada a Eventos
Programacion Orientada a EventosProgramacion Orientada a Eventos
Programacion Orientada a EventosLaura
 
curso Pseint 1 (16 ejercicios basicos)
curso Pseint 1 (16 ejercicios basicos)curso Pseint 1 (16 ejercicios basicos)
curso Pseint 1 (16 ejercicios basicos)Luis Ancel
 
Conclusiones- evolucion de la web
Conclusiones- evolucion de la webConclusiones- evolucion de la web
Conclusiones- evolucion de la webDyana Cordovez
 
Presentación de fases de diseño de base de datos
Presentación de fases de diseño de base de datosPresentación de fases de diseño de base de datos
Presentación de fases de diseño de base de datosYarquiri Claudio
 
COMO CREAR UNA BASE DE DATOS EN XAMPP
COMO CREAR UNA BASE DE DATOS EN XAMPPCOMO CREAR UNA BASE DE DATOS EN XAMPP
COMO CREAR UNA BASE DE DATOS EN XAMPPdisenarUniminuto
 
QUE ES CONSULTA Y TIPOS DE CONSULTA
QUE ES CONSULTA Y TIPOS DE CONSULTAQUE ES CONSULTA Y TIPOS DE CONSULTA
QUE ES CONSULTA Y TIPOS DE CONSULTAcristianjp
 
Ventajas y desventajas de openoffice
Ventajas y  desventajas de openofficeVentajas y  desventajas de openoffice
Ventajas y desventajas de openofficeolmerivan
 
Framework Laravel
Framework LaravelFramework Laravel
Framework LaravelRafael Lobo
 
web 3.0 y 4.0 características , diferencias y similitudes
web 3.0 y 4.0 características , diferencias y similitudesweb 3.0 y 4.0 características , diferencias y similitudes
web 3.0 y 4.0 características , diferencias y similitudeslaurenramirez98
 

What's hot (20)

Introducción a Javascript I
Introducción a Javascript IIntroducción a Javascript I
Introducción a Javascript I
 
Desventajas web 2.0
Desventajas web 2.0Desventajas web 2.0
Desventajas web 2.0
 
TIPOS DE BASE DE DATOS
TIPOS DE BASE DE DATOSTIPOS DE BASE DE DATOS
TIPOS DE BASE DE DATOS
 
Dreamweaver Interfaz
Dreamweaver InterfazDreamweaver Interfaz
Dreamweaver Interfaz
 
Presentación dreamweaver 1
Presentación dreamweaver 1Presentación dreamweaver 1
Presentación dreamweaver 1
 
Tipos de usuarios en una base de datos
Tipos de usuarios en una base de datosTipos de usuarios en una base de datos
Tipos de usuarios en una base de datos
 
Programacion Orientada a Eventos
Programacion Orientada a EventosProgramacion Orientada a Eventos
Programacion Orientada a Eventos
 
curso Pseint 1 (16 ejercicios basicos)
curso Pseint 1 (16 ejercicios basicos)curso Pseint 1 (16 ejercicios basicos)
curso Pseint 1 (16 ejercicios basicos)
 
Conclusiones- evolucion de la web
Conclusiones- evolucion de la webConclusiones- evolucion de la web
Conclusiones- evolucion de la web
 
Uso y manejo de DFD - Una aproximación
Uso y manejo de DFD - Una aproximaciónUso y manejo de DFD - Una aproximación
Uso y manejo de DFD - Una aproximación
 
Presentación de fases de diseño de base de datos
Presentación de fases de diseño de base de datosPresentación de fases de diseño de base de datos
Presentación de fases de diseño de base de datos
 
Desarrollo web
Desarrollo webDesarrollo web
Desarrollo web
 
COMO CREAR UNA BASE DE DATOS EN XAMPP
COMO CREAR UNA BASE DE DATOS EN XAMPPCOMO CREAR UNA BASE DE DATOS EN XAMPP
COMO CREAR UNA BASE DE DATOS EN XAMPP
 
QUE ES CONSULTA Y TIPOS DE CONSULTA
QUE ES CONSULTA Y TIPOS DE CONSULTAQUE ES CONSULTA Y TIPOS DE CONSULTA
QUE ES CONSULTA Y TIPOS DE CONSULTA
 
Ventajas y desventajas de openoffice
Ventajas y  desventajas de openofficeVentajas y  desventajas de openoffice
Ventajas y desventajas de openoffice
 
Tutorial PSEINT
Tutorial PSEINT Tutorial PSEINT
Tutorial PSEINT
 
El diseño web
El diseño webEl diseño web
El diseño web
 
Clave principal
Clave principalClave principal
Clave principal
 
Framework Laravel
Framework LaravelFramework Laravel
Framework Laravel
 
web 3.0 y 4.0 características , diferencias y similitudes
web 3.0 y 4.0 características , diferencias y similitudesweb 3.0 y 4.0 características , diferencias y similitudes
web 3.0 y 4.0 características , diferencias y similitudes
 

Viewers also liked

Viewers also liked (20)

Diferencias html5 y html anteriores
Diferencias html5 y html anterioresDiferencias html5 y html anteriores
Diferencias html5 y html anteriores
 
Características novedades html5
Características novedades html5Características novedades html5
Características novedades html5
 
Diferencia de html y html 5
Diferencia de html y html 5Diferencia de html y html 5
Diferencia de html y html 5
 
Caracteristicas de la web 2.0
Caracteristicas de la web 2.0Caracteristicas de la web 2.0
Caracteristicas de la web 2.0
 
Linea del Tiempo
Linea del TiempoLinea del Tiempo
Linea del Tiempo
 
curso html
curso htmlcurso html
curso html
 
Introducción a HTML
Introducción a HTMLIntroducción a HTML
Introducción a HTML
 
html
htmlhtml
html
 
Diferencias entre html y html5..
Diferencias entre html y html5..Diferencias entre html y html5..
Diferencias entre html y html5..
 
Html2
Html2Html2
Html2
 
XML: HTML y XHTML
XML: HTML y XHTMLXML: HTML y XHTML
XML: HTML y XHTML
 
HTML - HTML5
HTML - HTML5 HTML - HTML5
HTML - HTML5
 
DIFERENCIA ENTRE HTML Y XML
DIFERENCIA ENTRE HTML Y XMLDIFERENCIA ENTRE HTML Y XML
DIFERENCIA ENTRE HTML Y XML
 
Linea de tiempo s.o
Linea de tiempo s.oLinea de tiempo s.o
Linea de tiempo s.o
 
Caracteristicas del diseño Multimedia
Caracteristicas del diseño MultimediaCaracteristicas del diseño Multimedia
Caracteristicas del diseño Multimedia
 
Resumen html
Resumen htmlResumen html
Resumen html
 
HTML5 Enfoque Semantico
HTML5 Enfoque SemanticoHTML5 Enfoque Semantico
HTML5 Enfoque Semantico
 
breve historia de html
breve historia de htmlbreve historia de html
breve historia de html
 
Difference Between HTML and HTML5
Difference Between HTML and HTML5Difference Between HTML and HTML5
Difference Between HTML and HTML5
 
Temas de html
Temas de htmlTemas de html
Temas de html
 

Similar to Html4 (20)

Html4 equipo
Html4 equipoHtml4 equipo
Html4 equipo
 
Html4
Html4Html4
Html4
 
Presentación Seminario Cleformación HTML5, El lenguaje del futuro
Presentación Seminario Cleformación HTML5, El lenguaje del futuroPresentación Seminario Cleformación HTML5, El lenguaje del futuro
Presentación Seminario Cleformación HTML5, El lenguaje del futuro
 
NUEVO!!! EN HTML 5
NUEVO!!! EN HTML 5NUEVO!!! EN HTML 5
NUEVO!!! EN HTML 5
 
John ferney rozo roa
John ferney rozo roaJohn ferney rozo roa
John ferney rozo roa
 
HTML5 Nuevas Etiquetas Semanticas
HTML5 Nuevas Etiquetas SemanticasHTML5 Nuevas Etiquetas Semanticas
HTML5 Nuevas Etiquetas Semanticas
 
Consulta sobre acces, HMTL
Consulta sobre acces, HMTLConsulta sobre acces, HMTL
Consulta sobre acces, HMTL
 
Clase 04 Html
Clase 04   HtmlClase 04   Html
Clase 04 Html
 
Instituto tecnológico de nor 3
Instituto tecnológico de nor 3Instituto tecnológico de nor 3
Instituto tecnológico de nor 3
 
Html vanegas morales, vasquez montejo
Html vanegas morales, vasquez montejoHtml vanegas morales, vasquez montejo
Html vanegas morales, vasquez montejo
 
Html vanegas morales, vasquez montejo
Html vanegas morales, vasquez montejoHtml vanegas morales, vasquez montejo
Html vanegas morales, vasquez montejo
 
Consultas profe
Consultas profe Consultas profe
Consultas profe
 
Html 5
Html 5Html 5
Html 5
 
Historia del HTML
Historia del HTMLHistoria del HTML
Historia del HTML
 
Html
HtmlHtml
Html
 
Introduccion a HTML - XHTML - Clase 01
Introduccion a HTML - XHTML - Clase 01Introduccion a HTML - XHTML - Clase 01
Introduccion a HTML - XHTML - Clase 01
 
Html
HtmlHtml
Html
 
Html
HtmlHtml
Html
 
Trabajo de informatica que es HTML
Trabajo de informatica que es HTMLTrabajo de informatica que es HTML
Trabajo de informatica que es HTML
 
Html tarea
Html tareaHtml tarea
Html tarea
 

Html4

  • 1. Karen Balandrán Carlos Martínez Adrían Ramírez Jessica Delgado Dana Saucedo Pedro Gómez
  • 2. HTML 4 ● El lenguaje HTML 4.0 es una especificación del lenguaje html aprobada por el World Wide Web Consortium. ● El HTML 4 desarrolla el lenguaje HTML con mecanismos para hojas de estilo, ejecución de scripts, marcos, objetos incluidos, soporte mejorado para texto de derecha a izquierda y direcciones mezcladas, tablas más ricas y mejoras en formularios, ofreciendo mejoras de accesibilidad para personas con discapacidades.
  • 3. HTML 4 ● El HTML 4.01 es una revisión que corrigió algunos errores que tenía el HTML 4.
  • 4. Características ● Esta especificación, además de las características relativas a texto, multimedia e hipervínculos de las versiones anteriores de HTML (HTML 3.2 , y HTML 2.0), HTML 4 soporta más opciones de multimedia, lenguajes de scripts, hojas de estilo, mejores capacidades de impresión, y documentos más accesibles a usuarios con discapacidades. HTML 4 también da un gran paso adelante hacia la internacionalización de los documentos, con la intención de hacer la Web auténticamente universal. ● HTML4 es una aplicación de SGML conforme al estándar internacional ISO 8879 -- Standard Generalized Markup Language [ISO8879]. ● HTML 4.01, que es parte de la línea de especificaciones de HTML 4. La primera versión de HTML 4 fue HTML 4.0, publicado el 18 de diciembre de 1997 y revisado el 24 de abril de 1998. Esta especificación es la primera Recomendación HTML 4.01. Incluye cambios no editoriales desde la versión del 24 de abril de HTML 4.0.
  • 5. Características ● Mejor distinción entre la estructura y la presentación de un documento, aconsejando la utilización de hojas de estilo en lugar de elementos y atributos de presentación de HTML. ● Mejores formularios, incluyendo la adición de teclas de acceso, la posibilidad de agrupar semánticamente los controles de un formulario, la posibilidad de agrupar las opciones SELECT semánticamente, y los rótulos activos. ● La posibilidad de codificar una descripción textual de un objeto incluido (con el elemento OBJECT). ● Un nuevo mecanismo de mapas de imágenes en el lado del cliente (el elemento MAP) que permite a los autores integrar vínculos de imagen y de texto.
  • 6. Características ● El requerimiento de que se incluya texto alternativo acompañando a las imágenes dentro del elemento IMG y a los mapas de imágenes dentro del elemento AREA. ● Soporte de los atributos title y lang en todos los elementos. ● Soporte de los elementos ABBR y ACRONYM ● Un espectro más amplio de medios utilizables por hojas de estilo (tty, braille, etc.). ● Tablas mejores, incluyendo títulos, grupos de columnas y mecanismos para facilitar su representación no visual. ● Descripciones largas para tablas, imágenes, marcos, etc.
  • 7. Elementos HTML 4 Removidos del HTML 5 1. <acronym> 2. <applet> 3. <basefont> 4. <big>* se usa para hacer el texto más grande. 5. <center>* se usa para centrar el texto. 6. <dir> 7. <font>* 8. <frame> inserta un marco o un conjunto de marcos es utilizado para dividir el espacio de trabajo del documento donde se encuentra, y cargar un documento html diferente en cada marco. 9. <frameset> 10. <noframes> 11. <strike>* se usa para dibujar una línea horizontal por encima del texto. una alternativa a esta función es usar el atributo text-decoration: line-through; mediante CSS 12. <tt>* *Algunas de estas funciones pueden seguir siendo usadas pero mediante CSS*
  • 8. Nuevos Elementos ● <article /> elemento que nos permite declarar un trozo del contenido como artículo. Ideal para blogs o periódicos. ● <aside /> representa un trozo de contenido que se relaciona muy levemente con el resto del contenido. ● <dialog /> elemento que permite reprensetar conversaciones. ● <figure /> podrás usarlo para asociar con un caption un contenido incrustado, como por ejemplo gráficos o vídeo: ● <footer /> Sección de la página para contener información sobre el autor, copyright, etc,… ● <header /> representa a la sección de cabecera. ● <nav /> representa la sección de la página orientada a la navegación. ● <section /> elemento que indica que se trata de una sección genérica. ● <audio /> y <video /> para el contenido multimedia. ● <embed /> es un elemento dedicado para contenido de plugins. ● <m /> representa el texto marcado. ● <meter /> usado para representar medidas, por ejemplo el tamaño del disco usado… ● <time /> usado para mostrar fechas y/o tiempo. ● <canvas /> usado para mostrar gráficos renderizados en tiempo real, por ejemplo gráficos, juegos, etc,… ● <commnad /> relacionado con los comandos que el usuario puede invocar. ● <datagrid /> ideal para mostrar un arbol de datos o una tabla tabulada. ● <details /> muestra información adicionar si el usuario lo demanda. ● <datalist /> junto con el nuevo atributo list para los <input /> puede ser usado para crear comboboxes: ● <event-sources /> puede ser usado para capturar eventos enviados desde servidor. ● <output /> nos indica que tipo de salida vamos producir con nuestra página. ● <progress /> representa una barra de proceso de una tarea, por ejemplo descargar,…
  • 9. Nuevos Atributos ● media: Para conseguir una mayor consistencia con el link en los elementos <a /> ● ping: Especificacremos una lista separada por espacios donde produciremos un ping cuando se siga el enlace, para los elementos <area /> y <a /> ● target: Disponible para mejorar la consistencia con el elemento <a />. ● autofocus: Destinado para indicar el elemento <input /> (no hidden), <select />,<textarea /> o <button /> que ha de coger el foco al cargar la página. ● form: Atributo para <input />, <ouput />, <select /> <textarea />, <button /> y<fieldset /> que permite que se sococien con un simple formulario. ● replace: atributo para <input /&gt; <button /> y <form /> que le afectará cuando el contenido del elemento sofra algún cambio. ● data: Para <form />, <select /&gt; y <datalist />. ● required: Para elementos <input /> (Excepto hidden e image) y <textarea />, indica que el campo es obligatorio. ● inputmode: Atributo para <input /> y <textarea />. ● disabled: Para <fieldset />, permite desactivar el fieldset completo. ● autocomplete, min, max, pattern, step: Para elementos <input /> permite delimitar las posibilidades de nuestros elementos de entrada. ● list: Para elementos <datalist /> y <select />. ● template: Para <input /> y <button /> podrá usarse para repetir templates. ● scoped: Para elemento <style />, permitirá usar hojas de estilo “scoped” ?? ● async: Para el elemento <script /> el ajax hecho atributo.
  • 10. Compatibilidad e Incompatibilidad entre navegadores Según varias estadísticas consultadas, el navegador Internet Explorer pierde cada vez más usuarios, frente a otros navegadores que usan el motor de Netscape (Netscape Navigator, Mozzila, Firefox). Y esto resulta un tanto curioso, ya que muchas páginas están 'Optimizadas' solo para IE5 ó superior. Algunos generadores de estadísticas como Nedstat Basic o RE INVIGORATE instalados en diversas Web confirman que casi la tercera parte utiliza navegadores como Safari, Opera o Netscape. Esto representa un factor muy importante a la hora de desarrollar una página accesible al mayor número posible de usuarios.
  • 11. Compatibilidad El problema radica en que cada explorador puede interpretar o no ciertas etiquetas, debido sobre todo a razones generales de política comercial y desarrollo del Web: cuando se realizan nuevas extensiones compatibles con la última versión de HTML, se hacen incluso antes de que se establezcan los estándares, intentando incluir las nuevas funciones incluidas en los borradores. Si un navegador no reconoce una etiqueta, la ignora y nada de ella aparecerá en la página visualizada. Para realizar las extensiones de estos navegadores se añaden nuevos atributos a las etiquetas ya existentes, o se añaden nuevas etiquetas.
  • 12. Compatibilidad Además, añadido al problema de los diferentes navegadores, está el problema de las diferentes versiones de un mismo navegador. En particular las versiones 3 y anteriores de Netscape Navigator e Internet Explorer no soportan casi nada de DHTML (uso de HTML 4, CSS y Javascript) y el soporte del mismo en sus versiones 4 es bastante limitado. Y del lado del usuario resulta en gran medida frustrante encontrarse con mensajes del tipo: 'Su navegador no soporta...', 'Web optimizada para navegador tal...', etc. La solución más práctica a todos estos problemas es ajustarnos a los estándares (cada vez más aceptados) especificados por la W3C (www.w3c.org) sobre HTML 4.01 y CSS. Si a la hora de escribir el código fuente de la página, utilizamos una herramienta de autor del tipo Microsoft FrontPage, Macromedia Dreamweaver o Adobe Golive, en más de una ocasión nos generarán un código incompatible a los estándares. Y el tener que arreglar este código puede llegar a ser un proceso bastante pesado.
  • 13. DTD y versión de HTML ● Un documento HTML válido declara qué versión de HTML se utiliza en el documento. La declaración del tipo de documento especifica la definición del tipo de documento (DTD) que se usa en el documento ● HTML 4.01 especifica tres DTDs, de modo que los autores deben incluir una de las siguientes declaraciones del tipo de documento en sus documentos. Los DTDs varían en cuanto a los elementos que soportan.
  • 14. Doctype (DTD) ● Strict Strict DTD incluye todos los elementos y atributos que no han sido desaprobados o que no aparecen en documentos con marcos. Para los documentos que usen este DTD, utilice esta declaración del tipo de documento: ○ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http: //www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> ● Transitional(Transitional DTD) incluye todo lo que incluye el DTD estricto más los elementos y atributos desaprobados (la mayoría de los cuales están relacionados con la presentación visual). Para los documentos que usen este DTD, utilice esta declaración del tipo de documento: ○ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> ● Frameset DTD incluye todo lo que incluye el DTD Transicional más los marcos. Para los documentos que usen este DTD, utilice esta declaración del tipo de documento: ○ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http: //www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">