Diseñar iconos de barra de herramientas para Internet Explorer

Para crear un icono de barra de herramientas, tendrá que proporcionar cada imagen en dos tamaños distintos para los dos estados de la barra de herramientas (en escala de grises para el estado predeterminado y en color para el estado activo, cuando el mouse (ratón) del usuario lo apunta) y en dos profundidades de color.

Crear sus imágenes

1. Después de dibujar las imágenes con un programa de gráficos, coloque las imágenes de 16 y 256 colores en dos archivos independientes.
2. Cada archivo debe tener como índice la paleta correspondiente, ya sea la paleta de 16 colores de Windows o la de medio tono. Reserve un color específico para denotar transparencia.
3. Guarde cada archivo como un archivo .BMP.

A continuación se incluye un resumen de las imágenes necesarias:

Icono de estado	Tamaño en píxeles	Profundidad y paleta de colores	Borde	Apariencia	Ejemplo
Activo	20 por 20	Paleta de medio tono de 256 colores de Windows	Borde de estilo de icono: color en los bordes superior e izquierdo y color negro en los bordes inferior y derecho	Color de imagen Más sombreado y profundidad visual que la imagen de 16 colores Una fuente de luz desde la parte superior izquierda y sombreado donde proceda
	20 por 20	Paleta de 16 colores de Windows	Negro, excepto cuando un borde interfiera con la legibilidad del icono	Color de imagen Poco sombreado, apariencia plana
	16 por 16	Paleta de 16 colores de Windows	Negro, excepto cuando un borde interfiera con la legibilidad del icono	Color de imagen Poco sombreado, apariencia plana
Predeterminado	20 por 20	Paleta de medio tono de 256 colores de Windows	Borde de estilo de icono: tonos grises en los bordes superior e izquierdo y color negro en los bordes inferior y derecho	Imagen en escala de grises Más sombreado y profundidad visual que la imagen de 16 colores Una fuente de luz desde la parte superior izquierda y sombreado donde proceda
	20 por 20	Paleta de 16 colores de Windows	Negro, excepto cuando un borde interfiera con la legibilidad del icono	Imagen en escala de grises Poco sombreado, apariencia plana
	16 por 16	Paleta de 16 colores de Windows	Negro, excepto cuando un borde interfiera con la legibilidad del icono	Imagen en escala de grises Poco sombreado, apariencia plana

Asegúrese de que las transiciones visuales entre las imágenes predeterminada y activa del icono son suaves. Un sistema fácil para comprobarlo consiste en crear capas separadas para las imágenes predeterminada y activa en un programa de tratamiento de imágenes fotográficas, de forma que pueda ver ambas imágenes superpuestas.

Convertir las imágenes de mapas de bits en iconos

Tendrá que crear dos archivos .ICO para cada icono:

• El primer archivo .ICO contiene las imágenes activas (en color) para ambos tamaños y profundidades de color.
• El segundo archivo .ICO contiene las imágenes predeterminadas (en escala de grises) para ambos tamaños y profundidades de color.

Se recomienda utilizar un programa de gráficos para dibujar los iconos y un entorno de desarrollo, como puede ser Microsoft Visual C++ Development Studio, para crear los archivos .ICO.

Ejemplo

Los dos archivos del icono Inicio contienen las siguientes imágenes:

Estado activo	Estado predeterminado

Para crear los archivos de icono en Visual C++

1. Abra los archivos .BMP.
2. En el menú Archivo, haga clic en Nuevo y, después, haga clic en Icono. De forma predeterminada, la ventana de icono que se abre muestra una imagen de dispositivo estándar de 32 por 32 píxeles.
3. En la ventana de icono, haga clic en Nueva imagen de dispositivo. Haga clic en Personalizado y, después, cree estas imágenes:
   • Una imagen de 22 por 20 píxeles en 16 colores
   • Una imagen de 22 por 20 píxeles en 256 colores
   • Una imagen de 18 por 16 píxeles en 16 colores

   Nota

   • Las imágenes de dispositivo son dos píxeles más anchas que las imágenes. Centre sus imágenes en el área de la imagen de dispositivo.
4. Elimine la imagen de dispositivo de 32 por 32 píxeles.
5. Copie y pegue las imágenes en color desde los archivos .BMP a la imagen de dispositivo del tamaño y profundidad de color apropiados.
6. Para hacer el fondo transparente, seleccione el color transparente en la paleta de colores y rellene el fondo de cada imagen en la que desee obtener transparencia.
7. Guarde el archivo como un archivo .ICO.

Para crear el archivo .ICO predeterminado (en escala de grises), siga los mismos pasos.