7 formas de crear diseños de sitios web de bandas que te encantarán

Ya sea que esté comenzando con un nuevo diseño de sitio web de banda o actualizando su sitio para un nuevo proyecto en proceso, la plataforma de Bandzoogle proporciona excelentes herramientas para expandir las posibilidades del diseño de su sitio web.

No importa qué plantilla de sitio web de banda elija, hay muchas maneras de personalizar el diseño para crear una apariencia que realmente funcione para sus necesidades y estética específicas.

Al crear un sitio web para su banda u otro proyecto musical, es importante presentar la información de la manera más clara posible, al mismo tiempo que es fiel a su marca y valores como artista.

La función "Imagen y texto" es una de mis funciones favoritas para usar al crear diseños únicos para las páginas del sitio web. Es una función súper versátil y garantiza un formateo limpio en todos los dispositivos.

Le mostraré cómo usar esta función, en combinación con las personalizaciones de sección, para crear diseños de sitios web de 7 bandas para varios propósitos en su sitio web.

En primer lugar, explicaré todos los elementos de la función "Imagen y texto" que se pueden usar u omitir según sea necesario:

• Imagen: por supuesto, puede agregar una imagen a la función "Imagen y texto". Esta imagen se puede recortar como un cuadrado, un círculo o en proporciones de 5:4 o 16:9. También puede agregar un hipervínculo a esta imagen en el área "Enlace de imagen". Asegúrese de optimizar sus imágenes para la web antes de subirlas a su sitio web.
• Encabezado: puede agregar un encabezado que extraiga su estilo de fuente de la configuración "Título 1" en la pestaña Editar tema.
• Subtítulo: puede agregar un subtítulo que obtenga su estilo de fuente de la configuración "Título 2" en la pestaña Editar tema.
• Descripción: la descripción o el 'cuerpo del texto' aquí puede ser corto o largo, y hay opciones para envolver el texto alrededor de la imagen si es un texto bastante largo (tal vez para una biografía detallada del artista, más sobre eso más adelante) ). Se pueden agregar hipervínculos al texto en el área de descripción.
• Botón: un botón puede vincular a una página externa, una página de su sitio, una pista, un álbum, un archivo o una dirección de correo electrónico.

Ahora, aquí vienen 7 formas interesantes de aplicar esta función y otras personalizaciones de diseño a su sitio web. ¡Disfrútelo!

1. Organice su catálogo de música, cartera de proyectos y más

Si tiene muchos proyectos, servicios, álbumes, etc. diferentes que le gustaría resaltar en una página, una excelente opción es crear una 'página de destino' utilizando múltiples funciones de imagen y texto en varias columnas de su página.

Para ver esto en acción, consulte la página de "Producción e ingeniería" de Jojo Worthington, donde utiliza funciones de imagen y texto para enumerar todos sus créditos de manera organizada.

Sitio web del artista: Jojo Worthington

Para obtener un aspecto similar, primero cree una nueva página o sección. Para crear una nueva página, en Editar contenido, haga clic en "Páginas" > "Agregar una página" y nombre la página según sea necesario. Haga clic en "Crear mi página".

Para crear una nueva sección, en Editar contenido, pase el cursor entre dos secciones de su página y haga clic en el botón azul "+ Agregar una sección".

Diseñe un sitio web impresionante con una apariencia personalizada que coincida con su música. ¡Crea un sitio web con Bandzoogle ahora!

Recomiendo dividir la sección de una página en dos o tres columnas para comenzar. En Editar contenido, haga clic en "Nueva sección" (la línea horizontal azul dentro del diseño de la página) y luego coloque el cursor sobre la sección que creó y haga clic en "Editar columnas" - luego seleccione "2 columnas" o "3 columnas" aquí.

Para agregar una función de "Imagen y texto", haga clic en "Agregar función" > "Imagen y texto" y coloque la función en una de las columnas de esta sección usando las flechas de ubicación grises. Elija la opción de visualización "Apilar" para que el botón y cualquier texto se coloquen debajo de la imagen.

Luego, agregue una imagen que represente un proyecto/álbum/etc, y agregue cualquier texto según sea necesario. Si no desea ningún título/descripción, simplemente elimine las indicaciones de los campos de texto y déjelos en blanco.

Para agregar un enlace en esta imagen, haga clic en "editar" debajo de la miniatura de la imagen. Aparecerá un menú junto a la imagen. Haga clic en "Enlace" y luego elija su tipo de enlace: si está creando una página de discografía, puede vincular a "Un álbum" o "Una pista" para vincular a un álbum o pista/single configurado en su sitio. Si está haciendo un portafolio como productor, ingeniero, etc., puede vincular a una "página externa" e ingresar la URL del proyecto en el campo proporcionado. Haga clic en Aplicar.
Por último, pero no menos importante, está la opción Botón: para excluir el botón, seleccione "Sin enlace" en "Enlace de botón". O bien, elija otro tipo de enlace (probablemente el mismo enlace que aplicó en su imagen).

Haga clic en Guardar para guardar todos estos cambios. Continúe agregando características de "Imagen y texto" para todos los elementos en su discografía, cartera de proyectos, etc. Una vez que se hayan creado, tendrá una gran cuadrícula de elementos para que los visitantes de su sitio puedan hacer clic.

2. Destaca proyectos o productos en tu página de inicio

Otra excelente manera de usar la función "Imagen y texto" es resaltar algunos elementos clave en la página de inicio del sitio web de su banda. Una página de inicio es un excelente lugar para brindar una breve descripción general de sus últimos proyectos y todo lo que ofrece su sitio. Tal vez tenga algunos anuncios emocionantes que hacer, o quiera llevar a los visitantes de su sitio a su nuevo álbum, su tienda de merchandising en línea o el programa de su gira.

Puede usar la función "Imagen y texto" para resaltar claramente estas cosas y vincular a las personas a las páginas internas de su sitio donde se puede encontrar este contenido. El uso de una imagen siempre es útil para captar la atención de los visitantes de su sitio. Esto mantiene su página de inicio limpia y simple, y promueve una mayor interacción con las páginas internas de su sitio.

Wolf & Moon y Lightbound Music hacen un gran trabajo en sus páginas de inicio.

Sitio web del artista: Wolf & Moon

Sitio web del artista: Lightbound Music

Tenga en cuenta el uso del estilo de visualización "Collage" en ambas páginas. Han personalizado las plantillas de su sitio web para complementar sus nuevos productos/proyectos, de modo que el color de fondo de la superposición del collage coincida perfectamente con la obra de arte.

Realmente puedes jugar con varios colores aquí, entre el color de fondo de tu sección, el color de superposición del collage, los colores de los botones y los colores de la imagen que usas.

3. Mejora tu biografía para añadir personalidad

Con las opciones de título, subtítulo, botón e imagen en la función "Imagen y texto", puede agregar mucha personalidad cuando escribe su biografía de músico. Puede optar por incluir u omitir cualquiera de estos elementos según sea necesario.

Annie Sumi hace un gran trabajo con esto en su página de biografía. Annie ha colocado una cita que resuena con su práctica musical en el campo de "subtítulo" de la función "Imagen y texto". Esto tiene un estilo diferente y se destaca en la parte superior de su biografía. Ha utilizado la opción de visualización "dividida" para que la imagen se sitúe junto al texto biográfico.

Ha recortado la imagen de su artista en la cabeza para que sea un círculo; esto no solo complementa la imagen, sino que fluye muy bien con los temas de su música. Para recortar una imagen en su función de "imagen y texto", haga clic en "editar" debajo de la miniatura de la imagen. Aparecerá un menú junto a la imagen. Haga clic en "Recortar" aquí y elija un estilo de recorte que funcione para usted. Arrastre la imagen según sea necesario para colocarla y haga clic en Aplicar.

También ha activado el interruptor "Ajustar texto" en "Opciones" para que el texto se ajuste alrededor de la imagen. Esto responderá bien a los diferentes tamaños de pantalla y mantendrá el diseño de la página lleno durante toda la biografía.

Artista: Annie Sumi

4. Haz un EPK súper organizado

Otra opción de visualización para la función "Imagen y texto" es "Texto en imagen". Esto libera tantas posibilidades para crear algunos diseños encantadores que están muy enfocados en la imagen. Esta opción funciona maravillosamente para crear un EPK en su sitio web que los bookers y otras personas de la industria apreciarán, ya que pueden encontrar rápidamente lo que buscan con un solo clic. Extraigo este ejemplo del EPK de mi propia banda, donde los elementos se describen claramente con la opción "Texto en la imagen".

Aquí, configuré un diseño similar a la sugerencia de "Página de destino" anterior (n. ° 1). Usé algunas imágenes con textura de una sesión de fotos que hicimos para nuestro nuevo álbum y las recorté como círculos. Luego agregué un "Título" simple para cada característica de imagen y texto para etiquetar los diversos elementos incluidos en el EPK de nuestra banda.

Cada imagen está vinculada a una página separada que no está en el menú que contiene el contenido de cada categoría. Por ejemplo, tengo una página especial "EPK - Fotos" con todas nuestras fotos de prensa.

¡Siéntase libre de probar esto para una página EPK muy visual!

Sitio web del artista: The Lifers

5. Cree una página de información para suscripciones, servicios, etc.

Muchos de nuestros miembros ofrecen servicios increíbles a los visitantes de su sitio, ya sea vendiendo suscripciones de fans u otros servicios personalizados (clases de música, sesiones de grabación, terapia, etc.), siempre nos sorprende lo que nuestros miembros aportan al mundo.

Jackie Gage ha creado una maravillosa página de información para sus ofertas de Suscripción. Jackie usa la opción de visualización "Dividir" para la función "Imagen y texto" para describir los tipos de servicios que ofrecen. Jackie hace un gran uso de los componentes de encabezado, subtítulo y botón de la función de imagen y texto para que la información clave se describa claramente para los visitantes de su sitio. Maravilloso trabajo aquí!

Sitio web del artista: Jackie Gage

6 Use fondos de sección para un gran impacto en sus diseños

Hay tanto poder en las grandes imágenes. Al agregar una imagen de fondo a una sección, dividirá la página visualmente. Este descanso es bienvenido por nuestros ojos humanos que se desplazan, y ese contenido aparecerá de inmediato como importante y emocionante. Esta es otra excelente manera de incorporar una llamada a la acción en algún lugar de una página.

The Intune Experience hace esto maravillosamente en su página de inicio. Han establecido una hermosa imagen de textura como la "imagen de fondo de la sección" en una sección en la mitad de su página de inicio. Han agregado una cita de ellos mismos en la función "Texto", seguida de un botón vinculado, llamando a los visitantes para reservar una sesión.

Este diseño es perfecto, ya que le da un toque personal, es visualmente interesante y proporciona un mensaje claro para participar. La simplicidad es realmente la clave aquí.

Sitio web del artista: Becki Fleischer

7. ¡Diviértete con él!

Hay tantas maneras de jugar con los diseños si estás dispuesto a experimentar un poco. Este es un gran ejemplo de un sitio que juega con las posibilidades de los diseños utilizando recortes de formas, colores divertidos, fondos de secciones, diferentes diseños de columnas y más.

Piper Hayes ha labrado una gran estética en su sitio Vocal Coaching con el uso de recortes circulares y la opción de visualización de 'collage' para la función de imagen y texto. Este sitio combina una gran paleta de colores, hermosas imágenes de texturas y toques personales intrépidos para crear un espacio en línea muy acogedor.

Sitio web del artista: Piper Hayes

Espero que esta publicación haya ayudado a brindar algo de inspiración sobre cómo puede brindar toques personales y estéticamente agradables a su propio sitio web mediante la creación de diferentes diseños en sus páginas. Por supuesto, no dude en ponerse en contacto con nuestro galardonado equipo de soporte si desea que echemos un vistazo a lo que ha creado y le proporcionemos algunos comentarios. ¡Ofrecemos revisiones gratuitas del sitio web de la banda a todos nuestros miembros!