Cómo generar un gráfico de encabezado para la web

Ubicado en un lugar destacado en la parte superior de una página web rodeada de imágenes, texto, menús y botones, un gráfico de encabezado da la bienvenida a los visitantes del sitio y les da una idea rápida del tema y el propósito del sitio web. Es posible que haya considerado agregar un gráfico de encabezado a su sitio web empresarial, pero sintió que carecía de habilidades de diseño gráfico. Una vez que descubra cómo ensamblar capas utilizando un programa de edición de imágenes, puede crear rápidamente gráficos de encabezado de aspecto profesional.

Gráficos de encabezado

Los gráficos de encabezado a menudo contienen texto y una o más imágenes pequeñas que se encuentran sobre un fondo. Ese fondo puede consistir en un color, un degradado o una imagen. Mientras navega por la Web, es posible que vea fondos gráficos de encabezado que vienen en diferentes formas. tales como rectángulos y óvalos. Para crear un gráfico de cualquier tipo, deberá iniciar un editor de imágenes o visitar un sitio gratuito de edición de imágenes en línea.

Añadiendo un fondo

Muchos editores de imágenes modernos le permiten usar capas. Una capa es una hoja imaginaria y transparente que le permite dibujar cosas en ella. Debido a que las capas son transparentes, puede apilarlas para crear una sola imagen. Si su editor de imágenes admite capas, aprenda cómo funcionan leyendo la documentación de ayuda y cree una llamada "Fondo". A continuación, puede dibujar la forma que desea utilizar en esa capa. Si el editor tiene formas integradas, puede hacer clic en una de ellas y luego usarla para dibujar esa forma automáticamente.

Pellizcando el fondo

Si cree que un encabezado con un fondo de color se combinará bien con otros elementos en su página web, puede cambiar el color de fondo de la forma seleccionando la herramienta de relleno del cubo del editor. Algunos programas pueden simplemente llamarlo "Rellenar". Antes de usar esa herramienta para llenar su forma de color, puede encontrar el panel de colores del programa y seleccionar el color deseado. También tiene la opción de no usar una forma como fondo. Simplemente puede pegar una imagen pequeña en la capa de fondo. Esa imagen se convierte en el fondo sobre el que puede colocar texto y otros objetos. Elige una imagen con cuidado si quieres usar una. Si planea agregar texto a su gráfico de encabezado, una imagen de fondo que esté demasiado "ocupada" puede dificultar la lectura del texto.

Insertando Texto

Los encabezados de texto son comunes en la Web e impresos. Los buenos proporcionan un resumen de lo que trata la página o sección. Si desea agregar texto a su gráfico de encabezado, haga una lluvia de ideas y cree una frase corta y pegadiza que describa toda la página o el sitio web. Si su editor de imágenes admite capas, puede crear una nueva capa y agregarle texto, y luego modificar el color, la fuente, la alineación, la opacidad, el estilo de borde y otras propiedades. Elige un color que combine bien con el fondo. Debido a que el texto se encuentra en su propia capa en la parte superior de la capa de fondo, puede experimentar con diferentes diseños de texto sin afectar la capa de fondo.

Añadiendo objetos adicionales

Gráficos de encabezado llamativos que contienen texto sin formato y un fondo aparecen en toda la Web. No tiene que agregarles nada para hacer que esos encabezados sean atractivos. También tiene la opción de crear capas adicionales y agregar más formas e imágenes a esas capas. Incluso puede utilizar la herramienta Pincel para dibujar sus propios diseños en una capa. Probablemente deba hacerlos pequeños porque su gráfico de encabezado tiene un espacio limitado para contener objetos. Las capas también le permiten mover diferentes objetos a nuevas ubicaciones en el encabezado y moverlos detrás de otros. Haga esto abriendo el panel de capas del programa y examinando sus capas. Por lo general, aparecerán como cuadros apilados verticalmente en una columna. Arrástrelos hacia arriba y hacia abajo para cambiar el orden en que aparecen sus contenidos en su gráfico.

Elegir un formato de archivo

Cuando haya completado su obra maestra gráfica, puede guardarla en uno de varios formatos. Los archivos PNG tienen la mejor calidad, pero los navegadores tardan más en cargarlos porque los PNG son más grandes que los archivos JPEG y GIF. Elija un formato PNG si tiene una imagen de encabezado más pequeña o si no le importa qué tan rápido se carga su página. Si tiene un encabezado muy simple que contiene solo unos pocos colores o no consta de nada más que texto y un fondo plano, puede guardarlo como un GIF en su lugar. Los archivos JPEG, que están comprimidos, son más pequeños que los PNG y producen imágenes de buena calidad. Muchos sitios que ves en la Web usan imágenes JPEG. Elija un formato JPEG si su encabezado contiene contenido fotográfico u otro tipo de vida real y no desea utilizar un formato PNG más grande. Una buena manera de seleccionar un formato si no está seguro es guardar una copia de su imagen en cada formato y comparar las imágenes. Puede verificar el tamaño de sus archivos encontrando los archivos de imagen en el Explorador de Windows, haciendo clic derecho en ellos y seleccionando "Propiedades".

Cambiar el gráfico de tu encabezado

Si su programa de edición le permite guardar archivos en su formato nativo, guarde al menos una copia de su imagen en ese formato. Esto le permite volver más tarde y actualizar su imagen fácilmente. Photoshop, por ejemplo, tiene un formato nativo llamado PSD que recuerda sus cambios de edición y le permite continuar trabajando donde lo dejó más tarde. Después de editar uno de estos archivos de formato nativo, guarde una copia como JPEG, PNG o GIF para poder cargar uno de esos tres formatos en su servidor web. Los navegadores no pueden mostrar PSD y otros tipos de imágenes de "formato nativo".