JOHN FERNEY ROZO ROA
Hasta hace poco, la última versión oficial del HTML era la HTML 2.0. Cumplía su función perfectamente, pero muchos
usuarios del HTML querían tener un control mayor sobre sus documentos, tanto en el formateo del texto como en la
apariencia de la página.HTML 3.0
Mientras tanto, Netscape, que era en esa época el líder indiscutible de los navegadores, introducía con cada nueva versión
etiquetas y atributos no contemplados en el estándar oficial, con gran escándalo de algunos.Debido a su amplia difusión y
aceptación, otros navegadores intentaban copiar esas innovaciones, pero debido a que Netscape no especificaba
completamente sus nuevas etiquetas, los resultados no eran siempre los deseados. Todo ello provocaba una gran confusión, y
numerosos problemas, cuando los autores utilizaban estos elementos y comprobaban que no funcionaba como querían en
otros navegadores.
Por esa época, el comité de trabajo del HTML de la IETF, propuso un borrador de un nuevo estándar, el HTML 3.0 que
incluía numerosas y útiles mejoras. Pero debido a que era excesivamente extenso y ambicioso, los navegadores sólo
utilizaban una pequeña parte del nuevo estándar, lo que producía aún mayor confusión y por lo que acabó finalmente siendo
abandonado.
Estándares de HTML
HTML 3.2
Cada vez era más evidente la necesidad de un nuevo estándar que fuera aceptado por todos. Se formó otro comité, el W3C,
apoyado por los principales vendedores de software (entre ellos, IBM, Microsoft, Novell, Netscape, Sun, etc.). El nuevo
estándar ha sido desarrollado durante todo el año 1996 por el W3C con el sobrenombre de Wilbur, y finalmente, en Enero de
1997 ha sido aprobado como el HTML 3.2El HTML 3.2 es totalmente compatible con el estándar anterior, pero incorpora
muchas de las innovaciones de los navegadores comerciales (Netscape y Explorer principalmente), tales como tablas, applets,
texto que bordea las imágenes, etc., aunque no todas, como por ejemplo los frames.
Se puede consultar la documentación oficial del HTML 3.2 en Introducing HTML 3.2, pero es más manejable y práctica la
presentada en Wilbur - HTML 3.2, donde se pueden ver con detalle las distintas etiquetas, e incluso obtener una versión off-
line del nuevo estándar.
Primer borrador público del HTML 4.0
En Julio de 1997 se ha presentado el primer borrador público del próximo estándar oficial HTML 4.0 (que tiene el nombre
clave de Cougar). En él se incorporan las especificaciones sobre tablas, frames, scripts, hojas de estilo, accesibilidad por
distintos medios, e internacionalización (incluyendo el uso de Unicode, en lugar del Latin-1).Este estándar propuesto
representa un gran avance con respecto a los anteriores. Existe un comunicado de prensa de la W3C. El borrador, que es muy
extenso, se puede consultar en esta dirección.
Los estándares y este manual
En los capítulos anteriores a éste (HTML esencial) se han explicado, en líneas generales, las etiquetas que cumplían con la
anterior norma HTML 2.0. En los capítulos que siguen se hablará de las etiquetas incorporadas al nuevo estándar, más algunas
otras que no lo están, pero que son implementadas por los navegadores más importantes (Netscape y Explorer).
Formato De Imágenes
Las imagénes digitales se pueden guardar en distintos formatos. Cada uno se corresponde con una extensión
específica del archivo que lo contiene. Los más utilizados en la actualidad son: BMP, GIF, JPG, TIF y PNG.
BMP (Bitmap = Mapa de bits)
Ha sido muy utilizado porque fue desarrollado para aplicaciones Windows.
La imagen se forma mediante una parrilla de píxeles.
El formato BMP no sufre pérdidas de calidad y por tanto resulta adecuado para guardar imágenes que se desean
manipular posteriormente.
Ventaja: Guarda gran cantidad de información de la imagen.
Inconveniente: El archivo tiene un tamaño muy grande.
GIF (Graphics Interchange Format = Formato de Intercambio Gráfico)
Ha sido diseñado específicamente para comprimir imágenes digitales.
Reduce la paleta de colores a 256 colores como máximo (profundidad de color de 8 bits).
Admite gamas de menor número de colores y esto permite optimizar el tamaño del archivo que contiene la imagen.
Ventaja: Es un formato idóneo para publicar dibujos en la web.
Inconveniente: No es recomendable para fotografías de cierta calidad ni originales ya que el color real o verdadero
utiliza una paleta de más de 256 colores.
JPG-JPEG (Joint Photographic Experts Group = Grupo de Expertos Fotográficos Unidos)
•A diferencia del formato GIF, admite una paleta de hasta 16 millones de colores.
•Es el formato más común junto con el GIF para publicar imágenes en la web.
•La compresión JPEG puede suponer cierta pérdida de calidad en la imagen. En la mayoría de los casos esta pérdida se puede
asumir porque permite reducir el tamaño del archivo y su visualización es aceptable. Es recomendable utilizar una calidad del
60-90 % del original.
•Cada vez que se modifica y guarda un archivo JPEG, se puede perder algo de su calidad si se define cierto factor de
compresión.
•Las cámaras digitales suelen almacenar directamente las imágenes en formato JPEG con máxima calidad y sin compresión.
•Ventaja: Es ideal para publicar fotografías en la web siempre y cuando se configuren adecuadamente dimensiones y
compresión.
•Inconveniente: Si se define un factor de compresión se pierde calidad. Por este motivo no es recomendable para archivar
originales.
TIF-TIFF (Tagged Image File Format = Formato de Archivo de Imagen Etiquetada)
•Almacena imágenes de una calidad excelente.
•Utiliza cualquier profundidad de color de 1 a 32 bits.
•Es el formato ideal para editar o imprimir una imagen.
•Ventaja: Es ideal para archivar archivos originales.
•Inconveniente: Produce archivos muy grandes.
PNG (Portable Network Graphic = Gráfico portable para la red)
•Es un formato de reciente difusión alternativo al GIF.
•Tiene una tasa de compresión superior al formato GIF (+10%)
•Admite la posibilidad de emplear un número de colores superior a los 256 que impone el GIF.
•Debido a su reciente aparición sólo es soportado en navegadores modernos como IE 4 o superior.
Atributos En HTML
un elemento puede tener atributos y eventos. Mientras que los atributos definen valores o
propiedades para ser utilizadas por los navegadores en el procesamiento del documento, los
eventos pueden ser empleados para especificar comportamientos o acciones a ser desempeñadas
cuando ciertas condiciones se cumplen, como por ejemplo, cuando el usuario hace un click sobre
el elemento.
Atributos y eventos comparten una misma sintaxis: se deben insertar dentro de la etiqueta de
apertura como una lista de items separados por espacios, luego del nombre del elemento y
precedida por un espacio. Cada uno de estos ítems se compone de un nombre (para el atributo o
evento), el signo igual ("=") y el valor o función (a veces opcionalmente) encerrado entre comillas.
El siguiente ejemplo muestra un elemento b con un atributo (style) y un evento (onclick).
<b style="color: red" onclick="changeColor(this.parentNode)">Texto importante</b>
Texto importante
El contenido de un elemento es, hablando en términos generales, todo aquello que se encuentra entre sus
etiquetas de apertura y cierre. Dependiendo del elemento, esto puede ir desde absolutamente nada a un trozo
de documento HTML. Este contenido es lo que será afectado por la funcionalidad o significado del elemento.
Por ejemplo, el elemento em brinda énfasis a su contenido, y los navegadores habitualmente muestran su texto
con un estilo de fuente particular para hacerlo sobresalir del texto normal.
Algunos elementos, conocidos como elementos vacíos, no tienen permitido poseer contenido y su declaración
consiste únicamente en la etiqueta de apertura con cualquier cantidad de atributos y eventos.
En el siguiente ejemplo hay tres elementos, cada uno con un tipo distinto de contenido: el párrafo (elemento
p), conteniendo a otros elementos; una palabra con énfasis (elemento em), conteniendo sólo texto; y un botón
(elemento input (type=button)), el cual es un elemento vacío.
<p>Es este un día <em>lluvioso</em>? <input type="button" value="Sí"></p>
Frames En HTML
 Amados u odiados, útiles o inútiles, excelentes o pésimos, los marcos son instrumentos que forman
ya parte habitual del web y que los navegadores gestionan hoy día a la perfección. Los detractores
de los marcos afirman la inutilidad de subdividir ulteriormente las páginas web, las cuales, en última
instancia, pueden resultar poco legibles.
 . Otros, como yo, consideran que los marcos pueden llegar a ser muy útiles ya que se evita cargar las
mismas imágenes y se mantienen ordenados el contenido y la estructura del sitio. Naturalmente,
abusar de los marcos puede producir como resultado pésimas impostaciones gráficas, obteniendo
un efecto contrario al previsto.
Un punto en contra de los marcos es, ciertamente, su incompatibilidad con los programas de
navegación gráfica destinados a invidentes, los cuales se bloquean impidiendo la lectura de las
páginas.
N2.0 Documento Marco <FRAMESET></FRAMESET> (en lugar de <BODY>)
N2.0 altura en filas <FRAMESET ROWS=,,,></FRAMESET> (píxel ó %)
N2.0 altura en filas <FRAMESET ROWS=*></FRAMESET> (* = tamaño relativo)
N2.0 anchura en columnas <FRAMESET COLS=,,,></FRAMESET> (píxel ó %)
N2.0 anchura en columnas <FRAMESET COLS=*></FRAMESET> (* = tamaño relativo)
N3.0b anchura del borde <FRAMESET BORDER=?>
N3.0b borde <FRAMESET FRAMEBORDER="yes|no">
N3.0b color del borde <FRAMESET BORDERCOLOR="#$$$$$$">
N2.0 Definición del marco <FRAME> (contenido de cada uno de los recuadros)
N2.0 documento que se debe mostrar <FRAME SRC="URL">
N2.0 denominazione del frame <FRAME NAME="***"|_blank|_self| _parent|_top>
N2.0 anchura de los márgenes <FRAME MARGINWIDTH=?> (margen izquierdo y derecho)
N2.0 altura de los márgenes <FRAME MARGINHEIGHT=?> (margen superior e inferior)
N2.0 barra de desplazamiento o no <FRAME SCROLLING="YES|NO|AUTO">
N2.0 no redimensionable <FRAME NORESIZE>
N3.0b borde <FRAME FRAMEBORDER="yes|no">
N3.0b color del borde <FRAME BORDERCOLOR="#$$$$$$">
N2.0 contenido en ausencia de marco <NOFRAMES></NOFRAMES> (para navegadores
antiguos)

John ferney rozo roa

  • 1.
  • 2.
    Hasta hace poco,la última versión oficial del HTML era la HTML 2.0. Cumplía su función perfectamente, pero muchos usuarios del HTML querían tener un control mayor sobre sus documentos, tanto en el formateo del texto como en la apariencia de la página.HTML 3.0 Mientras tanto, Netscape, que era en esa época el líder indiscutible de los navegadores, introducía con cada nueva versión etiquetas y atributos no contemplados en el estándar oficial, con gran escándalo de algunos.Debido a su amplia difusión y aceptación, otros navegadores intentaban copiar esas innovaciones, pero debido a que Netscape no especificaba completamente sus nuevas etiquetas, los resultados no eran siempre los deseados. Todo ello provocaba una gran confusión, y numerosos problemas, cuando los autores utilizaban estos elementos y comprobaban que no funcionaba como querían en otros navegadores. Por esa época, el comité de trabajo del HTML de la IETF, propuso un borrador de un nuevo estándar, el HTML 3.0 que incluía numerosas y útiles mejoras. Pero debido a que era excesivamente extenso y ambicioso, los navegadores sólo utilizaban una pequeña parte del nuevo estándar, lo que producía aún mayor confusión y por lo que acabó finalmente siendo abandonado. Estándares de HTML
  • 3.
    HTML 3.2 Cada vezera más evidente la necesidad de un nuevo estándar que fuera aceptado por todos. Se formó otro comité, el W3C, apoyado por los principales vendedores de software (entre ellos, IBM, Microsoft, Novell, Netscape, Sun, etc.). El nuevo estándar ha sido desarrollado durante todo el año 1996 por el W3C con el sobrenombre de Wilbur, y finalmente, en Enero de 1997 ha sido aprobado como el HTML 3.2El HTML 3.2 es totalmente compatible con el estándar anterior, pero incorpora muchas de las innovaciones de los navegadores comerciales (Netscape y Explorer principalmente), tales como tablas, applets, texto que bordea las imágenes, etc., aunque no todas, como por ejemplo los frames. Se puede consultar la documentación oficial del HTML 3.2 en Introducing HTML 3.2, pero es más manejable y práctica la presentada en Wilbur - HTML 3.2, donde se pueden ver con detalle las distintas etiquetas, e incluso obtener una versión off- line del nuevo estándar. Primer borrador público del HTML 4.0 En Julio de 1997 se ha presentado el primer borrador público del próximo estándar oficial HTML 4.0 (que tiene el nombre clave de Cougar). En él se incorporan las especificaciones sobre tablas, frames, scripts, hojas de estilo, accesibilidad por distintos medios, e internacionalización (incluyendo el uso de Unicode, en lugar del Latin-1).Este estándar propuesto representa un gran avance con respecto a los anteriores. Existe un comunicado de prensa de la W3C. El borrador, que es muy extenso, se puede consultar en esta dirección. Los estándares y este manual En los capítulos anteriores a éste (HTML esencial) se han explicado, en líneas generales, las etiquetas que cumplían con la anterior norma HTML 2.0. En los capítulos que siguen se hablará de las etiquetas incorporadas al nuevo estándar, más algunas otras que no lo están, pero que son implementadas por los navegadores más importantes (Netscape y Explorer).
  • 4.
    Formato De Imágenes Lasimagénes digitales se pueden guardar en distintos formatos. Cada uno se corresponde con una extensión específica del archivo que lo contiene. Los más utilizados en la actualidad son: BMP, GIF, JPG, TIF y PNG. BMP (Bitmap = Mapa de bits) Ha sido muy utilizado porque fue desarrollado para aplicaciones Windows. La imagen se forma mediante una parrilla de píxeles. El formato BMP no sufre pérdidas de calidad y por tanto resulta adecuado para guardar imágenes que se desean manipular posteriormente. Ventaja: Guarda gran cantidad de información de la imagen. Inconveniente: El archivo tiene un tamaño muy grande. GIF (Graphics Interchange Format = Formato de Intercambio Gráfico) Ha sido diseñado específicamente para comprimir imágenes digitales. Reduce la paleta de colores a 256 colores como máximo (profundidad de color de 8 bits). Admite gamas de menor número de colores y esto permite optimizar el tamaño del archivo que contiene la imagen. Ventaja: Es un formato idóneo para publicar dibujos en la web. Inconveniente: No es recomendable para fotografías de cierta calidad ni originales ya que el color real o verdadero utiliza una paleta de más de 256 colores.
  • 5.
    JPG-JPEG (Joint PhotographicExperts Group = Grupo de Expertos Fotográficos Unidos) •A diferencia del formato GIF, admite una paleta de hasta 16 millones de colores. •Es el formato más común junto con el GIF para publicar imágenes en la web. •La compresión JPEG puede suponer cierta pérdida de calidad en la imagen. En la mayoría de los casos esta pérdida se puede asumir porque permite reducir el tamaño del archivo y su visualización es aceptable. Es recomendable utilizar una calidad del 60-90 % del original. •Cada vez que se modifica y guarda un archivo JPEG, se puede perder algo de su calidad si se define cierto factor de compresión. •Las cámaras digitales suelen almacenar directamente las imágenes en formato JPEG con máxima calidad y sin compresión. •Ventaja: Es ideal para publicar fotografías en la web siempre y cuando se configuren adecuadamente dimensiones y compresión. •Inconveniente: Si se define un factor de compresión se pierde calidad. Por este motivo no es recomendable para archivar originales. TIF-TIFF (Tagged Image File Format = Formato de Archivo de Imagen Etiquetada) •Almacena imágenes de una calidad excelente. •Utiliza cualquier profundidad de color de 1 a 32 bits. •Es el formato ideal para editar o imprimir una imagen. •Ventaja: Es ideal para archivar archivos originales. •Inconveniente: Produce archivos muy grandes. PNG (Portable Network Graphic = Gráfico portable para la red) •Es un formato de reciente difusión alternativo al GIF. •Tiene una tasa de compresión superior al formato GIF (+10%) •Admite la posibilidad de emplear un número de colores superior a los 256 que impone el GIF. •Debido a su reciente aparición sólo es soportado en navegadores modernos como IE 4 o superior.
  • 6.
    Atributos En HTML unelemento puede tener atributos y eventos. Mientras que los atributos definen valores o propiedades para ser utilizadas por los navegadores en el procesamiento del documento, los eventos pueden ser empleados para especificar comportamientos o acciones a ser desempeñadas cuando ciertas condiciones se cumplen, como por ejemplo, cuando el usuario hace un click sobre el elemento. Atributos y eventos comparten una misma sintaxis: se deben insertar dentro de la etiqueta de apertura como una lista de items separados por espacios, luego del nombre del elemento y precedida por un espacio. Cada uno de estos ítems se compone de un nombre (para el atributo o evento), el signo igual ("=") y el valor o función (a veces opcionalmente) encerrado entre comillas. El siguiente ejemplo muestra un elemento b con un atributo (style) y un evento (onclick). <b style="color: red" onclick="changeColor(this.parentNode)">Texto importante</b> Texto importante
  • 7.
    El contenido deun elemento es, hablando en términos generales, todo aquello que se encuentra entre sus etiquetas de apertura y cierre. Dependiendo del elemento, esto puede ir desde absolutamente nada a un trozo de documento HTML. Este contenido es lo que será afectado por la funcionalidad o significado del elemento. Por ejemplo, el elemento em brinda énfasis a su contenido, y los navegadores habitualmente muestran su texto con un estilo de fuente particular para hacerlo sobresalir del texto normal. Algunos elementos, conocidos como elementos vacíos, no tienen permitido poseer contenido y su declaración consiste únicamente en la etiqueta de apertura con cualquier cantidad de atributos y eventos. En el siguiente ejemplo hay tres elementos, cada uno con un tipo distinto de contenido: el párrafo (elemento p), conteniendo a otros elementos; una palabra con énfasis (elemento em), conteniendo sólo texto; y un botón (elemento input (type=button)), el cual es un elemento vacío. <p>Es este un día <em>lluvioso</em>? <input type="button" value="Sí"></p>
  • 8.
    Frames En HTML Amados u odiados, útiles o inútiles, excelentes o pésimos, los marcos son instrumentos que forman ya parte habitual del web y que los navegadores gestionan hoy día a la perfección. Los detractores de los marcos afirman la inutilidad de subdividir ulteriormente las páginas web, las cuales, en última instancia, pueden resultar poco legibles.  . Otros, como yo, consideran que los marcos pueden llegar a ser muy útiles ya que se evita cargar las mismas imágenes y se mantienen ordenados el contenido y la estructura del sitio. Naturalmente, abusar de los marcos puede producir como resultado pésimas impostaciones gráficas, obteniendo un efecto contrario al previsto. Un punto en contra de los marcos es, ciertamente, su incompatibilidad con los programas de navegación gráfica destinados a invidentes, los cuales se bloquean impidiendo la lectura de las páginas.
  • 9.
    N2.0 Documento Marco<FRAMESET></FRAMESET> (en lugar de <BODY>) N2.0 altura en filas <FRAMESET ROWS=,,,></FRAMESET> (píxel ó %) N2.0 altura en filas <FRAMESET ROWS=*></FRAMESET> (* = tamaño relativo) N2.0 anchura en columnas <FRAMESET COLS=,,,></FRAMESET> (píxel ó %) N2.0 anchura en columnas <FRAMESET COLS=*></FRAMESET> (* = tamaño relativo) N3.0b anchura del borde <FRAMESET BORDER=?> N3.0b borde <FRAMESET FRAMEBORDER="yes|no"> N3.0b color del borde <FRAMESET BORDERCOLOR="#$$$$$$"> N2.0 Definición del marco <FRAME> (contenido de cada uno de los recuadros) N2.0 documento que se debe mostrar <FRAME SRC="URL"> N2.0 denominazione del frame <FRAME NAME="***"|_blank|_self| _parent|_top> N2.0 anchura de los márgenes <FRAME MARGINWIDTH=?> (margen izquierdo y derecho) N2.0 altura de los márgenes <FRAME MARGINHEIGHT=?> (margen superior e inferior) N2.0 barra de desplazamiento o no <FRAME SCROLLING="YES|NO|AUTO"> N2.0 no redimensionable <FRAME NORESIZE> N3.0b borde <FRAME FRAMEBORDER="yes|no"> N3.0b color del borde <FRAME BORDERCOLOR="#$$$$$$"> N2.0 contenido en ausencia de marco <NOFRAMES></NOFRAMES> (para navegadores antiguos)