Mostrar todo

Ocultar todo

No es preciso ser un experto en imágenes o codificación para agregar botones funcionales a las páginas Web. Con FrontPage 2003, puede usar botones interactivos.

Estos botones son vistosos y cuentan con una apariencia profesional, como los que se crean con una avanzada herramienta de edición gráfica. A diferencia de los botones estándar, su apariencia cambia al situar el puntero del mouse sobre ellos o al hacer clic en ellos.

Agregar un botón interactiva a una página Web

Para agregar un botón interactivo, haga clic en el lugar de la página Web donde desee ubicar el botón. En el menú Insertar, haga clic en Botón interactivo. Cuando aparezca el cuadro de diálogo Botón interactivo, seleccione un estilo de botón y elija la apariencia así como el comportamiento del botón.

¿Cómo se obtiene la apariencia deseada para el botón interactivo?

Al agregar un botón interactivo, puede elegir la forma, el color, el acabado, el borde así como el estilo y el tamaño de fuente. Las formas incluyen círculos, rectángulos, cápsulas y tabuladores. También pueden ser brillantes o mates, además de tener bordes biselados.

Mediante la ficha Botón del cuadro de diálogo Botones interactivos, puede seleccionar un estilo de botón, agregar texto al botón y agregar un vínculo del botón a otra página del actual sitio Web, un sitio en el World Wide Web o una dirección de correo electrónico.

Mediante la ficha Fuente, además de elegir el estilo y el tamaño de fuente, puede configurar la alineación del texto del botón y seleccionar los colores de fuente para cada estado del botón: sin presionar, activable (al mover el puntero sobre un botón) y presionado.

Mediante la ficha Imagen, puede cambiar el tamaño de la imagen del botón. Es importante resaltarlo ya que estos botones no se pueden cambiar de tamaño en la vista Diseño, a diferencia de otros tipos de imágenes. Además, allí es donde elige un formato de archivo para la imagen del botón.

Elegir un formato de archivo para la imagen del botón

Para determinar si desea guardar las imágenes de botón como un archivo JPEG o GIF, observe lo siguiente:

JPEG

• El formato de archivo JPEG tiene como ventaja que permite a FrontPage proporcionar variaciones graduales de color y efecto para obtener estilos de botón más complejos, como botones biselados, en relieve y brillantes.
• Una desventaja consiste en que los JPEG tienen un fondo sólido. Si el fondo de página es sólido, puede configurar el color de fondo del botón de modo que coincida con el fondo de página. Sin embargo, si la página no tiene un fondo sólido, el botón con formato JPEG no se mostrará correctamente.

  GIF  

• El formato de archivo GIF tiene como ventaja que puede proporcionar un fondo transparente. De este modo, si el botón tiene bordes redondeados, el fondo de la página será transparente.
• Una desventaja consiste en que un formato GIF muestra sólo 256 colores, que a veces no son suficientes para mostrar las variaciones graduales de color y efecto en estilos de botón más complejos. Los bordes de botón y algunos de los degradados de color en el botón pueden tener una apariencia desigual, en comparación con el formato de archivo JPEG file.

Estados de la imagen de un botón interactivo

Al insertar un botón interactivo, FrontPage crea automáticamente tres imágenes independientes que representan las tres formas en que los visitantes del sitio Web interactúan con estos botones: el estado sin presionar, el estado activable y el estado presionado. Al guardar las páginas Web, FrontPage le pide que también guarde estos archivos de las imágenes de botón.

Al guardar por primera vez, FrontPage proporciona automáticamente tres nombres predeterminados para los archivos de las imágenes de botón. Los nombres de archivo comienzan con la palabra "botón" y terminan con un valor único, como un número o una letra.

Se recomienda cambiar de manera apropiada los nombres predeterminados de los archivos de imagen para que más adelante pueda diferenciarlos en una lista de nombres de archivos de imagen.

Nota  Al eliminar un botón interactivo de una página Web, no se eliminan los tres archivos de imagen asociados al botón. Para eliminar estos archivos de imagen de manera permanente, deberá eliminarlos manualmente.

Caso práctico: la bodega Coho

Eric, el copropietario de la bodega Coho, pide a John, el director de IT, que su equipo de programadores y diseñadores Web cree una página especial dedicada a los vinos otoñales que incluya vínculos con imágenes de botón a la página de venta de vinos. El equipo de John tiene demasiado trabajo cambiando la apariencia del sitio Web de modo que John decide hacerlo por sí mismo.

John sabe que FrontPage 2003 incluye botones prediseñados que puede usar y cuyas propiedades puede configurar, por lo que la tarea resulta mucho más sencilla.

Para agregar el botón interactivo, John hace clic en una ubicación de la página Web especial dedicada a los vinos otoñales. En el menú Insertar, hace clic en Botón interactivo. Cuando aparece el cuadro de diálogo Botones interactivos, selecciona el estilo de botón Cápsula en relieve 1, escribe el texto del botón "Pinot" y especifica un vínculo en la página correspondiente a la venta de vinos que incluya los vinos Pinot y sus precios.

A continuación, John hace clic en la ficha Fuente y configura las propiedades de fuente. En la ficha Imagen, John no cambia la configuración de tamaño ni de estado y se asegura de que la imagen de botón se guarde como un archivo JPEG. El fondo de esta página es blanco, por lo que este botón queda muy bien. Al hacer clic en Aceptar, John ve el botón con el texto correcto.

En el menú Archivo, John hace clic en Guardar. Aparece el cuadro de diálogo Guardar archivos incrustados. John cambia el nombre predeterminado de los tres archivos de imagen a ActivablePinot.jpg, InactivoPinot.jpg y PresionadoPinot.jpg.

Mediante el mismo proceso, John crea botones interactivos para todos las páginas especiales de vinos de la bodega Coho.

Eric está encantado con los resultados y John está satisfecho de que la tarea no requiriera mucho tiempo.

Al igual que John, puede crear botones de apariencia profesional en las páginas Web agregando botones interactivos.

Trabajar con botones interactivos

Los procedimientos que se describen a continuación permiten agregar, eliminar y establecer las propiedades de un botón interactivo.

Agregar un botón interactivo

1. En la vista Página, en la parte inferior de la ventana del documento, haga clic en Diseño.
2. Sitúe el punto de inserción en el lugar donde desee agregar el botón.
3. En el menú Insertar, haga clic en Botón interactivo.
4. En la ficha Botón, en la lista Botones, haga clic en un estilo de botón.
5. En el cuadro Texto, escriba el texto que deba aparecer en el botón.
6. Junto al cuadro Vínculo, haga clic en Examinar.
7. Busque y haga clic en el archivo, la dirección URL
    (localizador de recursos uniforme (URL): dirección que especifica un protocolo (como HTTP o FTP) y la ubicación de un objeto, documento, página World Wide Web u otro destino en Internet o una intranet. Por ejemplo: http://www.ejemplo.com/.)
   o la dirección de correo electrónico a la que deba vincularse el botón y, a continuación, haga clic en Aceptar.

Nota  Al guardar la página Web, Microsoft FrontPage le pedirá que guarde las imágenes asociadas al botón.

Configurar las propiedades de un botón interactivo

1. Haga clic con el botón secundario del mouse (ratón) en el botón interactivo cuyas propiedades desee establecer y, a continuación, haga clic en Propiedades del botón en el menú contextual.
2. Siga uno o varios de estos procedimientos:

Eliminar un botón interactivo

1. En la vista Página, en la parte inferior de la ventana del documento, haga clic en Diseño.
2. Haga clic en el botón y, a continuación, presione SUPRIMIR.

Nota  Al eliminar un botón, los archivos asociados a dicho botón no se eliminan. Es preciso eliminar los archivos de botón de la Lista de carpetas.

Botones activables

En las versiones anteriores de FrontPage, quizás haya usado botones activables para agregar vínculos de botón a las páginas Web. Si bien la funcionalidad de botón activable se mantiene en FrontPage 2003, los botones interactivos reemplazan los botones activables.

Obtenga más información sobre los botones interactivos

Para obtener una formación práctica referente al uso de los botones interactivos y obtener más información sobre el código usado para crear estos botones, vea Animar las páginas Web con botones interactivos. Parte de este contenido procede de dicho curso de formación en el sitio Web de Microsoft Office Online.