miércoles, 10 de febrero de 2016

Mega Tutorial de WP-Doctor: cómo comprobar si tu blog WordPress está al 100% de rendimiento

Por: Pablo Velasco
wpdoctor webempresa

Este es un post de invitado de Webempresa.

Cuando creamos una Web en WordPress, además de disponer de unos contenidos interesantes y prácticos para ofrecer a los visitantes de nuestra web, debemos cuidar otros elementos como

  • La seguridad
  • Una correcta configuración para mejorar el posicionamiento en los buscadores
  • Una velocidad de carga lo más rápida posible.

Esto es imprescindible para conseguir más visitas a través de Google y hacer que pasen más tiempo en la web.

Todo esto puede parecerte un mundo, pero no lo será tanto con WP Doctor.es.

¿Qué es WP Doctor? Una herramienta online gratuita que analiza tu WordPress a fondo, dando información punto por punto para mejorar en todos los aspectos anteriormente mencionados.

¿Y cómo se usa? Vamos a ver aquí un caso real de análisis de una web creada con WordPress y alojada en el hosting de Webempresa para que veas cómo funciona.

Revisión de una web paso por paso con WP Doctor

Antes de empezar, un consejo: realiza una copia de seguridad completa de tu web por si se producen errores tras los cambios aplicados y no sabes cómo deshacerlos. Puedes hacer el backup de forma manual (archivo y base de datos) o utilizar algún plugin como XCloner.

Comenzaremos realizando un análisis para ver el resultado inicial y revisar las recomendaciones que nos propone WP Doctor para mejorar nuestro WordPress.

Después aplicaremos las mejoras y, finalmente, haremos un nuevo análisis para ver el resultado final.

¡Vamos con ello!

wpdoctor1

#1 Iniciando el análisis

Desde la página de inicio de WP Doctor ponemos la url de la web http://ift.tt/1Sil2qD y pulsamos en el botón para analizar la web.

Esperamos unos segundos para que finalice el análisis y podremos ver el resultado con una puntuación final y un desglose de cada uno de los apartados.

En el ejemplo obtenemos lo siguiente:

wpdoctor2

 

Nos da un resultado de 60 sobre 100, que no es demasiado bueno.

Tenemos que ponernos las pilas y mejorar algunas cosas.

Además, se muestra un desglose por apartados, con los detalles que tenemos que mejorar.

En muchos casos no podremos aplicar de forma directa todas las mejoras que se proponen, ya que pueden depender de la propia configuración del servidor, pero tendremos que intentar hacerlo con cada una de ellas.

Vamos ahora a realizar un repaso a los resultados que me da en cada apartado, indicando lo que significa cada punto analizado y aplicando las correcciones necesarias. No entraré en demasiados detalles para no extenderme demasiado.

Si necesitas más información puedes utilizar los botones “Más info” o “Cómo arreglarlo” que se muestra para cada punto.

#2 Analizándo el “Resumen de Página”

Nos muestra una información sobre el título y descripción de la página, así como la versión de WordPress que estamos utilizando y el charset. Revisemos cada uno de los puntos.

  • Titulo: es el título de la página. Muy importante que sea el adecuado para nuestro negocio. Se recomienda que tenga una longitud de entre 20 y 60 caracteres. Se configura desde Ajustes > Generales o desde la propia configuración de la página.
  • Descripción: otro elemento muy importante, ya que se usará en la descripción que muestra Google en su página de resultados. Lo adecuado es no superar una longitud de 156 caracteres y que esta descripción explique de forma resumida a qué nos dedicamos. Recomiendo para configurar esto usar el plugin WordPress SEO by Yoast (si no lo tienes, ya estás tardando en instalarlo). De esta forma, en todas las páginas y entradas de nuestro WordPress dispondremos de un apartado donde podremos configurar el título y la descripción meta.
  • Versión: indica la versión de WordPress que tenemos instalada. Por seguridad, deberíamos tener siempre la última disponible, a menos que haya una razón de fuerza mayor que nos impida tenerla.
  • Charset: verifica si estamos indicando la codificación del texto. A priori, no deberíamos preocuparnos si no superamos este punto en WP Doctor, siempre y cuando no se muestren caracteres extraños en la web (por ejemplo, si no puede cargar los acentos).

En el ejemplo obtenemos lo siguiente:

wpdoctor3

Le añado una descripción a la home editando la página que tengo asociada con el inicio de la web. Utilizo para ello el WordPress SEO. Respecto al charset, como ya veo bien los caracteres de la página, no cambio nada.

#3 Apartado “WordPress”

Se analizan diversos temas relacionados con WordPress. En primer lugar se evalúa el tema que tenemos activado, mostrando información sobre el mismo. Veamos algunos puntos destacados:

  • Versión HTML: lo recomendable sería que fuera HTML 5, en caso contrario sería indicativo de que el tema que estamos usando usa una tecnología algo anticuada.
  • Diseño adaptable: se podría considerar irresponsable utilizar un tema que no se adapte a dispositivos móviles o, que al menos, disponga de una versión específica para móviles, teniendo en cuenta que cada vez más usuarios utilizan una tablet o un smartphone para acceder a internet.
  • Uso de CDN: un CDN es un servicio que nos permite cargar los contenidos estáticos de la web (imágenes, archivos javascript y CSS, etc.) desde un servidor externo o, al menos, de forma paralela al resto de la página. De esta forma se puede conseguir una carga más rápida. Aunque es recomendable, no es imprescindible, y hay que ser cuidadosos a la hora de configurarlo, porque podemos provocar que la web deje de cargar de forma correcta.

NOTA: Si tu plantilla no se adapta a dispositivos móviles te recomiendo encarecidamente que la cambies ya.

#4 Revisando los plugins de WordPress

A continuación se revisan los plugins que tenemos instalados en WordPress.

Es importante tener en cuenta que no se revisan todos los plugins que tenemos instalados (eso no se puede saber analizando una web a la que no se tiene acceso), sino que se comprueba si existen una serie de plugins a partir de un listado. En el listado se mostrarán los plugins detectados y se indica si están actualizados o no.

Es importante que tengamos actualizados nuestros plugins a la última versión, ya que en muchas ocasiones estas actualizaciones se realizan para corregir agujeros de seguridad.

Además, se comprueba si tenemos instalado algún plugin de caché.

De no ser así, es recomendable que añadas alguno, ya que mejorará la velocidad de carga de la web, en especial si tenemos muchas visitas. Los 2 plugins de caché más recomendables serían W3 Total Cache y WP Super Cache.

En el ejemplo obtenemos lo siguiente:

wpdoctor4

Mis acciones a aplicar:

  1. Me muestra el mensaje de que no tengo CDN, pero no voy a configurar ninguno (no es algo tan importante).
  2. Veo que me indica que el plugin Yoast SEO (WordPress SEO) no está actualizado. Lo actualizo y de paso compruebo que me queda algún plugin más pendiente de actualización.
  3. No tengo un plugin de caché. Voy a instalar el W3 Total Cache. En el propio blog de WP Doctor puedes encontrar instrucciones sobre cómo configurar W3 Total Cache.

 #5 Chequeo al Servidor

Aquí se evalúan diversos aspectos relacionados con el servidor donde tenemos alojados nuestro WordPress.

Son temas que, en su mayoría, nosotros no podremos arreglar de forma directa aplicando cambios en la configuración de la web, pero sí habrá que tenerlos en cuenta para ver si hemos elegido el servicio de hosting adecuado.

  • HTTP Status: indica la respuesta HTTP que se ha obtenido al solicitar la página. Lo correcto sería obtener un valor 200, o 2XX (un 2 seguido de otros números). Otros valores podrían indicar que la página no se está cargando correctamente.
  • Server: tipo de servidor web que se está utilizando.
  • Núm. Redirecciones: número de redirecciones que se hacen hasta que la página llega al navegador. Lo correcto sería tener un 0.
  • Cabecera Content-Type: cabecera que indica la codificación que se utiliza para los texto, normalmente UTF-8.
  • Otras cabeceras: serían el resto de cabeceras (no visibles de cara al usuario) que se cargan con la web. Como veremos más adelante, podremos añadir nuestras propias cabeceras para aumentar la seguridad.
  • Dirección IP: sería la dirección IP desde donde carga nuestro WordPress.
  • País: país asociado con la dirección IP anterior. Lo recomendable es que este país sea el mismo que el de los potenciales visitantes de nuestra página, ya que esto puede mejorar algo el posicionamiento de la web en los resultados de búsqueda para ese país, aunque tampoco sea determinante.
  • Tiempo de conexión: tiempo que se ha tardado en establecer la conexión entre nuestra web y el servidor.
  • Tiempo de resolución DNS: tiempo empleado en asociar nuestro dominio con la IP del servidor desde donde carga WordPress.
  • Velocidad de descarga: velocidad a la que se ha descargado el contenido de la página.
  • Tiempo total: mide el tiempo empleado en cargar toda la web.

En el ejemplo obtengo lo siguiente:

wpdoctor5

Veo que me sale el país España asociado con la IP del servidor. Como en mi caso la mayor parte de los visitantes potenciales de la web van a llegar procedentes de España, esta ya sería la mejor opción.

#6 Seguridad de mi web

En este apartado se evalúan diversos temas relacionados con la seguridad, con el fin de mantener nuestro WordPress protegido de malhechores.

Hay que tener en cuenta que la seguridad de un WordPress no se limita a los puntos que se analizan en WP Doctor.

Aunque los pases todos siempre es posible que sufras un ataque.

NOTA: Recuerda mantener siempre actualizado tu WordPress y los plugins instalados, ya que es un punto clave.

  • Google SafeBrowsing: verifica si tu web está en el listado de sitios no seguros de Google. Si sales en esta lista tienes un problema muy gordo, ya que sería indicativo de que tu web trata de instalar software malicioso o está haciendo phishing (suplantar la identidad de otra web con fines lucrativos). Es decir, te han hackeado. Si tienes un backup anterior al problema, tendrías que restaurarlo o tratar de arreglar los problemas modificando el código, aunque esto puede llegar a ser complicado. Recuerda: haz copias de seguridad periódicamente y mantenlas a salvo fuera del servidor.
  • Expose PHP: indica si se puede averiguar la versión de PHP que se está ejecutando en tu cuenta de hosting. Es importante que no se pueda saber, ya que se puede aprovechar este dato para lanzar ataques. Si no superas este punto, ponte en contacto con tu servicio de hosting para que te lo solucionen.
  • Listado de directorios: comprueba si se puede ver un listado de los archivos y carpetas que hay en un determinado directorio. De ser así, estaríamos ante un problema muy grave en la configuración de seguridad del servidor, ya que un usuario podría ver todos los archivos que hay añadidos en la web, lo que le podría servir como punto de partida para realizar un ataque. Aunque se puede arreglar añadiendo un código en la web, no te recomiendo usar un servicio de hosting que no supera este punto.
  • wp-config protegido: este archivo guarda información crítica de WordPress, como el nombre de la base de datos utilizada o los datos de acceso a la misma. Por la configuración del servidor el archivo ya debería estar protegido pero, de no ser así, se puede añadir un código para protegerlo.
  • wp-admin protegido: para acceder a la administración de WordPress ya nos pide un usuario y contraseña, pero es recomendable añadir alguna capa de seguridad adicional, como un prelogin, un sistema de captcha o un acceso limitado por IP. También existen plugins para WordPress que permiten aumentar la protección de este directorio.
  • wp-login protegido: el archivo wp-login.php es el que usa WordPress para realizar el login de usuarios. Es recomendable proteger este archivo si los únicos usuarios que van a necesitar iniciar sesión son los administradores de la web. Se puede hacer con un prelogin, limitar de acceso por IP o con un plugin. ¡Ojo!, si los visitantes de la web puede iniciar sesión de usuario, como en una tienda online, no deberemos usar sistemas de protección que les impidan acceder a este archivo. Para estos casos se podría utilizar un plugin como el Move Login.
  • User-agents bloqueados (WAF): un WAF es un software que se encuentra instalado en el servidor y que sirve como barrera de seguridad adicional entre nuestra web y posibles atacantes, detectando y bloqueando estos ataques antes de que lleguen al servidor. Es muy recomendable que nuestro servicio de hosting disponga de algún WAF, como ModSecurity o similar, ya que mantendrá nuestra web mucho más segura. Por ejemplo, si un plugin que estamos usando tiene alguna vulnerabilidad, un WAF podría evitar ese agujero de seguridad aunque no esté corregido en el plugin.
  • Information Leak: aquí se revisa si en nuestro WordPress tenemos una serie de archivos que se instalan con el CMS, y que únicamente contiene información sobre el propio WordPress. No son necesarios para el funcionamiento de la aplicación y puede dar a un hacker información relevante sobre la herramienta que estamos usando, por lo que se podrían eliminar sin problemas. Ejemplos de estos archivos serían license.txt, licencia.txt o readme.html.
  • Listas negras de Malware: es algo similar al Google SafeBrowsing que comentaba antes. Aquí se realiza una comprobación de si nuestra web sale en otras listas negras. En caso afirmativo, podría ser un síntoma de que nos han hackeado la web. Las soluciones a aplicar serían las mismas que las usada para el Google SafeBrowsing.
  • Cabecera Content-Security-Policy: se tratan de una serie de cabeceras que se añaden para aumentar la seguridad de nuestra web. No voy a entrar en detalles porque algunas son complejas de configurar. Buscando en internet podremos encontrar diversos ejemplos de cabeceras. Hay que ser cuidadosos al añadir este tipo de cabeceras, ya que si lo hacemos mal podríamos bloquear algún elemento importante de nuestra web, como el registro de visitas de Google Analytics.
  • Cabecera X-Content-Type: esta cabecera, correctamente configurada, evita que se carguen hojas de estilos CSS o javascripts maliciosos, usando para ello un archivo con una extensión css o js que realmente no lo es.
  • Cabecera X-Frame: esta cabecera evita que nuestra página pueda ser abierta desde un dominio externo por medio de un frame o iframe, haciendo, lo que se llama en términos de seguridad, clickhacking. Si no se protege esto una persona podría cargar nuestra web desde otro dominio suplantando nuestra página, y podría añadir capas superpuestas para poder obtener información relevante de los visitantes.
  • Cabecera XSS: esta cabecera evita ataques de tipo XSS, bloqueando la carga de scripts externos dentro de nuestra web. Si usamos esta cabecera habrá que comprobar después que todo sigue funcionando en nuestro WordPress como es debido. Si no es así, es mejor no añadirla.Certificado SSL: un certificado SSL encripta la información que se transmite entre nuestro navegador y el servidor donde se aloja la web. De esta forma estos datos van protegidos. Es recomendable tener un certificado SSL cuando los usuarios están enviando información delicada. Ten en cuenta también que al iniciar sesión en la administración, esta información también es enviada al servidor. Aunque un certificado SSL no es gratuito, puede ser una buena opción contar con uno.

En el ejemplo obtengo lo siguiente:

wpdoctor6

Vemos, que gracias a la configuración del hosting de Webempresa superamos algunos puntos clave como el expose PHP, el listado de directorios o el WAF.

De no ser así, habría que comentar estos temas con nuestro proveedor de hosting.

Vamos a aplicar varios cambios en el código para arreglar el máximo de problemas posibles.

NOTA: Recuerda que con el botón “Cómo arreglarlo” podremos encontrar información más detallada de cada punto y cómo solucionarlo.

Mis acciones a aplicar:

Primero voy a establecer una protección mínima.

  • En la web que estamos analizando los visitantes no tienen por qué iniciar sesión, por lo que voy a proteger el archivo wp-login.php con un prelogin. Para bloquear el acceso al directorio wp-admin voy a añadir un prelogin o contraseña .htaccess.
  • Añado el siguiente código al archivo .htaccess de la raíz de la web (si no existe este archivo lo creo):

<files wp-login.php>
AuthType Basic
AuthName "Acceso restringido"
AuthUserFile "/home/NOMBRECUENTA/.htpasswds/passwd"
require valid-user
</files>

  • Lo que viene en AuthUserFile sería la ruta a un archivo, en este caso passwd, situado en la ruta /home/NOMBRECUENTA/.htpasswds de nuestra cuenta de hosting (para cada hosting esta ruta será distinta). Este directorio debería estar fuera de la parte pública de la web, para que ningún usuario pueda tener acceso a él vía web.
  • En el archivo passwd deberemos añadir el usuario y contraseña que se solicitará, que se puede generar en páginas como esta: http://ift.tt/xQ4Oqs
  • Una vez generado el dato, por ejemplo “prueba:$apr1$Vs2LyeU5$iPBofQWutVYsYpruG6VBF.”, lo pondremos en el archivo passwd y guardaremos los cambios. De esta forma, al cargar el archivo wp-login.php nos solicitará un usuario y contraseña adicionales.

Pasamos al Information Leak.

  • Aquí me indica que tengo los siguientes archivos readme.html, license.txt y licencia.txt. Todos estos archivos están en la raíz. Simplemente los borro. Habrá que estar atentos cuando actualicemos nuestro WordPress a una nueva versión, ya que estos archivos pueden volver a aparecer.

Los siguientes puntos serían las cabeceras de distinto tipo.

  • Aquí voy a añadir el cambio dentro del archivo functions.php del tema que estemos utilizando, situado en la ruta wp-content/themes/NOMBRE_TEMA. En mi caso el nombre del tema sería pandora_wp. Añado al final del mismo el siguiente código:

add_action( 'send_headers', 'add_header_seguridad' );
function add_header_seguridad() {
header( 'X-Content-Type-Options: nosniff' );
header( 'X-Frame-Options: SAMEORIGIN' );
header( 'X-XSS-Protection: 1;mode=block' );
header( 'X-Content-Security-Policy: script-src \'self\' http://ift.tt/rzP4g5 ajax.googleapis.com;' );
}

  • Hay que estar atentos con los 2 últimos “header” añadidos. Con lo que he configurado en este ejemplo, bloqueo toda la carga de scripts externos, excepto los de http://ift.tt/rzP4g5 y ajax.googleapis.com. Si en nuestra web estamos usando otros scripts externos que necesitamos habrá que añadirlos o, en caso de dudas, no añadir este header.

Respecto al certificado SSL, no voy a añadirlo. En la web que estamos analizando no se pasa información de formularios entre la web y el servidor. El único sería el acceso a la administración. Es por ello, que si no disponemos de certificado SSL será mejor no conectarse a la administración usando wifi pública, como en una cafetería o centro comercial.

#7 Configuración de DNS

Se muestra información sobre la configuración de las DNS del dominio que estamos analizando. Es una información meramente informativa y no habrá que aplicar ningún cambio.

En el ejemplo obtengo lo siguiente:wpdoctor7

#8 Optimización SEO

Lo primero, una aclaración importante: para conseguir un buen posicionamiento en los buscadores no bastará con superar todos los puntos analizados en WP Doctor para este apartado, aunque sí servirá como punto de partida para mejorar el SEO.

Ten en cuenta que el tema del SEO puede ser muy complejo. Se podría dedicar un blog exclusivamente para estos temas.

Velocidad de carga: nos indica la puntuación que Google PageSpeed nos da, resultado de la media entre la velocidad de carga para dispositivos móviles y equipos de escritorio. Más adelante veremos más sobre cómo mejorar esta puntuación.

  • Google Analytics: verifica si tenemos implementado Google Analytics es WordPress. Como casi todos sabréis, este servicio se encarga de medir las visitas que recibimos en la web, proporcionándonos montones de información útil. Google Analytics es gratuita, así que no hay excusa para no tenerlo.
  • Moz: nos indica la puntuación que nos da Moz, otra herramienta de análisis de velocidad de carga.
  • Descripción: Verifica si tenemos una meta-descripción añadida en la página que se está analizando. Como hemos visto antes, la mejor forma de añadir esto es utilizando el plugin WordPress SEO.
  • Meta Keywords: comprueba si en la página están añadido el meta de palabras clave. Actualmente los buscadores ignoran este dato, por lo que no sería necesario añadirlas. En todo caso, si queremos hacerlo, tendremos que ir en la administración de WordPress a SEO > Título y etiquetas meta (este menú es del WordPress SEO que deberemos tener instalado). Aquí activaremos el parámetro “¿Usar etiqueta de meta palabras clave?”. De esta forma, cuando editemos la página tendremos un apartado para añadir las Meta Keywords.
  • robots.txt: comprueba si tenemos un archivo robots.txt en la raíz de la web. Este archivo es usado por los robots de búsqueda para determinar los directorios que pueden y no pueden rastrear, u obtener otra información como la ruta del mapa web. Es una buena práctica tenerlo, ya que WordPress no lo añade por defecto.
  • Sitemaps: dicho de forma simple, un mapa web o sitemap es un listado de las distintas páginas que tenemos creadas en nuestra web. Este archivo puede ser utilizado por los buscadores para indexar de forma más rápida y eficiente todos los enlaces que apunten a nuestro WordPress. Una forma de crear sin complicaciones nuestro sitemap sería utilizando el plugin WordPress SEO (sí, otra vez él). Luego veremos como hacerlo.
  • Feed RSS: el RSS es una formato de generación de los contenidos de nuestra web en forma de XML que puede ser utilizado por herramientas específicas para leer feeds, como Feedly o NetVives, aunque hay muchas más. Es conveniente disponer de este sistema de lectura del contenido de nuestra web, ya que es usada por multitud de usuarios.
  • OpenGraph: cuando se comparte un artículo de nuestro blog en Facebook puede ocurrir que lo que se muestra en la red social no sea correcto. Por ejemplo, la imagen que sale puede que no sea la del artículo y el texto tampoco. Con las etiquetas Open Graph se soluciona este problema. Es un código que se añade que ayuda a Facebook y otras redes sociales a identificar los elementos importantes del artículo, como la imagen principal, el título, la url, etc. ¿Adivinas cómo se pueden añadir estas etiquetas Open Graph? En efecto, con el plugin WordPress SEO. Desde su menú Social veremos un apartado Facebook con el que podremos añadirlas de forma muy sencilla.
  • Twittercard: se trata de un sistema de etiquetas similar al anterior, solo que en este caso está pensado para Twitter. De nuevo, con el WordPress SEO podremos añadir estas etiquetas de forma muy rápida.

En el ejemplo obtengo lo siguiente:

wpdoctor8

 

Mis acciones a aplicar:

  • En primer lugar voy a añadir el código de Google Analytics a la web. Para ello primero tendremos que crear una cuenta en este servicio. Cuando tengamos creada la cuenta tendremos un código que podremos introducir en nuestro WordPress. Existen multitud de plugins que nos permitirán añadir ese código sin tener que modificar el código de nuestra web, simplemente añadiendo el código UA, que tiene un formato UA-XXXXXXX-X (las X serían números).En mi caso, en la propia configuración del tema dispongo de esta opción.
  • Las Meta Keywords, como había comentado antes, no serían necesarias. En todo caso, las voy a añadir siguiendo los pasos que comenté cuando hablé de ellas. Lo añado dentro de la página que tengo marcada como inicio.
  • Vamos con el robots.txt. Creo un archivo con este nombre y le añado el siguiente código. Una vez hecho esto, subo el archivo en la raíz de la web. ¡Listo!

User-agent: *
Disallow: /wp-admin/
Disallow: /wp-includes/
Disallow: /xmlrpc.php
Disallow: /readme.html
Allow: /wp-content/uploads/
Disallow: /wp-content/plugins/

  • Ahora pasamos a añadir el Sitemap. Como tengo el plugin WordPress SEO instalado voy a SEO > Sitemaps XML. Aquí pulso en el botón XML Sitemap. Se abrirá una página. Copio esa url, que en mi caso es http://ift.tt/1Q8RiWW
  • A continuación edito el archivo robots.txt que había creado antes y le añado la siguiente línea al final:

Sitemap: http://ift.tt/1Q8RiWW

  • Ya solo me queda el tema de las etiquetas Twittercard. Voy a SEO > Social. Pulso en la pestaña Twitter y activo la casilla Añade meta datos de la tarjeta de Twitter.

¡Todo arreglado en el apartado de SEO! :-)

#9 Reducir la velocidad de carga

Llegamos al último punto que analizar WP Doctor.

En este caso se trata de la velocidad de la página, y para ello utiliza los resultados que arroja PageSpeed, con informe detallado del espacio que ocupa cada uno de los apartados de nuestra web (HTML, javascript, CSS), tanto para dispositivos móviles como de escritorio.

A continuación muestra una serie de propuestas para mejorar esa velocidad.

No voy a analizar las posibles propuestas aquí, ya que estas pueden variar en función de la página analizada.

En el ejemplo obtengo lo siguiente:

wpdoctor9

 

Mis acciones a aplicar:

  • En primer lugar me indica que debo optimizar las imágenes. En mi caso no es una cuestión del tamaño de las imágenes, sino de la calidad. Voy a utilizar una herramienta que ofrece el hosting de Webempresa a sus clientes, llamada ImgOptimizer, con el que se ajusta la calidad de las imágenes de mi web de forma automática, sin necesidad de tener que realizar tarea alguna por mi parte. Otras formas de ajustar la calidad de las imágenes sería haciéndolo a mano con algún editor de imágenes (por ejemplo, para un jpg bastaría con una calidad del 80%), o usando alguna herramienta online de las muchas disponibles.
  • Lo siguiente sería especificar la caché del navegador. Con el plugin W3 Total Cache puedo definir el tiempo de caché del navegador, entrando en el apartado Browser Cache del plugin.
  • A continuación nos pide reducir el tiempo de respuesta del servidor. Esto ya es algo que no depende solo de nosotros, sino que el servidor donde tenemos alojada la web puede influir de forma determinante. Por nuestra parte, usar un plugin de caché puede ayudar a reducir mucho este tiempo.
  • Por último nos recomienda eliminar el JavaScript que bloquea la visualización y el CSS del contenido de la mitad superior de la página. Vayamos por partes: mover el CSS al final no es algo recomendable. Haciendo esto la página cargaría sin ningún formato o diseño y, justo al final, se aplicaría el diseño, lo que producirá un efecto un tanto raro.
  • Sobre lo de mover el javacript al final, esto es algo que se puede hacer con diversos plugins, como Scripts to Footer, pero habrá que ser cuidadosos porque esto puede provocar que falle la carga de algunos elementos dinámicos de la web, como una galería de imágenes.Si vemos que se producen este tipo de fallos es preferible dejar el javascript como está.

NOTA: Es muy importante que las imágenes que subamos a nuestro WordPress estén optimizadas. Por un lado deben de tener una calidad adecuada y, por otro, deberán tener el mismo tamaño con el que vayan a mostrar. Es bastante común encontrar páginas donde las imágenes tienen un tamaño real mucho mayor que el que se ve en la propia web. Con esto solo estaremos ralentizando la carga.

Bueno, hemos terminado de aplicar las mejoras.

Ahora pulso en el botón Refrescar de la página de resultados de WP Doctor para que se lance un nuevo análisis (si no usamos este botón se podría cargar el resultado antiguo).

En el ejemplo obtengo lo siguiente:

wpdoctor10

 

¡Exito! Hemos pasado de una puntuación de 60 a otra de 85.

Una gran mejora. Por supuesto, quedan algunos puntos que todavía se podrían mejorar, como el uso de un certificado SSL.

Con las mejoras aplicadas hemos conseguido un WordPress más seguro, mejor preparado para el posicionamiento en buscadores (SEO) y más rápida.

Aquí te dejo una presentación que te ayudará a revistar todos los puntos que hemos visto.

Ahora te toca a ti ¿A qué esperas para mejorar tu WordPress?

Rss footer separator

ACCEDE A MI CENTRO DE RECURSOS SOBRE BLOGGING:
El camino más corto hacia tus primeros 1.000€ online

0 comentarios:

Publicar un comentario