Hola a todos, y gracias por visitar nuestro blog, en esta ocasión vamos a hablar sobre un tema importante en la vida de nuestra página web. Vamos a intentar a ver pequeños trucos para poder optimizar la velocidad de carga de nuestra WordPress y todo esto sin hacer uso de ningún tipo de plugins.
Recuerda que siempre recomendamos que cuando vallamos a trabajar en nuestra página web y necesitemos añadir nueva funcionalidad u optimizar procesos, que siempre que podamos lo hagamos sin hacer uso de plugins, ya que estos siempre suelen meter forraje en forma de ficheros de estilos o JavaScript que puede ralentizar la carga de nuestro proyecto.
Todos los códigos que vamos a facilitar para optimizar nuestra página web se agregaran en los siguientes ficheros que podemos encontrar dentro de nuestra instalación de WordPress: htaccess y functions.php.
Recuerda que antes de empezar recomendamos que sepas un poco de diseño web en WordPress, ya que estos cambios pueden afectar al funcionamiento de nuestro WordPress tanto a nivel visual como de funcionamiento y deberemos ser capaz de detectar esos errores que se puedan producir.
Porque es importante hacer WPO a WordPress
Las Web Performance Optimización (WPO), son las tareas que realizamos en nuestro proyecto para mejorar la velocidad de carga de nuestra página web y son necesaria por los siguientes motivos:
- Es un factor de posicionamiento SEO, Google penaliza negativamente los sitios lentos haciendo que aparezcan en los peores resultados de la SERP.
- Una página web lenta, hace que los usuarios abandonen esta en menos tiempo, por lo que las posibilidades de cerrar a ese cliente que visita nuestra página web se reducen considerablemente, sobre todo si tenemos un Comercio Electrónico.
- Un sitio web lento, provoca más caídas y errores de carga que uno más rápido
En esta guía voy a enseñarte todo lo que tienes que saber para optimizar la velocidad de WordPress y hacer que sea ultra rápido.
¿Cuáles son los motivos de que nuestro WordPress sea lento?
Pues son muchos los factores que hacen que nuestra página web sea lenta, vamos a destacar los siguientes:
- Una mala decisión a la hora de contratar nuestro hosting, como decimos desde Experto en Informática, el Hosting es en lo primero que no debemos escatimar recursos, ya que será un punto fuerte para que nuestro proyecto sea un éxito.
- El tema escogido, si este es de mala calidad o está poco optimizado, la probabilidad de que nuestra página web sea lenta aumenta considerablemente, lo ideal es un tema optimizado, con pocos ficheros CSS y pocos scripts.
- Los plugins que usamos, como hemos dicho antes, todo lo que podamos hacer sin hacer uso de plugins mejor que mejor, la instalación exagerada de plugins hará que aumenten la cantidad de ficheros a cargar y que la velocidad de nuestro proyecto decaiga, se vuelva más lento. Solo instala lo necesario para el funcionamiento de nuestra página web.
- Imágenes poco optimizadas, no adaptadas al hueco donde van puesta o muy pesada, que provocan que el peso de nuestra página web sea muy alto.
Ahora antes de empezar a explicar cada uno de los códigos que vamos a facilitarte para usar en tu página web, vamos a explicar para qué sirve el fichero htaccess y el fichero functions.php.
¿Qué es el fichero htaccess?
Este fichero es el encargado de guardar las directivas específicas de cada directorio de Apache Server. Se crea automáticamente a la hora de instalar WordPress en nuestro servidor. Se debe de tener mucho cuidado con la información que se borra y se copia en ese fichero, porque cualquier cambio puede provocar que nuestra página web no funcione, y se nos muestre un error por pantalla.
¿Qué es el fichero functions.php?
El fichero functions.php se encuentra dentro del tema que tengamos instalado en nuestra página web. En él se encuentra muchas de las funciones que se usaran en nuestro tema. También lo podemos usar para agregar nosotros funciones que queramos hacer uso en nuestra página web (shortcode, …).
Pues vamos a ponernos manos a la obra y a empezar a optimizar nuestra página web.
Optimizar imágenes para WordPress
Es importante que a la hora de elegir las imágenes que vamos a subir a nuestro proyecto, hagamos un uso de esta correctas, usemos el tamaño correcto a usar y reduzcamos un poco el peso de esta. También es importante que en la medida de las posibilidades la ofrezcamos comprimidas.
Para comprimir imágenes podemos hacer uso de servicios onlines que tenemos a nuestra disposición como pueden ser Compressor.io o programas que podemos instalar en nuestro ordenador como puede ser el caso de Photoshop.
Photoshop trae una función para guardar imágenes para páginas web, en la cual además del tamaño nos permite modificar la calidad de estas, esto nos ayudara a bajar el peso del fichero.
Si, ninguna de estas opciones es viables para ti, por no poseer los programas, por no contar con los recursos económicos para hacer uso de esos servicios externos o por falta de tiempo, recuerda que siempre podemos contar con plugins (a pesar de que hemos dicho que todo se haría sin hacer uso de plugins) que nos ayudan a realizar esta tarea por nosotros. El plugins para este caso que nosotros recomendamos es Smush.
Desactivar los emojis que trae WordPress por defecto.
Los emojis son los símbolos que utilizamos para mostrar en la SERP de Google, parece que poco a poco cada vez Google está prescindiendo más de ellos o simplemente nosotros no hacer uso de este porque no lo veamos necesario en nuestra web.
Es por ello que tenemos una forma fácil y rápida de desactivarlos de nuestra página web, para ello deberemos desactivar el script que carga WordPress en la cabecera de nuestra página web.
Para ellos podemos copiar el siguiente código en nuestro fichero functions.php
// Remover Emojis de WordPressremove_action('wp_head', 'print_emoji_detection_script', 7);remove_action('wp_print_styles', 'print_emoji_styles');remove_action( 'admin_print_scripts', 'print_emoji_detection_script' );remove_action( 'admin_print_styles', 'print_emoji_styles' );Desactivar el Cron de WordPress
El Cron de WordPress es un gestor de proceso que se ejecutan en segundo plano de forma automática sin que nosotros tengamos que hacer nada. Estas tareas se ejecutan cada cierto tiempo según la configuración que programemos nosotros.
El cron de WordPress viene a realizar más o menos la misma función que el cron de nuestro servidor, es por ello que podemos prescindir de este y hacer uso del otro, mejorando así las prestaciones de nuestro WordPress.
Para ellos vamos a desactivarlo en el archivo wp-config.php de WordPress con el siguiente código:
define('DISABLE_WP_CRON', true);Especificar la Cache del navegador
La cache del navegador sirve para ofrecer todos los recursos de nuestra web de una forma más rápida, provocando así disminuir la cantidad de recursos que necesitamos y mejorar la velocidad de carga de nuestro servidor.
La cache del navegador guarda la información en este, entonces cuando nuestros usuarios vuelven a visitar nuestra página web ya tiene precargado esta información, por lo que la carga de esta es más rápida.
Este sistema normalmente lo instalamos mediante plugins como pueden ser WP-Rocket o WP Supe cache, pero como hemos dichos arriba os vamos a enseñar a activarlo sin hacer uso de estos plugins.
El código que vamos a hacer uso ira instalado en el fichero htaccess de nuestra página web:
## EXPIRES CACHING ##<IfModule mod_expires.c>ExpiresActive OnExpiresDefault "access plus 1 week"ExpiresByType text/css "access plus 1 month"ExpiresByType application/atom+xml "access plus 1 hour"ExpiresByType application/rdf+xml "access plus 1 hour"ExpiresByType application/rss+xml "access plus 1 hour"ExpiresByType application/json "access plus 0 seconds"ExpiresByType application/ld+json "access plus 0 seconds"ExpiresByType application/schema+json "access plus 0 seconds"ExpiresByType application/vnd.geo+json "access plus 0 seconds"ExpiresByType application/xml "access plus 0 seconds"ExpiresByType text/xml "access plus 0 seconds"ExpiresByType image/x-icon "access plus 1 month"ExpiresByType image/vnd.microsoft.icon "access plus 1 month"ExpiresByType text/html "access plus 1 minute"ExpiresByType text/javascript "access plus 1 month"ExpiresByType text/x-javascript "access plus 1 month"ExpiresByType application/javascript "access plus 1 months"ExpiresByType application/x-javascript "access plus 1 months"ExpiresByType image/jpg "access plus 1 month"ExpiresByType image/jpeg "access plus 1 month"ExpiresByType image/gif "access plus 1 month"ExpiresByType image/png "access plus 1 month"ExpiresByType image/svg+xml "access plus 1 month"ExpiresByType image/bmp "access plus 1 month"ExpiresByType image/webp "access plus 1 month"ExpiresByType audio/ogg "access plus 1 month"ExpiresByType video/mp4 "access plus 1 month"ExpiresByType video/ogg "access plus 1 month"ExpiresByType video/webm "access plus 1 month"ExpiresByType text/plain "access plus 1 month"ExpiresByType text/x-component "access plus 1 month"ExpiresByType application/manifest+json "access plus 1 week"ExpiresByType application/x-web-app-manifest+json "access plus 0 seconds"ExpiresByType text/cache-manifest "access plus 0 seconds"ExpiresByType application/pdf "access plus 1 month"ExpiresByType application/x-shockwave-flash "access plus 1 month"ExpiresByType application/vnd.ms-fontobject "access plus 1 month"ExpiresByType font/eot "access plus 1 month"ExpiresByType font/opentype "access plus 1 month"ExpiresByType application/x-font-ttf "access plus 1 month"ExpiresByType application/font-woff "access plus 1 month"ExpiresByType application/font-woff2 "access plus 1 month"ExpiresByType application/x-font-woff "access plus 1 month"ExpiresByType font/woff "access plus 1 month"</IfModule>## EXPIRES CACHING ##Como detener el HeartBeat de WordPress
El HeartBeat es como un pulso que emite WordPress cada cierto tiempo para tener una comunicación fluida entre el servidor y el panel de administración, esto sirve para poder hacer uso de funcionalidades, que en el caso de que seamos programadores, puede resultar muy interesante.
Toda esta comunicación se realiza a través del fichero admin-ajax.php que podemos encontrar con la instalación de WordPress. Este fichero se encarga de realizar llamadas Ajax al servidor cada cierto tiempo (normalmente cada 15 segundos).
HeartBeat es el encargado por ejemplo de auto guardar una página que estamos editando, si en el caso de que se bloquee por ejemplo el navegador, cuando volvamos a entrar no hayamos perdido partes de los cambios que hemos realizado.
El problema de esto radica en el número de conexiones que realiza con el servidor, hay gente que no necesitan que continuamente se realice esas conexiones que gastan muchos recursos de nuestro servidor.
Si tienes muy claro que no quieres saber nada del HeartBeat de WordPress y quieres desactivarlo, pero no quieres tener que instalar un Plugin para esto, puedes hacerlo de manera manual. Este código que necesitamos y que debes de copiar al fichero functions.php de nuestro tema es el siguiente:
add_action( 'init', 'stop_heartbeat', 1 );function stop_heartbeat() {wp_deregister_script('heartbeat');}Como desactivar los pingbacks en WordPress
Los pingbacks son un método de notificación que trae WordPress por defecto, se usa para avisar al administrador de WordPress que lo están enlazando desde un sitio externo a nuestra página web.
Para poder verlos, podemos hacerlo desde los comentarios de una entrada o haciendo uso de algún widget que tengamos instalado en nuestra página web.
Estas notificaciones pueden desactivarse de forma manual haciendo uso del siguiente código que os dejamos, el cual al igual que antes, va en el fichero functions.php de nuestro tema.
function disable_pingback( &$links ) { foreach ( $links as $l => $link ) if ( 0 === strpos( $link, get_option( 'home' ) ) ) unset($links[$l]);}add_action( 'pre_ping', 'disable_pingback' );Conclusiones
Como hemos podido ver, siguiendo unas reglas básicas podemos hacer que nuestra web realizada con WordPress está optimizada, repercutiendo en experiencia de uso de nuestros visitantes y consumiendo menos recursos para su funcionamiento.
