Cuando Josep me invitó a escribir en este blog, y justo después de la sensación de alago, empecé a sentir el peso de la responsabilidad que me ha bloqueado muchos días. Hasta que ayer noche rememoré la conversación telefónica que tuvimos; por lo que no voy a minimizarme y seguiré con mi estilo, como si escribiera para mi y espero que se comprenda y disculpe las formas.

En el blog de Jardín de ideas ya se ha escrito sobre optimización web, y probablemente en todos los blog del universo relacionados con el SEO, el Social Media y el Growth Hacking. Adelanto que yo mismo lo he hecho, pero tengo la sensación de que no se mira el WPO de un mundo global. De ahí esta entrada y éste será mi compromiso.

¿Qué es una WPO?

Cuando hablamos de optimización web automáticamente nos viene a la cabeza el tiempo de carga, que los indicadores se nos pongan por debajo de los 2 segundos. Incluso que nuestro código esté optimizado. Otras de las cosas que tenemos en cuenta es que se vea bien en dispositivos móviles y últimamente que mantengamos los tiempos aún colocando certificados SSL.

Todo ésto lo haremos poniéndonos el traje de matemático cuántico, con mirada extraviada en un mundo estadístico perfecto y observando el mundo real como si lo viéramos en déjà vu o a través de una ventana que nos muestra imágenes saturadas y sonidos reverberados o “acolchados”.

Ahora ya tenemos un portal de carga en menos de un segundo, vemos los indicadores de Google PageSpeed en verde con puntuaciones casi perfectas.

Vemos que nuestro trabajo en SEO y las acciones sociales e incluso las tácticas en promoción de contenidos están empezando a dar resultados en impacto. Déjame que te haga una pregunta.

¿Estás a gusto con cómo te muestras?

Pues ahí quería llegar, tenemos una web eficiente, rápida y posicionada que está proporcionándonos resultados, pero ¿hemos mirado el espacio con ojos de nuestros clientes?

A menudo aplicamos tácticas de optimización obviando las estrategias globales de branding, pensamos que la velocidad es más importante que la apariencia, pero me temo que para conseguir conversiones debemos agradar a nuestros clientes, que se sientan seguros y la experiencia de usuario sea completa, por lo que probablemente tengamos que hacer algunos ajustes y en algunos casos sacrificar algo de velocidad en detrimento del branding.

La WPO y el Branding

comprimir imágenesUnos de los primeros hándicap cuando combinamos branding y WPO se encuentra en el tratamiento de las imágenes. No voy a hablaros de los plugins en WordPress que nos ayudaran a eso y podéis encontrar literatura suficiente al respecto. Me voy a concentrar en el tratamiento de las imágenes justo antes de subirlas a nuestra web.

Adelanto diciendo que no soy usuario de Photoshop, ya que en mis equipos de desarrollo no disponemos de ordenadores con Windows ni Macintosh, usamos en exclusiva sistemas que corren sobre GNU/LINUX y el 100% de nuestro software está desarrollado para este Kernel.

Aún así reconozco el potencial, déjame decir impresionante, de una herramienta como Photoshop, aunque como se dice en los anuncios de Pirelli, “la potencia sin control no sirve de nada”.

Optimizar las imágenes, la clave de una WPO

Podemos disponer de las mejores herramientas, pero si no sabemos sacarles todo el “jugo” me temo que estamos desperdiciando el potencial.

Debes conocer la herramienta, y saber que las imágenes para webs deben comprimirse para conseguir una buena optimización. No puedo deciros lo que hay que hacer con este editor de imágenes pero debes conseguir que las imágenes sean muy, pero que muy ligeras.

Probablemente la primera decisión a tomar es el formato con el que debemos guardar las imágenes, ya se ha escrito sobre eso, pero quiero repetirlo ya que parece que no se acaba de comprender…

  • Imágenes en JPEG. Es formato fotográfico para web ( si comprimimos de manera adecuada).

     

  • Imágenes en PNG. Aunque podría parecer que es el sustituto de los JPEG, solo que acostumbran a ser más pesados, en defensa de este formato, es que permite el canal alfa (capa transparente) lo que nos admite buenos trabajos permitiendo que se vea el fondo.

     

  • Imágenes en GIF. Es el formato más austero, por lo pronto limita el número de colores que almacena, normalmente se usa en cosas pequeñas como iconos y posee la capacidad de contener canal Alfa (capa transparente), y es el único formato que admite una especie de animación (superposición de capas) muy popular de nuevo en las actuales redes sociales.

Recomendación final

Como recomendación general usaremos JPG para productos fotográficos incluidos sliders, con la comprensión adecuada obtendremos resultados espectaculares. Usaremos los PNG cuando precisemos que el fondo de nuestra web o widget no se interrumpa.

El uso de los Gif. queda a discreción del desarrollador, podemos hacer iconos eficientes o incluso cuando precisemos presentar animaciones sencillas.

Existen web que nos pueden ayudar a optimar imágenes sin pérdida o al menos con pérdida irrepetible al ojo humano, cómo podría ser el caso de Tinyjpg.com.

Ahora podemos saber qué formatos de imágenes y cómo optimizarlas.
Ya sabemos que podemos hacer lo necesario para seguir el plan marcado en nuestro branding por lo que vamos concentrarnos en la optimización de la experiencia de usuario.

Cualquier página o sección de nuestra web debe estar pensada para que los usuarios puedan disfrutar de los contenidos al tiempo de que sean eficientes para los fines de negocio que haya sido desarrollada.

Agradecimiento.

Miguel PujanteA estas alturas no va a ser Jardín de Ideas quien descubra a Miguel Pujante (Sherpa, instigador y agitador en social media) y al equipo de Desmárcate Ya!

Miguel es una de esas personas a las que un día conoces en la red y te atrapa; te seduce. Es un excelente profesional del medio y, además, un buen amigo. Siempre dispuesto a colaborar con los demás, apostando por crear fuertes lazos y sin pensar en el beneficio propio. En definitiva, una persona honesta de las que, por desgracia, hay pocas en este mundo en el que nos movemos.

Gracias Miguel por estar siempre ahí, listo para echar un cable. No olvidéis dar una vuelta por su página web y por su canal en Twitter, donde podréis comprobar la calidad de los contenidos que comparte.

 

Valoras este post?

Categories: Guest Blogger, Diseño Web /