HTMLpointHTMLpoint HTMLpoint.com


 Efectos sobre formularios



Todo cuanto expuesto en el presente capítulo no tiene directa relación con las hojas de estilo, en el sentido de que no se cuenta entre las recomendaciones oficiales del W3C al respecto. Sin embargo, trataremos igualmente, si bien de manera sintética, estas cuestiones ya que es útil conocer algunos pequeños trucos para la realización de formularios HTML.
El nuevo estándar de HTML 4 ha introducido importantes modificaciones en la precedente versión 3.2 del lenguaje de marcado más difundidido del mundo.
HTML 4.0 mejora la gestión de los módulos convirtiéndolos en interactivos gracias a eventos intrínsecos y agregando soportes para los navegadores de síntesis vocal. Se introducen tres elementos nuevos:

LABEL proporciona a los navegadores de síntesis vocal la posibilidad de describir un elemento y convertir en interactivos los formularios. Las etiquetas utilizadas pueden ser implícitas o explícitas.

BOTTON permite crear otros botones además de los dos estándar (enter y reset) hasta ahora disponibles.

FIEDLSET agrupa campos relativos al modo de proporcionar a los navegadores de síntesis vocal la posibilidad de describir diversos grupos y permitir al usuario moverse de un grupo a otro. Junto con el elemento LEGEND, se puede usar para nominar el grupo. Estos dos elementos nuevos permiten una mejor interpretación e interacción.

Una nueva serie de atributos onchange-INPUT, junto con el soporte para los lenguajes script, permite a los formularios de los proveedores verificar los datos introducidos por el cliente. El elemento INPUT tiene un nuevo atributo ACCEPT, que permite a los autores especificar una lista de medios o tipos de estructura para el input.

El atributo ACCESSKEY se encarga de especificar un acceso directo mediante el teclado a los campos del formulario.

Sigamos viendo cómo actúan algunas de las nuevas potencialidades relativas a los formularios HTML. Como dijimos, no se trata de hojas de estilo puras sino de ejemplos que explotan conjuntamente Javascript y algunos aspectos de HTML dinámico. En todo caso, las tratamos en este artículo a fin de proporcionar instrumentos de web publishing avanzados.



Hoy es posible crear campos SELECT dentro de los formularios HTML que aparecen con varias posibilidades de elección ya predefinidas. Lo que sigue es buen ejemplo:
Muestra el código de este ejemplo



HTML 4.0 soporta el atributo TITLE, que permite visualizar una pequeña ventana cuando el cursor del ratón hace clic o se coloca encima de un elemento. En los navegadores obsoletos, el atributo TITLE no crea problemas de visualización ya que se ignora y visualiza como sencillo texto.
Gracias a las potencialidades de este atributo es posible obtener efectos similares al precedente:

Para una prueba, haz clic aquí

Muestra el código de este ejemplo



Este ejemplo puede ser útil para crear efectos gráficos en formularios que si no serían grises y aburridos. Cómo funciona se explica rápidamente: mientras no se escribe nada en los campos del form, éstos asumen un color por defecto que perderán sólo cuando se introduzca texto o se marque una selección. De esta manera, el visitante tendrá a la vista qué campos ha rellenado y qué campos están por rellenar.
Prueba: escribe algo en el espacio amarillo.
Muestra el código de este ejemplo



Es posible crear elementos OPTION de distinto color con simple código HTML. Conviene precisar, sin embargo, que los elementos OPTION representan, para el modelo de objetos del HTML dinámico, una excepción ya que no son expuestos en el conjunto "all" del documento. Esto significa que el elemento OPTION se expone sólo mediante el correspondiente elemento select de nivel superior.
Dejando al margen este tema que tiene mayor relación con el HTML dinámico, en la práctica con el elemento OPTION es posible crear voces de selección de distintos colores como en el ejemlo que sigue:
Muestra el código de este ejemplo



El elemento LABEL describe e incorpora los eventos intrínsecos del form cuando la página es visualizada por un navegador de síntesis vocal. Las etiquetas pueden ser implícitas o explícitas y son útiles con casillas de control y botones de opción. Una etiqueta asociada a un pulsante permite seleccionar o cancelar una selección del mismo modo.

Siguiendo este principio, se puede crear un formulario dentro del cual un elemento TEXT, si es seleccionado, cancela la selección de los elementos RADIO presentes en el formulario mismo. En el ejemplo que figura a continuación es necesario elegir entre uno de los elementos para marcar o el espacio en blanco. No es posible, al menos en este caso, efectuar una doble elección.



Muestra el código de este ejemplo



HTML 4 ha introducido los denominados "controles desactivados", que no pueden ser activados o cuyo contenido no se puede modificar. Se usan dos atributos: DISABLED (impide que el elemento reciba eventos) y READONLY (viene visualizado cuando el control está conforme con el contexto pero los contenidos no son modificables).

Prueba: escribe algo en el espacio que sigue.

Muestra el código de este ejemplo


  Vuelve a principio de página