Un logo es una imagen que suele ir alojada en la cabecera de un sitio web. Está compuesto tanto por símbolos, texto o una combinación de los dos. Es importante que sea sencillo, fácil de reproducir y de recordar.
Por lo general, cuando se diseña un logo, es recomendable definir un color base (o principal) y un color secundario que serán los que se utilicen para el desarrollo del sitio web.
La idea es que el logo contenga, al menos, el color principal que se utilizará en el sitio web o una combinación entre el color principal y el secundario.
Como el logo, por lo general suele ser una imagen, te recomiendo que visites la entrada imágenes en WordPress (si aún no lo has hecho) donde encontrarás información actualizada para optimizar correctamente una imagen antes de subirla a WordPress.
Muchas personas suelen crear un logo al azar y subirlo a su sitio web. Luego se dan cuenta que el logo no se ve, se ve pixelado, queda demasiado grande o no encaja bien en la cabecera. En fin, el logo no ha sido optimizado para subirlo al sitio web.
Normalmente esto sucede por falta de conocimientos. Antes de subir un logo a un sitio web es necesario tener en cuenta algunos parámetros para conseguir un excelente resultado
Lo recomendable es que el logo tenga formato PNG (extensión .png) de manera que se pueda diseñar con fondo transparente.
Además de esta extensión, existen otras extensiones con las que se suelen crear logos aunque no todas suelen ofrecer buenos resultados:
En resumen, cuando crees un logo para tu sitio web, asegúrate que tenga formato PNG con fondo transparente.
La orientación del logo suele estar definida por la arquitectura del tema. Por lo general los logos se diseñan en formato horizontal para que se adapte a la cabecera del sitio web que se suele ubicar en la cabecera del tema.
Sin embargo, hay temas que ofrecen la opción de configurar la cabecera en el lateral de la pantalla. En este caso es más recomendable utilizar un logo en formato vertical.
Por último existen logos simétricos (ancho y alto iguales) que pueden ser utilizados tanto en formato horizontal como en formato vertical.
En la imagen anterior puedes apreciar diferentes configuraciones de cabecera que ofrecen algunos temas (por lo general los temas PREMIUM).
Dependiendo de la opción que elijamos para nuestro sitio web, diseñaremos el logo para que se adapte a la configuración de la cabecera.
Si contratas el diseño de un logo, por lo general, el profesional suele diseñar el logo en varios formatos. De esta manera puedes cambiar el logo según la configuración que elijas en el tema.
En la siguiente imagen puedes observar el diseño de un logo tanto en formato horizontal como en formato vertical.
El tamaño de un logo viene dado por sus dimensiones. Un logo con 1000px de ancho y 300px de alto ofrece una buena resolución pero no es un tamaño adecuado para subirlo a un sitio web.
Cuando contratas el diseño de un logo, generalmente el diseñador te entrega varias versiones, en varios formatos y con una resolución muy alta.
Suelen tener grandes medidas (3500px de ancho y 1800px de alto, por ejemplo) de manera que se pueda utilizar también para imprenta: diseño de banners publicitarios, camisetas y tarjetas entre otros.
Actualmente, la mayoría de temas modernos, suelen ofrecer opciones para adaptar el logo al espacio de su cabecera e incluso para diferentes tipos de dispositivos: PC, tableta y móvil, sin importar las dimensiones. Astra es uno de ellos.
Anuncio publicitario
Para crear un logo, para tu sitio web, tienes 3 opciones:
Existe una plataforma llamada Logaster. Es una plataforma donde puedes crear logos de cualquier tipo, tamaño, diseño y color para tu sitio web.
Aunque puede que el resultado final no sea tan profesional como te gustaría, es una buena elección para crear un logo y comenzar con tu proyecto.
Para crear un logo en Logaster, sigue los siguientes pasos:
Por ejemplo...
Como podemos elegir la temática del logo que queremos crear, vamos a crear un logo para un gimnasio.
Para este ejemplo, el logo que hemos descargado tiene formato PNG, 327px de ancho y 147px de alto. Tanto el formato como el tamaño están bien para subirlo al sitio web.
Pero hay un problema, tiene fondo blanco. El fondo transparente es más recomendable para un logo ya que te da libertad con el diseño si el fondo de la cabecera es de otro color.
Existe un programa gratuito llamado GIMP que es muy parecido a Photoshop. Con este programa podrás quitar el fondo blanco de la imagen y guardarla con fondo transparente.
En este tutorial tienes una guía para que aprendas a quitar el fondo de una imagen con GIMP.
Al quitar el fondo blanco, el logo adopta las medidas: 275px de ancho y 75px de alto, lo cual sigue siendo un buen tamaño para subirlo a nuestro sitio web.
Siguiendo estos sencillos pasos, en los que no tardarás más de 5 minutos, puedes crear un logo para tu sitio web totalmente gratis y con una calidad bastante óptima.
Una vez hayas descargado el logo, aplica las técnicas SEO que recomiendo en la entrada imágenes en WordPress (la que te recomendé leer al inicio de esta lección). Básicamente sería renombrar y optimizar la imagen.
Por lo general, es recomendable renombrar una imagen coincidiendo con el titulo de la página o entrada donde se vaya a subir. En el caso del logo, puedes renombrarlo como logo.png ya que será una imagen genérica que estará en todo el sitio web.
Inicia sesión en WordPress y dirígete al apartado Apariencia >> Personalizar >> Cabecera >> Identidad del sitio.
El logo, en versión PC, se ha subido y configurado correctamente en nuestro sitio web. Pero, ¿qué pasa con la versión móvil?
En la parte inferior izquierda de la pantalla, hay 3 iconos de visualización: PC, tablet y móvil. Mediante cada uno de estos íconos, podrás configurar las opciones para cada versión de tu sitio web.
Haz clic en cada una de ellas para que puedas observar como se verá tu sitio web en cada dispositivo.
Para este ejemplo, el logo, en la versión móvil, se ve muy grande. En la opción Ancho del logo, se puede apreciar como ha cambiado el ícono de PC por el ícono del móvil.
Esto significa que el tema se adapta a cada una de las opciones para ser configuradas independientemente en versiones responsivas.
Siguiendo estos sencillos pasos hemos subido un logo a WordPress. El logo tiene el tamaño ideal y se encuentra optimizado para todas las versiones del sitio web.
Anuncio publicitario
Con esta información podrás ir avanzando en el diseño de tu sitio web. Aún quedan más pasos para lograr tener un sitio web completamente funcional y optimizado para el SEO.
Ten paciencia que poco a poco irás teniendo más práctica y, cuando finalices el curso, obtendrás excelentes resultados.
Te estaría muy agradecido si pudieras valorar esta entrada y compartirla en tus redes sociales. De esta manera me animas a continuar trabajando en este proyecto y ayudas a otras personas que desean aprender.
(22 votos, promedio: 4.9 de 5)
Todo el contenido que puedes encontrar en este sitio web es gratis y siempre lo será pero, mantenerlo, requiere de muchos cafés y muuuuchas horas . Si te gusta mi trabajo y te está ayudando, considera invitarme un café para apoyarme y apoyar este proyecto. ¡Te invito un café!.
No me gusta el SPAM y se que a ti tampoco. Sólo recibirás información útil sobre WordPress.
Al enviar, confirmas que has leído y aceptas la política de privacidad. Conoce nuestro compromiso con tu privacidad.
Deja un comentario si tienes alguna duda o cuéntanos cómo ha sido tu experiencia.
Copyright © 2025 Curso de WordPress
Hecho con Venezolano!
Desarrollado con WordPress y diseñado con Hello Theme y Elementor.
fe de erratas:
Me parece que esta cambiado vertical por horizontal
Hola Nico, muchísimas gracias por la acotación. Un saludo!