Diseño de logotipos web

Qué debes tener en cuenta al diseñar un logotipo para un sitio web

El diseño de logotipos para sitios web sigue reglas completamente diferentes a las de la comunicación impresa o de otro tipo. Los requisitos de los logotipos y los signos han aumentado. Te mostramos las pautas y herramientas para crear los logotipos de la web tu .

Diseño de logotipos para impresión y web

Hay una frontera muy permeable entre el diseño web y el diseño gráfico. Los diseñadores gráficos suelen centrarse en la impresión, diseñando papelería comercial, carteles, anuncios y logotipos. Los diseñadores web, por su parte, crean sitios web, Newsletter, banners y, por supuesto, logotipos.

Algunos mezclan ambas áreas de negocio, ofrecen diseño para la impresión y la web. El cliente final no tiene claro quién puede hacer qué y quizás quién no debe hacer qué. Entonces, los diseñadores gráficos que se sienten más a gusto en la impresión crean diseños para sitios web, y ponen los logotipos de la impresión en la web. Por el contrario, es más bien la excepción que los diseñadores web desarrollen toda la papelería empresarial.

Debería ser obvio para cualquier persona con "ojo gráfico" o con una profesión de diseño gráfico que un logotipo en un sitio web tiene requisitos diferentes que uno en un membrete o en un edificio de la empresa.

Con la llegada de los teléfonos inteligentes y de Internet móvil, los requisitos de los logotipos y de los signos (son pequeños gráficos que pueden utilizarse como logotipos) en la web han cambiado de nuevo y se han vuelto más específicos, pero también más estrictos. Al final, no es tan complicado. Sin embargo, se necesita cierta experiencia y aplomo para desarrollar un buen logotipo para un sitio web.

3 Pautas para crear un logotipo

Hay tres puntos primordiales que puedes tener en cuenta al diseñar tu logotipo:

  • Formato apaisado: El logotipo aparece en la parte superior izquierda, es lo que esperan los usuarios. A veces también se permite en el centro de la web. Pero para ahorrar un espacio valioso y atraer la atención de los usuarios hacia lo esencial, tiene sentido tener en cuenta los hábitos generales de visualización de la gente, con un logotipo en formato apaisado en la parte superior del lado izquierdo sitio.
  • Estructuras claras: Es esencial tener en cuenta el tamaño del logotipo en un smartphone o una tableta. Pero muchos ordenadores de sobremesa y portátiles también tienen una resolución muy alta, es decir, mucho espacio, o una diagonal de imagen más bien pequeña. En ambos casos, el logotipo puede parecer bastante pequeño. Sin embargo, debe seguir funcionando bien en tamaños pequeños.
  • No hay reclamaciones: Muchos clientes, pero también los diseñadores, sienten la inclinación, a veces irresistible, de colocar un reclamo bajo el logotipo. El texto en la imagen, en otras palabras. Eso tiene poco sentido. No es sólo una cuestión de espacio, sino que además es difícilmente legible en los smartphones. Por no hablar de que excluye el texto valioso de la indexación de Google (SEO).

Soy consciente de que estas tres sencillas "reglas" para crear un buen logotipo están abiertas al debate. Porque, por supuesto, puedes encontrar algunos contraejemplos o marcas que más o menos (quieren) tener sus propias reglas. Pero en ese caso se trata de marcas muy especiales y exitosas, y las excepciones también confirman la regla.

Pero, ¿qué hace que los logotipos sean geniales? La mejor manera de averiguarlo es mirar los logotipos y/o los letreros de las grandes empresas de éxito. Los logotipos más ingeniosos que conozco son los de Daimler (la estrella de Mercedes), Apple (con la manzana), VW, BBC o la M de McDonalds. Por supuesto, hay muchos más ejemplos. Y la mayoría de ellos se remontan a una época en la que no existía Internet. Sin embargo, los logotipos evolucionan con el tiempo, al igual que las marcas y las empresas.

diseño de logotipos para weblogos
El diseño de logotipos es más diverso que nunca.

Lo ideal es que haya logotipos adaptados a los distintos formatos de salida. Los logotipos favoritos que acabamos de mencionar son también ejemplos brillantes de esto. Funcionan en todas partes y se adaptan a los respectivos medios con sus requisitos específicos. Lógico: un membrete necesita algo diferente a un letrero de neón en una casa, y un sitio web tiene condiciones diferentes a las de una tarjeta de visita.

Signet & word mark en la red

Este post no es un taller completo sobre cómo crear un logotipo perfecto. Sin duda, hay algo más que leer una entrada en el blog. Pero debería ayudarle a entender mejor el asunto del logotipo en el sitio web tus - y por ello a encontrar soluciones más exitosas para ello.

Sólo un resumen rápido: ¿Qué es un logotipo? La Wikipedia dice:

"Un logotipo es un signo gráfico que representa un tema concreto. Puede ser una empresa, una organización, un particular o un producto".

Hasta ahora, todo va bien. Un logotipo puede ser una marca denominativa, como Coca Cola, Google o Acer. Puede ser un sello, como en el caso de Playboy, Shell y Mercedes. Sin embargo, la mayoría de los logotipos consisten en una marca denominativa y un sello. En los ejemplos anteriores de sellos, siempre hay una variante con y sin la palabra marca.

Esto también se aplica a McDonalds, por ejemplo, con la distintiva M que todo el mundo conoce. El logotipo de McDonalds está disponible con el nombre y con el reclamo (me encanta), pero la M siempre está ahí. En el sitio web de McDonalds, por las razones mencionadas anteriormente, lo han resuelto de tal manera que sólo encuentras esta M en la parte superior izquierda de la navegación, y ésta se desplaza hacia dentro cuando te desplazas. Sólo la M sigue ahí en algún momento. Me parece inteligente y que ahorra espacio, porque lo más importante está siempre visible: el sello, la "M".

Veamos el logotipo del sitio web de la WWF, por poner un ejemplo del ámbito más políticamente correcto. El famoso oso panda, que también podría sostenerse por sí mismo, está colocado sobre las letras WWF, la abreviatura del Fondo Mundial para la Naturaleza. Creo que el sitio web está bastante logrado (TYPO3, por cierto), pero se abstienen de clavar la navegación principal. Esto se resuelve de forma inteligente. Ocupa un poco de espacio, pero contiene todo lo esencial.

Gracias a la tecnología del Mega Menú, el segundo nivel de la navegación muestra todo lo que hay que ver en el sitio web. Si abres el megamenú pasando el ratón por encima, sólo queda visible el panda. Se trata de un logotipo vertical, pero su ejecución es impecable. Este logotipo también procede de una época en la que no existían los sitios web. Estoy seguro de que la WWF mandaría crear hoy otro logotipo, uno en formato apaisado.

"*"indica que los campos son obligatorios

Consentimiento*
Este campo es de validación y no debe modificarse.

Ejemplos con logotipo en formato apaisado

Raidboxes es un interesante ejemplo de diseño de logotipos. Una marca de palabra, en formato apaisado, por supuesto; de lo contrario, no podrías leerla. Yo llamo a este logotipo exitoso. Porque tiene un alto valor de reconocimiento, que es la esencia de un buen logotipo. Además, también funciona en formato pequeño en los dispositivos móviles. Esto se aplica a muchos sitios de la Internet moderna, como Google, Facebook, Amazon, Microsoft, YouTube y muchos más.

Raidboxes diseño de logotipos
El logotipo de Raidboxes: Diseño del logotipo

Podemos decir lo mismo de la sitio WordPress.org decir. Existen especificaciones para la presentación del logotipo de WordPress que están a la vista de todos: una guía de estilo. El logotipo tiene la W como sello y la palabra marca en formato apaisado, pero también de canto. En el sitio web, se omite, por supuesto, el logotipo vertical. Por buenas razones, el logotipo con el sello no sólo se muestra apaisado, sino también relativamente grande por encima de la navegación. En este caso, el menú tampoco es fijo, lo que no perjudica la usabilidad del sitio web.

Nuestro relanzamiento Raidboxes

Nuevo logotipo, nuevo sitio web, nuevos colores - el mismo nombre. ¡Celebramos nuestro relanzamiento en Raidboxes ! Junto con nuestra agencia asociada 360Vier, hemos replanteado nuestra identidad corporativa y hemos dado una nueva capa de pintura a nuestro sitio web.

Ejemplos de sitios web con WordPress

Otro sitio web fascinante que nos sirve de ejemplo es VOGUE América. La aplicación me parece coherente y adecuada a la marca. Pero es bastante débil en la navegación fija tras el desplazamiento. Esto se debe a que el gran logotipo del centro desaparece y aparece en Klein en la parte superior izquierda, donde esperamos que esté. Se trata de un reto general con las marcas denominativas que deben ser reducidas en el sitio web. Los bordes se "deshilachan" y se vuelven borrosos.

El mismo fenómeno puede observarse en SPIEGEL Online (SPON ). Para ambos, la excusa puede ser que los logotipos se crearon antes de la era de Internet. Vemos lo mismo que con VOGUE en la revista americana TIME, que funciona con WordPress.

En la NASA abierta tiene un aspecto un poco diferente, también alimentado por WordPress y también con un logotipo. Sin embargo, rodeado de un fino elemento gráfico. Este logotipo -esta vez dentro de una navegación fija- es lo suficientemente grande como para mostrar el elemento de una órbita aún reconocible. Me parece un éxito, aunque aquí también se ve el deshilachado de las letras. Por eso no soy partidario de las marcas denominativas puras, prefiero los sellos con abreviaturas.

BBC AMERICA también es un sitio web de WordPress. Ha hecho un trabajo brillante con el diseño y el logotipo. Sí, soy fan de la BBC. Pero también me parece que el logotipo es ingenioso y memorable, como ejemplo exitoso de diseño de logotipos en formato apaisado. Por cierto, este sitio web también prescinde de la navegación fija tras el desplazamiento: aquí el contenido está en primer plano.

Crear (haber creado) un buen logotipo para la web

Así que ahora puedes ver muy claramente que los logotipos no son brujería y a veces son muy simples. Su genialidad radica en la sencillez y la coherencia para reflejar una marca independiente. Por lo tanto, un buen logotipo es muy fácil de hacer, pero no es fácil de pensar o encontrar.

Diseño gráfico o no: con tu ojo gráficamente entrenado y unas cuantas reglas sencillas, puedes crear un buen logotipo para ti y para los clientes de tu . Por supuesto, lo más fácil sería contratar a un diseñador gráfico. Esta es la forma más segura y de mayor calidad garantizada: las excepciones confirman la regla. Pero también es la opción más cara.

En la red, lo hemos adivinado, hay portales que subcontratan estos servicios en el extranjero. De esta manera puedes comprar un buen diseño gráfico en países con salarios por hora más bajos y de alta calidad. Por ejemplo, de Ucrania, India, Indonesia, Sudamérica, pero también de EEUU, etc. Las desventajas son la situación jurídica en caso de litigio. Las desventajas son la situación jurídica en caso de litigio, la comunicación y, por tanto, a veces también la coordinación.

Como yo mismo tengo un ojo gráfico y quiero hacer todo lo posible por mí mismo, tomé un camino diferente con mi logotipo en PUBLICIDAD EN LA RED. Busqué y encontré un sello en Envato. Pensé que conseguiría construir un logotipo para ello. Porque el sello que me gustaba tenía un contenido equivocado. Un logotipo tiene que ajustarse absolutamente al tema y al carácter de tu .

Así que encontré un signo @ que quería utilizar, pero con una "P" en el círculo @. Al principio intenté hacerlo yo mismo, pero tengo muy poca experiencia con vectores en Illustrator. Así que, sin más dilación, pregunté al desarrollador del cartel a través de Envato si podía hacérmelo, y a qué precio. Era posible y el coste era absolutamente razonable. Ahora tengo esta "P" con la palabra marca en formato apaisado:

Ejemplo de logotipo en línea
El logotipo de PUBLIZIEREN IM NETZ

Diseño de logotipos: Herramientas de investigación

Así es exactamente como procedo con mis clientes. Si se desea el diseño del logotipo, sugiero que primero se elija un signo que se ajuste a la idea de negocio y al nombre. No sólo uso Envato o Envato Elements. También busco logotipos en Google, o en Iconfinder, iStockPhoto y otros proveedores de pequeños gráficos. Luego se los muestro al cliente, elijo uno o dos junto con él y construyo un logotipo en formato apaisado.

Presta atención a los derechos de autor, tu el logotipo no debe ser demasiado parecido a uno existente. Incluso si compras signets, debes comprobar la licencia (o hacerla comprobar): ¿La licencia es válida para tu propósito profesional sin restricciones temporales o geográficas? ¿Y también para utilizarlo como logotipo?

Los buenos logotipos son sencillos y expresan al máximo la idea de negocio. Funcionan en la web porque están en formato apaisado. Se pueden mostrar en blanco y negro. Y pueden aparecer en un membrete o en una tarjeta de visita, ligeramente modificados y adaptados, quizá con un reclamo debajo.

Resumen: Diseño de logotipos para sitios web

Crear un buen logotipo es relativamente fácil. Necesitas un concepto claro y una idea excelente. Puedes inspirarte en otras marcas y sitios web de éxito. Hablar con tus colegas y amigos también puede ayudarte a dar con esa idea sencilla y brillante. Pero seamos sinceros: no tiene que ser brillante, lo adecuado puede ser suficiente, lo bueno ya sería más que suficiente. Puedes buscar logotipos o rótulos en plataformas gráficas.

Por supuesto, los signos más o menos abstractos deben tener algo que ver con la profesión que representan. Pero aquí también puede haber combinaciones divertidas. O derivaciones coherentes, por ejemplo cuando pensamos en la famosa manzana de Apple. A quién se le hubiera ocurrido tomar una manzana con un bocado perdido. Pero este pequeño y divertido "perturbador" es lo que hace que este logotipo sea tan ingenioso.

Espero que ahora tengas algunas pistas para crear un próximo gran logotipo para la World Wide Web. Te deseo buena suerte y que te diviertas.

tu Preguntas sobre el diseño del logotipo

¿Tienes preguntas sobre el diseño de logotipos para sitios web? No dudes en utilizar la función de comentarios. ¿Quieres estar informado de los nuevos artículos sobre diseño web y WordPress? Entonces síguenos en Twitter, Facebook o a través de nuestro Newsletter.

¿Te ha gustado el artículo?

Con tu valoración nos ayudas a mejorar aún más nuestro contenido.

Escribe un comentario

Tu dirección de correo electrónico no se publicará. Los campos obligatorios están marcados con *.