¿Te gustaría saber cómo mejorar la velocidad web como si fueras un auténtico profesional? En ese caso este post te ayudará mucho en esta tarea ¿quieres saber por qué? Sigue leyendo.
¡Muy buenas! Volvemos de nuevo con un temita muy caliente. En el momento que queremos tener un blog ( y a ser posible exitoso), debemos tener muchas cosas en cuenta, entre ellas la velocidad web: uno de los aspectos más olvidados de la mayoría de bloggers y webmasters.
Y digo esto, porque generalmente nos solemos centrar en crear buenos contenidos, poner una plantilla atractiva y hacer SEO.
Eso está muy bien, de verdad, de hecho esto te lo llevo diciendo mucho tiempo. Pero ¿de qué sirve escribir buenos contenidos, tener una buena plantilla y hacer SEO si luego la velocidad de tu web es muy lenta? Pues la respuesta es sencilla: no te servirá absolutamente de nada.
Además, si nos centramos en el término SEO en estado puro, la velocidad web es uno de los aspectos fundamentales. Es uno de los 200 factores que Google tiene en cuenta. Entonces ¿no crees que vale la pena invertir tiempo en esta tarea tan importante?.
Vale Jony muy bien, pero ¿qué cojones hago si no tengo ni idea de esto?.
Pues hoy vas a aprender muchas cosas, te lo aseguro. Pero no te las voy a decir yo, sino Edmundo Perez.
A Edmundo lo conozco desde hace ya algunos años y es compañero mío en uno de los servicios que tengo en este blog: el de montar webs.
Edmundo es experto en WordPress y hoy te lo va a demostrar con creces con este super post que ha hecho.
Al final del post si quieres ponerte en contacto con él, te daré las direcciones pertinentes para que lo puedas hacer sin problema alguno.
No te quiero hacer perder más tiempo y te dejo con él. Espero que sus consejos te sirvan de utilidad.
Escribiendo Edmundo….
Desesperante, ¿verdad? Cuando visitas una página y carga muy lentamente, tanto, que dan ganas de lanzar el ordenador por la ventaja.
Segundos pasan y no aparece nada en el monitor, y comienzas a preguntarte si el blog o página sigue aún con vida.
Cuando responde, ves cómo aparece en trocitos… es una tortura.
Cuando finalmente carga, estás ya tan molesto, que solo ojeas el contenido, sin leerlo, y te marchas, para no volver.
Después de ésta experiencia, cualquier bloguero que se precie, no permitiría que su blog fuese tan lento.
Pero antes de seguir, hazte una pregunta: ¿y si ésto es lo que exactamente sienten tus lectores cuando visitan tu blog?
Sí, tu blog. ¿Cómo te sentirías? Ser el dueño del blog más lento del país. Lo mejor es averiguarlo.
Te contaré cómo…
Índice
- 1 Los efectos psicológicos de una web lenta
- 2 Ojo: la lentitud de tu blog puede estar oculta a tu vista
- 3 Mide la velocidad de tu blog con GTmetrix
- 4 Cómo hacer que tu velocidad web sea más rápida
- 5 Da a tus visitantes la experiencia que merecen
Los efectos psicológicos de una web lenta
¿Alguna vez has ido a una oficina de servicio al cliente y te ponen a esperar? Esperas en el sillón, moviendo los dedos tal como Homer Simpson hace, lees, miras todo alrededor, mientras los minutos pasan.
A medida que pasa el tiempo, es probable que hayas olvidado lo que ibas a hablar, y solo te concentras en la frustración que crece mientras esperas. Cuando al fin te responden, no estás más que enfadado por haber esperado tanto tiempo.
Con los blogs pasa lo mismo. Un sitio web lento, es un mal servicio al cliente. Si tu cliente espera a que tu blog cargue, sin más propensos a frustrarse e irse para no volver.
Un blog rápido, da a los lectores una buena experiencia desde el principio, y navegarán dentro de tu blog, con una actitud contenta y relajada.
¿Por qué Google odia a los sitios lentos?
Además de ser un punto negativo a tus lectores, Google decidió castigar hace algo más de un año a sitios lentos por su pobre rendimiento. ¿Por qué?
Implica un pobre rendimiento, especialmente para los dispositivos móviles ya que sus redes no son tan rápidas o fiables como las de una conexión fija en un ordenador de escritorio. Como seguramente sabes, el número de dispositivos móviles con conexión aumenta constantemente, por lo que es clave para que los lectores nos lean adecuadamente.
Ojo: la lentitud de tu blog puede estar oculta a tu vista
Puede que el blog cargue correctamente para ti, pero eso no es garantía.
De hecho, varias razones pueden causar que tu blog vaya mejor para ti que para tus visitantes. Por ejemplo:
- Tu navegador ya ha almacenado en caché las imágenes que otros tienen que descargar
- Tu servidor puede estar geográficamente más cerca de ti que de tus visitantes
- Tu conexión sea más rápida que la de tus lectores
Además, hay un factor importante: la percepción. Los nuevos visitantes, que no conocen tu blog, son más conscientes del rendimiento de tu blog, ya que no están predispuestos a nada.
Por eso, ir a ciegas es lo peor que puedes hacer. Lo primero que debes hacer, es medir la velocidad real de tu sitio.
Mide la velocidad de tu blog con GTmetrix
Es clave medir, si no sabes si tienes o no un problema y qué tan grave es, es tonto tomar medidas.
La mejor herramienta (por encima de Google Page Speed) para medir la velocidad real de tu blog, es GTmetrix.
Lo que GTmetrix hará es medir elemento por elemento la velocidad de tu sitio, y te dará un informe a fondo. ¿Cómo generar el informe, sencillo:
- Ir a la página de GTmetrix
- Pegar la URL de blog
- Hacer clic en “Analize”
- Esperar unos segundos
- Ver el informe y recomendaciones
Aquí te presento el informe de mi blog, para que veas un ejemplo:
Para que comprendas el informe, ésta es la información que te da:
- PageSpeed Score: Es la calificación de Google Page Speed. A es la mejor nota, y F la peor. La flechita califica tu velocidad respecto a la media, puede ser superir o inferior a la media.
- YSlow Score: Es la calificación que da Yahoo, y la flecha indica lo mismo que el punto anterior.
- Total Load Time: es el tiempo que un usuario medio tarda en ver completa tu página. Si pones el cursos en la flechita, te dirá el tiempo de carga promedio de las páginas web
- Total Page Size: Es el tamaño total de la página. Cuanto más grande, más lenta.
- Requests: Es el número de peticiones (archivos, CSS, peticiones HTML, etc) necesarios para cargar la página. Cuantas menos tengas, más rápido irá tu sitio web.
En la parte inferior, verás una tabla enorme, son las recomendaciones para incrementar la velocidad de carga de tu blog.
Es una tabla fácil de entender tales como optimizar imágenes, caché del navegador, etc. Las cuestiones que son más urgentes aparecen en la parte superior de la tabla, para no tener que buscar entre todos los datos.
Si pones el cursor en la flecha, te dará una explicación de cada tema y las áreas problemáticas específicas (eso sí, en inglés)
GTmetrix es una de las mejores herramientas disponibles para las pruebas de velocidad y el rendimiento de tu sitio web, pero no es su única opción – hay más herramientas libres tales como PageSpeed Insights (de Google) y Pingdom, siendo excelentes opciones.
Cómo hacer que tu velocidad web sea más rápida
Si los resultados no son buenos, y no sabes interpretar bien los resultados, te daré una guía básica para que tu blog vaya más rápido. Aclaro que son acciones enfocadas totalmente a WordPress. Blogger tiene la ventaja de que Google se encarga de casi todo. Vamos a ello.
Optimiza las imágenes de tu blog
Comienzo con las imágenes porque son las culpables casi de todas las páginas web lentas que encuentres, y quizá sea también tu caso. Nadie pone atención a ésto, todo el mundo descarga la imagen y la sube sin más, pero debes trabajar más en ellas.
Paso 1: Elige el formato adecuado
Lo primero es elegir el formato de archivo adecuado. Si usas fotografías, usa el jpg, si la imagen viene con muchas palabras, usa el png, y animaciones, gif. No uses todo en un solo formato.
Paso 2: Recorta la imagen
En ocasiones no necesitas la imagen completa: recórtala. Además de reducirla de tamaño, te ayudará a centrar la atencion en lo que tu quieres, sin que el fondo de la imagen lo diluya. Te pongo un ejemplo:
La mejor herramienta que puedes usar, es Gimp, es una herramienta similar a Photoshop, pero de código libre, y que tiene muchas funciones, entre ellas, la de recortado.
Paso 3: cambia el tamaño de las imágenes
Muchas veces, luego del recortado, las imágenes suelen ser muy grandes para tu blog. De nada sirve tener una imagen de 3000 píxeles de ancho, cuando solo necesitas mostrar 600 pixeles. Además ralentiza el blog y consumes muchos recursos de tu hosting.
WordPress intenta resolver el problema eligiendo un tamaño menor si tu imagen es muy grande. Lo ves cuando insertas una imagen:
Si no quieres usar esta herramienta, lo que recomiendo mucho (no reduce el tamaño del archivo), además de Gimp, son otras herramientas online que pueden ayudarte como por ejemplo Pixlr, Fotoflexer o PicMonkey.
Paso 3: Comprime tus imágenes
El siguiente paso es reducir aún más su tamaño eliminando información innecesaria, que no percibe el ojo humano, pero que reduce el tamaño del archivo considerablemente, sin que pierda la calidad visual.
La labor se hará en dos pasos.
El primero es pasar la fotografía por la TinyJPG. Es un servicio online, basta con arrastrar la imagen y no necesitas hacer más, la página por sí misma comenzará a comprimir la imagen. Éste es el resultado:
Como ves, la imagen que subí, redujo su tamaño en un 65% su tamaño, sin perder su calidad.
Y el segundo paso, es instalar un plugin que reduzca automáticamente el tamaño de tus imágenes dentro de WordPress. Te recomiendo instalar el plugin EWWW Image Optmizer, que reduce el tamaño de las imágenes, es gratuito y no tienes limitaciones.
Minimiza el tamaño de los archivos CSS y JavaScript
Una recomendación de GTmetrix y muchos similares es la de “minificar” los archivos JavaScript y CSS de tu blog. Éstos archivos junto con el código HTML y las imágenes, constituyen todo el aspecto visual de tu blog.
Minificar éstos archivos signfica hacerlos más pequeños, entre otras cosas, reduciendo el espacio en blanco que hay en los archivos. Además, cada vez que el servidor solicita su contenido, se hace una petición nueva, si tienes varios CSS y JavaScript, la carga aumentará, y tu sitio irá más lento.
Existen dos plugins que te recomiendo que pruebes, así no te complicarás con códigos: WP Super Minify y Better WordPress Minify
Habilita el caché, compresión GZIP y reúne los archivos CSS y JavaScript
Los plugins de almacenamiento en caché son una de las maneras más eficaces para mejorar la velocidad de tu blog.
Normalmente, cada vez que alguien solicita una página de su sitio web, el servidor genera dinámicamente la página HTML desde cero utilizando código del núcleo de WordPress y el tema de su sitio. Pero la cosa es que el HTML a menudo sigue siendo el mismo en cada petición
El almacenamiento en caché es el proceso de entrega de versiones estáticas de archivos HTML a sus visitantes en lugar de crear de forma dinámica cada vez. En esencia, se crean los archivos de una vez y se almacenan una copia. Esto disminuye la cantidad de llamadas realizadas a su servidor, reduce la carga del servidor, y reduce los cuellos de botella.
Los mejores plugins de almacenamiento en caché también tienen otras características relacionadas con el rendimiento, como la minificación, lo que significa que no tendría que usar un plugin como los que te mencioné antes.
Éstos son algunos de los mejores plugins de WordPress para el almacenamiento en caché, recuerda que debes utilizar solo uno, para evitar conflictos:
Junto con el plugin que eligas (recomiendo WP Super Cache), añade el plugin WP Performance Score Booster, ya que es totalmente compatible con la mayoría de plugins.
Identifica los plugins que más recargan tu blog
Como bien sabes, los plugins son extensiones añadidas a tu instalación de WordPress que constituyen programas en sí mismos, añadiendo funciones a tu blog. Un plugin añade carga a tu blog.
Es un enemigo oculto de los blogs, pues un solo plugin mal codificado, o mal configurado, hará que tu blog sea más lento que una tortuga.
Éstas son las tres causas que ralentizan los blogs:
- Añaden peticiones al servidor añadiendo código o peticiones
- Añaden peticiones y datos a la base de datos del blog
- Crean incompatibilidades entre plugins
¿Cómo saber qué plugin ralentiza tu blog? Sencillo, usando otro plugin, el llamad P3. Éste plugin examina el porcentaje de influencia en la carga de tu blog de cada plugin.
Éstos son los pasos:
- Instala y activa el plugin P3.
- Ir Herramientas -> P3 Plugin Profiler
- Haz clic en “Start Scan” y luego en “Auto Scan”
- Espera a que termine el escaneo y haz clic en “View Results”
- Observa el informe en forma de gráfica de tarta
El resultado que tendrás es éste:
Éste es el análisis de mi blog: 34 plugins, 0.8 segundos, y dichos plugins influyen en un 59% en el tiempo de carga. La gráfica me dirá qué plugins son los que retardan mucho más la carga de tu blog. Toca analizar y elegir qué plugins cambiar o quitar de tu blog.
Pero no te fíes totalmente, hay falsos positivos, por ejemplo Jetpack de WordPress.
Cuando veas que un plugin retarda la carga, desactívalo y vuelve a escanear con el P3. En ocasiones el problema es una incompatibilidad.
Eso sí, el mito de que los plugins ralentizan, es mentira, yo he usado hasta 50 plugins sin que me afecte en la carga.
Cuando hagas éste procedimiento, ve de nuevo a GTmetrix para ver cómo mejora la velocidad de carga.
Da a tus visitantes la experiencia que merecen
El rendimiento de los sitios web es un tema amplio, y ésto es solo la superficie, y para obtener resultados rápidos. Podría escribir otras 2000 palabras al respecto, pero dejarían a Jony sin visitas.
Por ahora, ya sabes lo suficiente como para saber cómo mejorar la velocidad web, y déjame decirte, para terminar éste enorme artículo, que es un proceso que jamás se termina.
Si tienes dudas o problemas, no tengas reparo en enviarme un correo, haré lo posible por ayudarte.
De nuevo soy Jony, telita con el post. Información al 100%. Seguramente estas cosas ni te las habías planteado ¿verdad? Creo que con este post queda más que claro que tener un blog optimizado, rápido y que proporcione una buena experiencia de usuario no solo basta con escribir buenos contenidos y tener una plantilla atractiva. detrás hay un trabajo intenso, minucioso y que, además, esto nos obliga a pensar en que una buena alternativa es conocer, aunque sea un poquito, lenguajes tipo HTML y CSS, ya que seguramente ayudará para mejorar el rendimiento y la velocidad de la carga web.
No obstante, si tienes dudas e incluso si quieres sus servicios puedes hacerlo desde aquí.
¿Te ha sido útil las explicaciones de cómo mejorar la velocidad web?
Posts relacionados que pueden ser de tu interés:
Otros artículos interesantes:
HAZLE UN REGALO A TU BLOG
SE DESPIDE DINEROENTUWEB
Wordfence Security, un plugin que vale la pena
Premium SEO pack: el plugin definitivo
COMO INDEXAR MI BLOG O WEB (1º Parte)
h1, h2 y h3: Cómo utilizar correctamente los encabezados en WordPress
Cómo salir de un baneo en Google Adsense
GOOGLE GLASS YA TIENE PLUGIN EN WORDPRESS
¡Que pedazo de post! Desde luego, si después de leer y aplicar todos estos consejos la web sigue lenta, es porque algo gordo falla.
Un trabajo espectacular. Gracias a los dos.
Hola Fran
Si luego de todo ésto tu blog va lento, es tiempo de pensar en cambiar de hosting, porque quizá sea ese el problema de la lentitud.
Un saludo grande!!!
Hola Fran,
La verdad es que Edmundo se ha currado un post increíble. Espero que te ayude sus conocimientos 🙂
Un abrazo!
Todavía no somos conscientes de la importancia de este factor para los teléfonos móviles. Si ya tenemos poca paciencia en un ordenador de mesa, en un teléfono móvil apenas tenemos ninguna.
Hola Jerby.
El otro día leí a un bloguero que la gente no espera más de 1.5 segundos una página, recuerdo cuando estaba chaval, en la universidad, las conexiones por teléfono ver cómo cargaba todo en barras lentamente… cómo nos hemos vuelto. Un saludo
Hola #Jerby,
La paciencia no es una virtud que tenga precisamente el humano. Menos mal que eres un ratón y de esas cosas no entiendes jeje
Un abrazo
Me ha encantado esta entrada. Información detallada total y eso que dice Edmundo que solo ha tocado el tema de forma superficial.
enhorabuena por los dos
Hola Manel, gracias por tu comentario.
Es superficial, porque solo fue optimizar un poco las imágenes y el caché, no he tocado nada de la consola del servidor, tiempo de respuesta de tu hosting, optimizar el VPS, tipografías, etc.
Espero te ayude, si tienes dudas o problemas con tu web, no dudes en contactarme.
Hola Manel,
Imagínate si llega a profundizar sobre el tema, sería caso un libro 🙂
Un abrazo
No seáis tan malos con los fans de Blogger que ellos no se meten con vosotros, jeje.
Yo no soy ni de uno ni de otro y siendo sincera no uso plugins y apenas lo he echado de menos. Si no tienes conocimientos técnicos, meter tanta cosa como aquí explica Edmundo no sé si al final acabamos cargándonos algo 🙂
Como no sepas código, no sé yo…
Un abrazo 🙂
Hola Carolina… yo no me he metido on los de Blogger, ha sido Jony, fíjate.
Espero te haya ayudado a tener una idea sobre todo el rollo de la velocidad de un sitio web.
Sí, claro, después de mil años leyendo me sonaba alguna cosa, pero he aprendido más, ha sido un gran artículo.
Lo de las imágenes además es algo que todo el mundo puede aplicar.
Un abrazo 🙂
Hola Carolina,
Yo soy el culpable, he sido yo quién ha dicho eso de Blogger jejej. Es que es lo que pienso y no lo puedo evitar, si no lo decía reventaba jajaja
Un besote
Hola Jony y Ed,
qué post más útil y cuántas recomendaciones.
Me ha faltado tiempo para ir al GTmetrix jejeje y lo de comprimir las fotos me viene de perlas porque ese es uno de los puntos en los que tengo que mejorar.
Un abrazo a los dos
Hola Erika,
Lo de las imágenes es uno de los errores más comunes de la mayoría de bloggers y webmasters. Además, hay un dato más que quiero añadir yo que son los contenidos duplicados a través de las imágenes. Pero será un tema que ya tocaré con más profundidad 🙂
Un besote!
Pues sí, estará bien que salga este tema. Yo así de entrada no me lo imagino.
Hola guera.
Pues gracias por comentar… ya te diré luego qué situación está tu blog.
Un saludo
Enhorabuena por los dos, Gran entrada.
Tengo una duda. En la respuesta que ha hecho Edmundo a Fran, dice que si después de todos estos estudios aún la web sigue lenta quizás sea por el hosting ¿no hay una forma de saberlo directamente para evitar tantas horas de trabajo? Lo comento porque deduzco que estos estudios implican una buena inversión de tiempo. Espero que esta duda que tengo me aclaréis.
Gracias.
Hola Ainhoa.
Buena pregunta. Primero que nada, lo más que te puede llevar ésta guía es una hora, y se hace automáticamente, es decir, solamente indicas acciones, no creas que estarás sentada todo el día.
Lo otro: lo mejor es consultar con la empresa de hosting páginas que estén alojadas con ellos y qué tipo de servidor usan, muchas páginas ponen casos de éxito. Lleva esa páginas a gtmetrix y revisa si la lentitud es por las imágenes o caché, que es depende del cliente, o por el tiempo de respuesta del servidor.
Si ves que carga en 5 segundos, y qe el tempo de respuesta del servidor es más de 1 o 2 segundos, ese hosting no te conviene.
Si tienes más dudas, envíame un correo con gusto te ayudaré.
Hola Ainhoa,
Creo que Edmundo te ha contestado de forma sublime. Espero que te haya resuleto la duda y, si no es así, ya sabes, ponte en contacto con él 🙂
Un besote
Enhorabuena a los dos por este artículo tan útil e interesante!
No he podido evitar la curiosidad y he analizado la web, y por lo que he visto sólo tengo que realizar un par de mejoras, cómo es la caché y revisar las imágenes, que era lo que imaginaba que saldría. Si tengo tiempo lo haré esta semana, aunque procuraré no agobiarme, que llevo una semana tras el cambio de plataforma con el blog que alucináis 😉
Un besito
Hola Nika (me suena a nombre de manga japonés jeje)
Espero tengas éxito en tu blog, te quedo muy chulo el diseño, de vez en vuando te vistaba antes, ya sabes, a veces uno necesita buscar positivismo, algo que tu blog tiene.
Una idea: por qué no usas ésta tipografía para tu logotipo? http://befonts.com/magnolia-sky-font.html Es preciosa y queda con el look zen que tiene tu blog.
Un saludo
Hola Nika,
Me alegro que te haya gustado el post, ya has visto que en estos temas Edmundo es un crack. Y digo esto, porque acabo de leer tu mensaje de Facebook. Ponte en contacto con Edmundo en el link que he puesto en el post y seguro que el te ayudará mejor que yo.
Un besote
¿Puedo sugerir que también añadir a esta lista https://shortpixel.com/online-image-compression
Hola John,
Acabo de ver la herramienta y parece muy útil.
¡Muchas gracias!
Muchas gracias por el artículo!!!
En Internet todo va muy rápido. A todos nos gusta llegar a una web y que no tengas que esperar a que cargue, sobre todo cuando accedemos desde un dispositivo móvil. Cuesta mucho atraer visitantes a nuestra web para que luego se marchen sin haber visto lo que ofrecemos. Una web lenta puede hacernos perder muchos clientes y por tanto dinero.
Hola, saludos desde Talayuela!
Sí, es una pena, por eso creo que a veces nos obsesionamos con el SEO sin prestar atención a la plataforma.
Un saludo
Hola posicionamiento web Extremadura.
Edmundo te a contestado, pero quiero añadir que la velocidad es importante para que el usuario tenga una buena experiencia. Es una de las mejores formas de captar clientes para los negocios.
¡Saludos!