Creador de botones

 

Esta herramienta permite crear varios tipos de botones: 2D, 3D, invisibles y de diseño. Los botones de diseño permiten infinitas variaciones de estilo y tamaño, con o sin efectos de sombra y transparencia, pictogramas y franjas de colores. Los colores de los botones se ajustan automáticamente a la paleta de colores del proyecto.

 

Para empezar, seleccione el tipo de botón que desee crear. Las propiedades específicas de cada tipo de botón se mostrarán debajo del mismo. Las opciones de texto son las mismas para todos los tipos de botón, excepto para los botones invisibles.

 

Use la vista previa para comprobar el aspecto del botón que está creando en las tres posiciones posibles: Elevado”, “Presionado” y “Puntero del mouse”.

 

Texto:

Escriba en el campo el texto que desea que aparezca en el botón.

Haga clic en el icono de texto para modificar las opciones del texto (tamaño, color, fuente, etc.).

Haga clic en el icono de edición para acceder a las funciones de edición de texto avanzadas y modificar el aspecto del texto en función de las posiciones “Elevado”, “Presionado” y “Puntero del mouse”. Deseleccione la casilla de verificación para desbloquear las opciones “Presionado” y “Puntero del mouse”.

 

Es posible usar una fuente, un tamaño o un color distintos o aplicar un desplazamiento o un efecto de estampado o grabado al texto para crear un efecto de retroacción en los botones. Procure no abusar de todas estas funciones a la hora de crear un botón, ya que podría acabar generando confusión en lugar de lograr el efecto deseado.

 

Advertencia:

Los botones se convierten en imágenes cuando se transfieren a la Web. La aplicación de algoritmos de compresión en las imágenes que contienen texto puede producir una degradación visual de los caracteres tipográficos. Compruebe los resultados en un explorador antes de cargar el sitio en Internet. La ventaja es que se puede usar cualquier fuente, ya que el texto de los botones se convertirá en imágenes.

 

2D:

Para crear un botón 2D, simplemente elija un color y un nivel de transferencia, y el grosor y el color del borde. Si no desea bordes, introduzca un valor “0” para el grosor.

 

Ergonomía: elija distintas configuraciones para las posiciones “Elevado”, “Presionado” y “Puntero del mouse” para crear un efecto de retroacción.

 

Diseño

 

Seleccione las propiedades en los menús desplegables para crear varios botones con gráficos avanzados en tan sólo unos clics.

 

Tipo: Estándar

 

Los botones estándar tienen formas geométricas con efectos de sombra y 3D. Elija una forma y un tamaño y agregue un efecto de textura para crear un botón.

 

La altura del botón corresponde a su aspecto: plano o elevado. Elija un solo color, o dos colores, para agregar una franja al botón. Cambie esta configuración para las distintas posiciones (“Elevado”, “Presionado” y “Puntero del mouse”) para hacer el botón más dinámico.

 

Tipo: Pictograma

 

Este tipo de botón usa una imagen que representa una acción (Aceptar, Cancelar, etc.) o un destino (Inicio, Atrás, etc.) comúnmente conocidos. Estos botones son muy útiles porque se basan en convenciones visuales y facilitan la navegación en el sitio Web.

 

El pictrograma se corresponde con el icono que seleccione en la lista desplegable de la sección inferior. A continuación, elija la forma, la textura y la altura del pictograma en la sección superior.

 

Puede aplicar un efecto de estampado o sombra al pictograma para una mayor profundidad.

 

Elija dos colores: uno para el fondo del botón y el otro para el pictograma. Cambie esta configuración para las distintas posiciones (“Elevado”, “Presionado” y “Puntero del mouse”) para hacer el botón más dinámico deseleccionado la casilla de verificación “Utilizar icono elevado”.

Nota:

Debido a su pequeño tamaño, es difícil usar texto en los pictogramas. El mejor modo de identificar un botón de pictograma es agregarle información sobre herramientas en la ficha Acciones. Puede dar un nombre al destino del botón (p.ej. “Página de inicio”) o una breve instrucción (p.ej., “Contacte con nosotros” en un botón de correo electrónico).

 

Tipo: 3D

 

Botón de alternancia:

Con está opción, el botón actuará como un interruptor, con una posición baja y otra elevada. Tras hacer clic en el botón, éste permanecerá en la posición baja hasta que se vuelva a hacer clic.

Si la alternancia no está activada, el botón recuperará su forma inicial después de hacer clic. Piense en una grabadora. Al presionar el botón, éste permanecerá en la posición baja. Si lo presiona de nuevo, volverá a su posición original.

 

Tipo: Botón de imagen

 

Este botón usa tres imágenes para representar las posiciones “Elevado”, “Presionado” y “Puntero del mouse”.

 

  1. Elevado: imagen inicial del botón.

  2. Presionado: imagen al presionar el botón.

  3. Puntero del mouse: imagen al pasar el puntero del mouse por el botón.

 

Sólo la posición elevada es obligatoria. Las imágenes de las posiciones “Presionado” y “Puntero del mouse” son opcionales, pero hacen que la página sea más dinámica.

 

Tipo: Botones invisibles

 

Estos botones resultan muy útiles para definir áreas importantes en imágenes o ilustraciones técnicas. Combine estos botones con información sobre herramientas para explorar una imagen vinculada.

 

Puede cambiar el tamaño de un botón invisible para que coincida con el tamaño de la imagen de una página.