5 claves para identificar un diseƱo web profesional y de calidad

Autor: Max CamuƱas

Fecha: 27/04/2019

Si estĆ”s leyendo este artĆ­culo es porque quieres tener un diseƱo web profesional, Āæverdad?

PermĆ­teme decirte que no eres ningĆŗn bicho raro, todo lo contrario.

Hoy en dĆ­a, todos los negocios, empresas, blogs o tiendas online quieren tener un diseƱo web profesional y que su pĆ”gina estĆ© a la Ćŗltima en cuanto a tendencias creativas.

Todos queremos una web espectacular, creativa, diferente, que cargue rƔpido.

De hecho, me suele llamar la atenciĆ³n cuando un cliente me pide presupuesto para diseƱar su web y me dice lo siguiente: quiero que la web sea bonita, que funciona bien y refleje mi personalidad.

Y yo me quedo pensando: claro, como todo el mundo ?ā€ā™‚ļø

Ā”De fotocopias estĆ” lleno el mundo!, Āæno crees?

Todos hemos asumido que para estar en internet necesitamos una imagen trabajada, un diseƱo profesional que ademƔs represente los valores de nuestro negocio o marca.

Entonces, Āæpor quĆ© sigo escuchando / leyendo frases del tipo Ā«la web me la va a hacer mi sobrinoĀ» o Ā«compro una plantilla y monto la web yo mismoĀ»?

Asƭ es, son solo un par de ejemplos de los comentarios que recibimos los diseƱadores web cuando entregamos un presupuesto.

(Si hay algĆŗn diseƱador en la sala, puede confirmarlo en los comentarios).

Querido inepto, Āæde verdad que tĆŗ o tu sobrino, por muy avispados que seĆ”is, vais a conseguir el mismo resultado que un diseƱador web freelance con aƱos de experiencia?

ĀæAcaso cuestionas al fontanero que va a tu casa a arreglar la reparaciĆ³n de tu caldera?

No, Āæverdad?

Entonces, Āæpor quĆ© subestimas el trabajo de un diseƱador web profesional? (y esto lo extiendo al DiseƱador GrĆ”fico, Community Manager, fotĆ³grafo y creativo en general).

CĆ³mo diferenciar un diseƱo web profesional de uno amateur (o chapucero)


SĆ­, he utilizado la palabra Ā«chapuceroĀ». Te sorprenderĆ­an las verdaderas chapuzas que me encuentro a diario en algunas pĆ”ginas web en WordPress.

Por ese motivo he querido crear este post, para enseƱarte a reconocer una pƔgina chapucera de un diseƱo web profesional.

Porque no nos engaƱemos, puede que una pƔgina tenga un diseƱo mƔs o menos acertado, pero detrƔs de una web hay muchos mƔs elementos.

Algunos de ellos son:

CĆ³mo diferenciar un diseƱo web profesional de uno amateur (o chapucero)

#1 DiseƱo

Como no podƭa ser de otra manera, el primer indicador para detectar una web amateur en vez de un diseƱo web profesional es el diseƱo.

Y con el diseƱo no solo me refiero a cĆ³mo estĆ” el contenido, sino a la maquetaciĆ³n de cada uno de los elementos de la pĆ”gina: imĆ”genes, textos, alineaciones, mĆ”rgenes, etc.

Otros aspectos para detectar un mal diseƱo web son:

  • La plantilla. Si el Ā«autorĀ» del diseƱo ha dejado la plantilla que viene por defecto cuando instalas WordPress o usa una plantilla gratuita, es un mal diseƱo. Ā”OJO! No tengo nada en contra de los temas grautĆ­tos (para nada), pero hay plantillas y plantillas.
  • Los colores. La paleta de colores es otro de los indicadores, para mĆ­ uno de los fundamentales en cuanto a diseƱo. Si los colores de la web estĆ”n elegidos sin ningĆŗn criterio y los diferentes tonos de la paleta no guardan relaciĆ³n unos con otros, no es un diseƱo web profesional. En mi opiniĆ³n, elegir bien los colores es muy importante (y a la vez difĆ­cil) para que la web tenga la personalidad que se merece.
  • Las imĆ”genes son otro indicador muy sencillo para diferenciar un mal diseƱo web de uno profesional. Si las imĆ”genes no tienen calidad, estĆ”n mal ajustadas en cuanto a tamaƱos o ya las has visto antes en otras 50 pĆ”ginas, estĆ”s antes un mal diseƱo.
  • Y lo mismo sucede con el resto del material grĆ”fico (ilustraciones, iconos o vectores).

Si quieres algunas ideas chulas para tu web, Ʃchale un vistazo a estas herramientas para encontrar pƔginas web creativas.

#2 OrganizaciĆ³n

El segundo aspecto que me indica si una pĆ”gina tiene un diseƱo web profesional es su estructura y la organizaciĆ³n de su contenido.

Aspectos relacionados con la organizaciĆ³n de una pĆ”gina web que debes observar son:

  • El menĆŗ. La organizaciĆ³n de las diferentes pestaƱas del menĆŗ es uno de los primeros indicadores en los que me fijo. Por ejemplo, nĆŗmero de elementos (que no tenga demasiados), desplegables (cuando un menĆŗ tiene muchos submenĆŗs no estĆ” teniendo en cuando la usabilidad para el usuario), la ubicaciĆ³n del menĆŗ, si hay varios menĆŗs en la pĆ”gina (uno principal y otro secundario).
  • El contenido. La organizaciĆ³n del contenido tambiĆ©n es importante y hace referencia a elementos como categorĆ­as, subcategorĆ­as, pestaƱas o etiquetas.
  • Otras variables / Filtros. En el caso de un ecommerce, por ejemplo, que los artĆ­culos se filtren por colores, tallas, promociones, etc.

#3 OptimizaciĆ³n

Otro punto fundamental para diferenciar un diseƱo web profesional de uno amateur es su nivel de optimizaciĆ³n.

Y aquƭ no hay dudas. O tienes experiencia en diseƱo web o dudo que sepas optimizar WordPress como un profesional.

ĀæQuĆ© elementos son clave cuando hablo de optimizaciĆ³n de un sitio web?

  • Velocidad de carga. Este es un tema del que ya he hablado en varias ocasiones. Tener una pĆ”gina que cargue rĆ”pido es fundamental a dĆ­a de hoy, es algo que se nos estĆ” demandando mucho a los diseƱadores web.
  • ImĆ”genes. Tener las imĆ”genes optimizadas es uno de los factores que afectan en la velocidad de carga. Cuando hablo de optimizaciĆ³n de imĆ”genes, me refiero a su peso y tamaƱo.
  • CachĆ©. Otro de los factores que mĆ”s afectan a la velocidad de carga de un sitio web es la carga bajo cachĆ©.
  • Limpieza de la base de datos. Por Ćŗltimo, no me quiero olvidar de la base de datos de WordPress, que debe estar limpia y optimizada para el correcto funcionamiento de la web.

ĀæEstĆ”s seguro de que tu primo o cuƱado saben optimizar todos estos elementos? šŸ˜‰

#4 SEO

Con el SEO pasa un poco lo mismo que con la optimizaciĆ³n, o lo controlas o no lo controlas.

Y a dĆ­a de hoy, con el nivel de competencia que hay en Internet para todos los sectores, necesitas tener al menos unas nociones.

No hace falta que te conviertas en Dean Romero o Luis Villanueva, pero para que tu pƔgina tenga un diseƱo web profesional, necesitas que te suenen al menos estos conceptos:

  • TĆ­tulo SEO. TĆ­tulos para SEO, asĆ­ como estructura de tĆ­tulos (h1, h2, h3…).
  • Meta descripciĆ³n. Son etiquetas SEO que te permiten establecer una descripciĆ³n del contenido para los buscadores.
  • Keyword research. Debes manejar alguna (o varias) herramientas que te muestren las palabras clave relacionados con tu actividad o negocio y que te interesan posicionar en Google, asĆ­ como su nivel de competencia y grado de dificultad.
  • Copywriting para SEO. Una vez tienes claras las keywords que quieres posicionar, necesitas redactar textos adaptados a SEO, siguiendo una estructura de tĆ­tulos y una densidad correcta de la palabra clave, por ejemplo.

Y no sigo, que no te quiero asustar.

Si optas por una web diseƱada por tu primo, asegĆŗrate que controla todos esos conceptos šŸ˜€

#5 Servicios complementarios

Y por Ćŗltimo, otro punto que me permite reconocer un diseƱo web profesional es el relacionado con los servicios complementarios y los extras.

Por supuesto, una pĆ”gina tiene extras de los que no te puedes olvidar y en este tipo de detalles es dĆ³nde se ve si es un diseƱo web profesional o si estĆ” hecha por un sobrino / primo / cuƱado.

Algunos de estos extras son:

  • Twitter Cards. Son los tuits enriquecidos que muestran la informaciĆ³n multimedia de los artĆ­culos y pĆ”ginas de un sitio web. Te cuento todo sobre las Twitter Cards aquĆ­.
  • Metadatos Open Graph en Facebook. Al igual que en Twitter, Facebook tambiĆ©n muestra informaciĆ³n multimedia cuando compartes un enlace de tu web.
  • Google Analytics. Crear una cuenta en Analytics y vincularla con tu pĆ”gina web es fundamental para estar al tanto de tus estadĆ­sticas.
  • Search Console. Es la herramienta de Google que te permite verificar la propiedad de tu web de cara al buscador, asĆ­ como avisarle para que la indexe.

AquĆ­ puedes ver un ejemplo de las dos primeros en el caso de esta web.

5 claves para identificar un diseƱo web profesional y de calidad
Facebook Open Graph

5 claves para identificar un diseƱo web profesional y de calidad
Twitter Card

No te olvides de la lista de elementos que debes revisar antes de lanzar una web šŸ˜‰

5 claves para identificar un diseƱo web profesional y de calidad

En definitiva, hoy en dƭa cualquiera puede crear un sitio web. Las herramientas (plantillas, bancos de imƔgenes, editores visuales para WordPress, etc) estƔn ahƭ, al alcance de todos.

La diferencia entre un diseƱo web profesional y uno amateur estĆ” en el uso de esas herramientas, de la creatividad a la hora de ordenar la estructura de la pĆ”gina y de mostrar la informaciĆ³n, asĆ­ como de la destreza para de plantear soluciones creativas.

Existe un concepto al que me gusta llamar la magia del diseƱador y que estoy convenido de que tu sobrino o cuƱado no tienen šŸ™‚

De ahĆ­ mi lema: Cautiva, Fascina, Enamora ā¤ļøļø

Recuerda que, si necesitas ayuda con tu pĆ”gina, puedes echarle un vistazo a mi servicio de diseƱo web šŸ˜‰

Portada: Responsive website / Shutterstock

Summary
5 claves para identificar un diseƱo web profesional y de calidad
Article Name
5 claves para identificar un diseƱo web profesional y de calidad
Description
CĆ³mo diferenciar un diseƱo web profesional de uno amateur (o chapucero): #1 DiseƱo #2 OrganizaciĆ³n #3 OptimizaciĆ³n #4 SEO #5 Servicios complementarios
Author
Publisher Name
Max CamuƱas
Publisher Logo

15 Comentarios

  1. eduardo

    MƔs claro y directo imposible.

    Saludos

    Responder
  2. Lumedia

    Excelente artĆ­culo. Es demasiado frecuente encontrar webs montadas con plantillas WordPress o con editores de proveedores de internet en los que la optimizaciĆ³n seo es nula, sin marcado de datos, optimizaciĆ³n de imĆ”genes nula, etc.. El sobrino debe tener mucho chollo. Saludos

    Responder
    • Max CamuƱas

      Totalmente de acuerdo!

      Cuando curro deben tener los sobrinos ?

      Muchas gracias por comentar.

      Responder
  3. Nacho Ros

    Buen artĆ­culo Max!
    TambiĆ©n se puede notar cuando hay pequeƱos textos en inglĆ©s como Ā«Read MoreĀ» o Ā«ShareĀ». Son cosas que quizĆ” uno piensa: Ā«da igual que estĆ© en inglĆ©s, todo el mundo entiende esoĀ».
    Los pequeƱos detalles, como las Twitter Cards que comentas, son los que tambiƩn delatan una web amateur.
    Ā”Un abrazo!

    Responder
    • Max CamuƱas

      Hola Nacho,

      Este tipo de textos que comentas tambiƩn son indicador, totalmente de acuerdo.

      Al final los detalles pequeƱos son los que marcan la diferencia entre un diseƱo web profesional y uno mƔs amateur.

      Gracias por pasarte.

      Un abrazo!

      Responder
  4. Jorge Salazar

    Excelente articulo Max. Otro detalle que yo he visto, es el apelotonamiento en la web, el no uso del espacio en el diseƱo, como si trataran de meter todo en una sola pantalla. Aun y que Divi por default da eso, he visto diseƱos hechos con Divi en donde de plano casi no existen los mƔrgenes. Y de los colores, ni que decir.

    Solo agregar que he analizado webs que dan calificaciones de 15% en Metricspot o 40 en PageSpeed Insights o GMetrix. ĀæY sabes que es lo peor? Que me he topado con pĆ”ginas asĆ­ de mal y hechas por agencias, no por el sobrino sabiondo.

    Saludos

    Responder
    • Max CamuƱas

      Hola Jorge,

      Totalmente de acuerdo contigo. Me agobian mucho esas pƔginas en las que todos los elementos estƔn muy juntos y no dejan respirar.

      Sobre las agencias… darĆ­a para varios artĆ­culos extensos jaja

      Es un terreno en el que prefiero no entrar. Que cada uno juzge šŸ˜‰

      Gracias por pasarte.

      Saludos!

      Responder
  5. Leonardo M.

    Muy bien redactado y explicado. Se entiende todo de maravilla. Acabo de descubrir tu blog y, la verdad, me estĆ” encantando. No puedo estar mĆ”s de acuerdo contigo en lo que dices, sobretodo cuando mencionas la importancia del color. En mis trabajos personales, cuando lo empecĆ© a tener en cuenta (su psicologĆ­a, cĆ³mo se entendĆ­a en las diferentes culturas) hubo un salto considerable. Es increĆ­ble el hecho de que un color pueda modificar las emociones tan drĆ”sticamente.

    Yo pertenezco a Factoria Creativa, una agencia de publicidad y comunicaciĆ³n. Te dejo un link de nuestra web. Espero te pases por el blog, que tiene cosas muy interesantes.

    Ā”Un saludo!

    Responder
    • Max CamuƱas

      Hola Leonardo,

      Bienvenido a mi casa šŸ™‚

      Totalmente de acuerdo. Una buena (o mala) paleta de colores puede cambiar por completo una web.

      Espero verte por aquĆ­ a menudo.

      Saludos!

      Responder
  6. Me llamo RubƩn

    Me arrepiento de haber perdido varios minutos de mi vida leyendo esta Oda a diseƱadores web. Un post en el que no ayudas en absoluto, bueno si, te ayudas a ti mismo.. Abrumas a la gente que no tiene recursos para contratar a un diseƱador web y tiene que buscarse la vida para hacerla el mismo. Ese sobrino que mencionas tan ironicamente, por ejemplo. Espero que esa gente no caiga en esta web, donde no aportas ningun valor. Yo he sido uno de esos, he tenido que buscarme las castaƱas por mi mismo y ahora tengo tres proyectos con mucha calidad, o una calidad aceptable para no ser diseƱador web profesional.
    Y dƩjame que te de un consejo, si es que tu ego de profesional te permite cogerlo, hubieras quedado muchisimo mejor, y mas profesional, si en lugar de abrumar a la gente sin recursos, te hubieras marcado un post de los pies a la cabeza, poniendo ejemplos y herramientas a usar para cada punto que has detallado. Hoy en dia optimizar una web es muy facil, escribir para SEO es muy facil. Solo hay que saber las herramientas. Hubieras perdido algun cliente, pero ganarias fieles seguidores.
    Un saludo campeĆ³n del diseƱo web.

    Responder
    • Max CamuƱas

      Hola RubƩn,

      El objetivo del post es enseƱar cĆ³mo detectar un diseƱo web profesional de uno amateur, precisamente para que ningĆŗn diseƱador te la cuele (te sorprenderĆ­a los clientes que me han venido rebotados de otros ā€œdiseƱadoresā€ con autĆ©nticas chapuzas).

      LĆ³gicamente es el blog de un diseƱador web y hablo desde mi perspectiva. Es mi punto de vista profesional despuĆ©s de aƱos dedicĆ”ndome al diseƱo. No es ninguna oda ni intento imponer nada, todo lo contrario!

      Es como si me meto al blog de un SEO o un Copywriter, por poner un ejemplo, y en un post me animan a contratar los servicios de un profesional de la redacciĆ³n de textos. Lo entenderĆ­a desde su punto de vista y no me ofenderĆ­a. De hecho, estoy acostumbrado a leer artĆ­culos de ese tipo. No sĆ©, no lo veo nada descabellado.

      De hecho, siempre he defendido que, si tienes una idea y quieres empezar un proyecto desde cero pero no tienes recursos, lo mejor es que lo hagas tĆŗ (asĆ­ hemos empezado prĆ”cticamente todos!), pero si puedes rodearte de los mejores, conseguirĆ”s resultados mucho antes y no cometerĆ”s mil errores.

      De todas formas, si te parece que en este artĆ­culo no aporto valor, tengo 169 mĆ”s publicados. En alguno supongo que aportarĆ© valor. Tengo un montĆ³n de posts mĆ”s hablando de SEO, plantillas, plugins, herramientas, consejosā€¦ y no solo yo, tambiĆ©n de expertos en cada materia.

      Por Ćŗltimo, si te parece que diseƱar una web, escribir textos, posicionarlaā€¦ y todo en internet es fĆ”cil, te animo a hacerlo todo tĆŗ mismo, como dices que ya has hecho. Yo seguirĆ© trabajando con profesionales en cada materia.

      Saludos

      Responder
  7. Me llamo RubƩn

    Jajaja por cierto, un buen diseƱador web tambiƩn muestra comentarios negativos. Es una pena que mi comentario anterior que tanto me he currado nadie lo vea. Pero tu ego de profesional solo quiere que la gente vea lo bueno que dicen.
    Sigue asi

    Responder
    • Max CamuƱas

      Hola de nuevo RubƩn,

      AdemĆ”s de entrar en mi ā€œcasaā€ a faltarme el respeto, veo que no sabes que los comentarios de WordPress necesitan moderaciĆ³n.

      ĀæVes como no se puede ser diseƱador, SEO, copy y fotĆ³grafo todo en uno?

      Ya estĆ” publicado tu comentario tan ā€œcurradoā€.

      Y por supuesto, seguirĆ© asĆ­ šŸ˜‰

      Responder
  8. Lautaro

    Saludos desde Argentina.. Soy programador. Muy bueno el post!

    Responder

Enviar un comentario

Tu direcciĆ³n de correo electrĆ³nico no serĆ” publicada. Los campos obligatorios estĆ”n marcados con *

Para cumplir con el nuevo RGPD y que tus datos estƩn a salvo, debes leer y aceptar mi polƭtica de privacidad. Tus datos serƔn guardados en SiteGround y WordPress, mi proveedor de hosting y el CMS que utilizo en esta web.

Soy Max CamuƱas y te doy la bienvenida a mi blog (mi casa).

Por aquĆ­ hablo sobre los temas que me apasionan: WordPress, Marketing, Social Media o Blogging.

Me encanta ayudar a otras empresas a marcas a crear el diseƱo de su web desde cero.

Ā”MƁS SOBRE Mƍ!

masterclass
CƓMO PLANIFICAR TU PƁGINA WEB PARA QUE TU NEGOCIO BRILLE
Ā”accede gratis!