HTML dinámico en la práctica
El HTML dinámico es la penúltima evolución del lenguaje de marcación de la World Wide Web . En él confluyen tecnologías que permiten controlar de manera muy precisa tanto el posicionamiento como la maquetación del contenido y el formato de los textos, una mayor interactividad gracias a la utilización de lenguajes de guiones y al modelo de objetos, y a unas ciertas capacidades multimedia . ¿ Pero, hasta dónde es capaz de llegar ?
Toda tecnología que rodea a Internet es muy cambiante, evoluciona con mucha rapidez, y la mayor parte de las veces no permite un conocimiento profundo de las capacidades de las mismas . HTML Dinámico ( DHTML ) , no sólo incorpora más etiquetas al HTML, sino que integra brillantemente tecnologías como las Hojas de estilo en cascada ( CSS, Cascading Style Sheets ) , el posicionamiento, los lenguajes de guiones ( JavaScript y/o Visual Basic Script ) , los modelos de objetos, el enlazado y consciencia de datos y los controles ActiveX .
¿ Qué aporta HTML Dinámico ?
A lo largo del presente artículo verá desarrolladas alguna de las siguientes características, que permiten que la Web sea cada vez más entretenida y amena:
- Hojas de estilo en cascada ( CSS ) , son el pilar básico de HTML Dinámico, y constituyen la forma de maquetar y de crear estilos para páginas web e incluso para centros web .
- Modelos de objetos: ahora todo elemento que se incluya en una página web es un objeto y, como tal, es manipulable .
- Lenguajes de guiones: el HTML nunca ha sido un lenguaje de programación, quien ahora brinda esa capacidad y la posibilidad de manipular los objetos es JavaScript y/o Visual Basic Script .
- Alteración del documento: las nuevas capacidades brindan la posibilidad de alterar el documento cuando está cargando en el navegador ( descarga ) , o bien cuando el documento ya está cargado en el navegador ( ejecución ) .
- Efectos: así mismo se proporcionan nuevas técnicas que permiten realizar efectos sobre el texto, realizar animaciones, utilizar filtros de iluminación, etc .
Hojas de estilo en cascada
El diseño gráfico y la tipografía han sido algunos de los puntos más criticables en el desarrollo de un centro web actual y moderno . Ya queda lejos el tiempo en que la Web se utilizaba como herramienta de comunicación de investigadores y educadores y de algún que otro avezado .
Hoy los aspectos lúdicos, comerciales y de márketing y publicidad se han adueñado de ella, por lo que el aspecto de la misma es muy importante . Se acabó el carecer del control deseado . Ahora puede determinar el aspecto específico de un párrafo o una página, o si lo prefiere de todo un centro web .
Para los no habituados, un estilo se asemeja en gran medida a las conocidas “macros” de los procesadores de textos como Word o WordPerfect . Es decir, una forma más o menos sencilla de definir el aspecto de un documento, tipos de letra, sangrías, colores, márgenes, etc . Pues eso es precisamente lo que un estilo proporciona a un documento web, pero con la potencia de poder aplicarlo a todo un centro .
Qué se define en un estilo
En un estilo puede incluir todo lo que se le ocurra .
- Tipos de letra, con su familia, estilo, peso, tamaño y color .
- El fondo, la imagen del fondo, el color .
- El texto, existen atributos para el espaciado de letras y palabras, estilos de texto, alineación, márgenes, etc .
- Bordes, su color, estilo y anchura .
- Listas, tipos de lista, posiciones, imágenes, etc .
Antes de definir un estilo, hay que tener en cuenta en dónde se va a aplicar dicho estilo, a un párrafo, a toda una página, etc . , pero la verdadera potencia de las hojas de estilo en cascada radica en que un estilo se puede aplicar a una etiqueta como < h1 > dentro de una misma página o de un centro, por eso es muy importante que piense qué etiquetas va a utilizar para los enca-
bezamientos y los subencabezamientos, para los párrafos, para textos especia-
les, etc . Recuerde, todas las etiquetas de HTML se pueden definir con un estilo, incluso las imágenes .
Las hojas de estilo en cascada utilizan diferentes métodos de definición de los estilos . Pero, dada su potencia, los estilos se ubican en posiciones diferentes dentro del documento e incluso fuera de él . Según este criterio, los estilos son:
- Estilos en línea .
- Bloques de estilo .
- Estilos importados o enlazados .
- Estilos de clase .
- Estilos falsos .
Los más sencillos de utilizar son los estilos en línea . Estos se localizan dentro del cuerpo del documento HTML y modificando una etiqueta a la que se desea cambiar el aspecto . Para poder modificar un estilo en línea se suele utilizar el atributo style . Por ejemplo, para realizar un encabezado h1 de color azul . Un paso más avanzado son los bloques de estilo, y sirven para definir el aspecto de una o varias etiquetas .
¿ Quiere definir un estilo para todos los encabezamientos # de su página ? Defina dentro de la sección de su documento un estilo para la etiqueta # con style . Cuando el navegador lea este estilo, lo aplicará automáticamente a todos los textos que estén contenidos dentro de cada una de esas etiquetas . Este método ya es más potente y define todas las etiquetas o textos por defecto que irán dentro del documento, pero esto es muy pesado si quiere aplicarlo a todos los documentos . ¿ Tiene que escribir el estilo para cada página ? La respuesta es no . La solución radica en crear un archivo de texto independiente a la página HTML donde quedan descritos los estilos, y guardarlo con la extensión . CSS . A continuación, debe
