Descuento 20% Diciembre
Plugin Optimización de Imágenes Gratuito para WordPress
Miércoles, 29 Noviembre 2017 07:00

¿Qué es un CDN y cómo utilizarlo en una Web de WordPress?

Escrito por 
CMS:  WordPress |  Versión:  Todas |  Nivel de dificultad:  Avanzado |  Tiempo estimado de lectura:  15 minutos


¿Qué es un CDN y cómo utilizarlo en una Web de WordPress?


Es probable que hayas oído hablar bastante de los CDN para WordPress y de su capacidad de acelerar las páginas web, entre otros usos.

Y no me extraña, ya que la velocidad de navegación en un sitio web es, sin duda, uno de los factores más relevantes para mejorar la experiencia de usuario, mientras tus usuarios navegan a través de las páginas de tu web.

Hoy en día, una página que tarde varios segundos en mostrarse en pantalla, hará que el usuario pierda la paciencia y la abandone, para encontrar en otra parte lo que busca.

Después de todo, en Internet todo está a unos pocos clics de ratón, así que, ¿para qué esperar si puede ir a otro sitio sin apenas esfuerzo?

A su vez, la experiencia de usuario influye en el SEO de una web, ya que Google penaliza las páginas que tardan demasiado en cargar, precisamente por su efecto negativo en este factor.

Esto, hasta ahora, era razón suficiente para ponernos las pilas y empezar a optimizar las imágenes, instalar un plugin de caché, utilizar plugins que consuman pocos recursos, etc.

¡Hasta que descubrimos que existen los CDN’s!

A diferencia de otras optimizaciones realizadas sobre recursos o componentes instalados en el servidor web o en WordPress, con un CDN intervienen servidores externos, que interactúan con el servidor web para acelerar la descarga de una página web y, en consecuencia, la velocidad de navegación.

A continuación, te mostraré en qué consiste, cómo funciona y, desde un punto de vista práctico, cómo puedes instalar y configurar un CDN en tu WordPress, para aprovechar todas sus ventajas.

¿Qué es un CDN?


Un CDN es, de forma muy resumida, un conjunto de servidores distribuidos por todo el planeta y conectados entre ellos a través de Internet.

Pero, para creo que la mejor forma de comprender qué es un CDN y cómo funciona es conociendo primero el proceso que se sigue, desde que un usuario introduce una dirección en su navegador hasta que la página web correspondiente aparece en pantalla.

Aunque no hay diferencias significativas con otros gestores de contenidos, con el fin de simplificar la descripción de este proceso, vamos a suponer a partir de ahora que accedemos a la página web de un sitio en WordPress. El procedimineto sería el siguiente:

  1. El usuario introduce la dirección en su navegador.
  2. El navegador identifica el servidor correspondiente a esa dirección y le solicita la correspondiente página web.
  3. El servidor recibe esta petición y WordPress genera un fichero HTML, a partir de la información almacenada en sus bases de datos.
  4. Dicho servidor envía este fichero HTML al navegador que hizo la petición (punto 2).
  5. Cuando el navegador recibe el fichero HTML, lee e interpreta su contenido.
  6. Durante esta interpretación, pueden aparecer referencias (direcciones web) a diversos recursos, como ficheros de estilos o imágenes, que forman parte del contenido o estructura de la página web.
  7. Por cada una de estas referencias, el navegador solicita ese recurso al mismo servidor.
  8. El servidor atiende cada una de estas peticiones, localizando el correspondiente recurso en su disco duro y enviándolo al navegador.
  9. A medida que el navegador va recibiendo estos recursos, va generando y mostrando la página web al usuario.

Por regla general, todos los recursos de una página (punto 6), se encuentran alojados en el mismo servidor que ha generado el fichero HTML (punto 3).

La utilización de este tipo de herramientas libera al servidor de hosting de esta última tarea, de forma que solo deberá encargarse de atender las peticiones del navegador (puntos 3 y 4). Por su parte, el CDN se encargará de atender las referencias a los recursos (puntos 7 y 8).

¿Cómo funciona un CDN?


Si analizamos en detalle el proceso descrito en el punto anterior, observaremos que gran parte del trabajo realizado por el servidor de alojamiento no está, paradójicamente, dedicado a la tarea más importante: generar y entregar la página HTML al navegador que la solicita.

En vez de ello, el servidor de alojamiento dedica un elevado tiempo de proceso a, simplemente, localizar y entregar ficheros de recursos al navegador.

Entre estos recursos, los más frecuentes son las imágenes, que suelen ocupar bastante más espacio y, en consecuencia, consumen mayor ancho de banda que la propia página HTML, por muy optimizadas que estén.

Con este recurso, el servidor de alojamiento puede centrar su trabajo en lo importante: atender las peticiones de los usuarios, generar los ficheros HTML que le solicitan y entregarlos de vuelta.

Hasta ahora, sólo nos hemos parado en ver el efecto externo de utilizarlo, pero seguramente empiezas a vislumbrar algunas de las ventajas que nos puede aportar.

Pero, antes de ver en detalle para qué sirve, vamos a pararnos un poco en saber cómo funcionan los CDN’s y así comprender mejor todas sus posibilidades.

Esquemáticamente, el principio del funcionamiento de un CDN se basa en los 3 puntos siguientes:

  1. Disponiendo de una extensa red de servidores, conectados a través de Internet, dispersos a lo largo y ancho de toda la geografía terrestre.
  2. Almacenando localmente en esos servidores una copia de todos los ficheros de recursos estáticos que tenemos en nuestro servidor de alojamiento.
  3. Interfiriendo y atendiendo las peticiones de estos ficheros de recursos cuando un navegador los solicite para generar y mostrar la página web al usuario.

Veamos a continuación cada punto con más detalle...

► Disponiendo de una red de servidores

Aunque hasta ahora nos hemos referido al CDN de forma singular, como si fuera un único elemento, en realidad se trata de un conjunto de servidores, distribuidos por todo el planeta y conectados entre ellos a través de Internet.

Gracias a esta disposición, cuando un navegador solicita un recurso, le atiende el servidor que tenga más próximo a su propia localización geográfica, reduciendo enormemente el tiempo de envío y recepción de los datos.

La gestión y funcionamiento internos de esta red de servidores es completamente transparente tanto para el propietario del sitio web que utiliza el CDN, como para los usuarios que navegan a través de sus páginas.

Para uno y otro,éste tiene la apariencia externa de un único servidor que entrega los ficheros de recursos a través de Internet.

► Almacenando localmente los recursos

Tiene sentido, ya que si el CDN (no nos importa cuál de sus servidores) va a entregar, por ejemplo, una imagen a un navegador, debe disponer de ese fichero imagen en su propio disco duro.

Si tuviera que solicitarlo al servidor de alojamiento, dejaríamos de tener todos los beneficios que nos podría proporcionar. Incluso afectaría negativamente al rendimiento, pues habría que hacer dos peticiones para un mismo fichero.

La forma en que estos ficheros llegan, se almacenan y se distribuyen entre los servidores del mismo, que puede variar en función de la configuración del servicio y también es transparente a nosotros, sin que tengamos que intervenir para nada.

Por defecto, la mayoría de los CDN’s hacen una copia local de todos los ficheros de recursos cuando se instalan y activan por primera vez. Igualmente, el propio CDN se encarga de revisar que su copia local esté actualizada con cualquier cambio en el fichero original del servidor de alojamiento.

► Interfiriendo y atendiendo las peticiones de los recursos

Hasta el momento, disponemos de una red de servidores y, distribuidos en ellos, una copia de todos nuestros ficheros de recursos.

Sin embargo, las referencias (direcciones web) a estos recursos desde el código HTML de las páginas web siguen siendo a nuestro servidor de alojamiento.

Esto significa que, cuando el navegador lea e interprete estas direcciones web en el código HTML, los seguirá solicitando al servidor de alojamiento, no a los servidores.

Por tanto, para que el navegador descargue esos ficheros desde el CDN, habrá que cambiar esas direcciones web para que apunten a los servidores del CDN en vez de al servidor de alojamiento.

Aquí podemos asustarnos un poco: ¿tenemos que cambiar las direcciones web de TODAS nuestras imágenes?

En principio sí, pero los proveedores de este tipo de herramienta proporcionan herramientas (como un plugin de CDN para WordPress), para hacerlo por nosotros automáticamente, con lo que tampoco debemos preocuparnos de eso.

► Modalidades de funcionamiento de un CDN

Los proveedores para WordPress pueden optar por dos alternativas a la hora de interferir y atender las peticiones de los recursos:

  • La primera ya la hemos descrito anteriormente: un plugin CDN WordPress, proporcionado por el proveedor del mismo, que modifica las direcciones web en el código HTML de las páginas web, para que apunten a las respectivas copias de los ficheros de recursos en los servidores.

Una vez instalado y configurado este plugin, el proceso de cambiar las direcciones web es automático y transparente, tanto para el propietario del sitio web como para los usuarios que navegan por él, que no tienen por qué saber dónde están realmente alojados los recursos.

  • Por su parte, en la segunda modalidad, las direcciones web en las páginas no varían, sino que los servidores atienden directamente a esas direcciones, como si fueran el servidor de alojamiento original. En este caso, el servidor CDN de WordPress funciona como un proxy, colocándose entre el navegador y el servidor de alojamiento.

Cuando el servidor puede suministrar el recurso solicitado, porque tiene una copia local, lo entrega en ese momento. Si no lo puede suministrar, ya sea porque no está almacenado en su disco duro o porque es una copia obsoleta, redirige la petición al servidor de alojamiento para que la atienda.

Con esta modalidad, el servidor de alojamiento siempre estará detrás del servidor CDN, por lo que obtiene una capa adicional de seguridad contra posibles ataques externos, que primero deberán atravesarlo.

Además, dispone de la posibilidad de almacenar una copia estática de las páginas web, comportándose como un servidor caché, especialmente útil cuando nuestras páginas de contenido cambian con poca frecuencia.

El propio servidor CDN se encarga de actualizar periódicamente estas copias estáticas para asegurar que los usuarios siempre tengan acceso a la versión más reciente de las páginas.

¿Para qué sirve un CDN?


Para que sirve un CDN


Ahora que sabemos en qué consiste este término y cómo funciona, veamos qué servicios nos proporciona un CDN en WordPress y cómo podemos aprovecharlos para mejorar el tiempo de respuesta de nuestro servidor y, en consecuencia, la velocidad de navegación de nuestros usuarios:

1. Almacenamiento y entrega de ficheros de recursos estáticos

Fundamentalmente imágenes y ficheros CSS. Esta es la principal característica de los servidores y casi su razón de ser.

Como se ha comentado anteriormente, al disponer de una copia local de los recursos estáticos, se libera al servidor de alojamiento de tener que enviarlos al navegador cuando un usuario accede a una de sus páginas web, liberándolo para así dedicarse a otras tareas.

2. Caché de los recursos dinámicos

Los recursos dinámicos son aquellos que genera un gestor de contenidos cada vez que se visita el sitio web.

Por ejemplo, en WordPress, las páginas web son generadas cada vez que un usuario accede a ella. Cuando el sitio web tiene muchas visitas, este proceso se repite continuamente, lo que afecta al rendimiento del servidor de alojamiento.

Para evitarlo, se puede configurar un CDN para WordPress, que almacene una copia estática de estas páginas dinámicas y que actúe como una caché, cuando varios usuarios naveguen por las mismas páginas.

Él mismo se encarga de mantener actualizadas sus copias estáticas locales con el servidor de hosting.

En este punto, hay que señalar que no todos los CDN para WordPress ofrecen este servicio y que, en la mayoría de los casos, suele ser un servicio de pago.

3. Respuesta más rápida para usuarios de otros países

Nuestro servidor de alojamiento es uno, o un pequeño conjunto de servidores si el sitio web es grande, ubicado en una única localización geográfica.

Este servidor atiende las peticiones realizadas por usuarios desde cualquier parte del mundo.

Cuando más lejos esté dicho usuario, más tiempo de tránsito necesitan los datos para transferirse desde el navegador hasta el servidor y viceversa.

Con este recurso, este problema desaparece, puesto que tienen sus servidores diseminados en todos los continentes.

Cuando un usuario accede a nuestro sitio web, le atenderá el servidor CDN que esté más próximo a su ubicación física, reduciendo significativamente el tiempo de tránsito y, en consecuencia, el tiempo de descarga y navegación de la página web.

4. Optimización del uso de recursos del servidor de hosting

En la primera sección de este artículo, vimos cómo era el proceso completo de generación y descarga de una página web, en que gran parte de la capacidad del servidor de alojamiento, como el tiempo de proceso y el ancho de banda, se dedicaban a la atención y descarga de los ficheros de recursos estáticos.

Al externalizar esta descarga, el servidor puede dedicar un mayor porcentaje de su potencia a lo realmente importante: la atención a los usuarios y la generación de las páginas web que visitan.

De esta forma, podrá atender a un mayor número de usuarios y servir más páginas web sin afectar negativamente al tiempo de descarga y navegación.

5. Protección contra ataques de hackers

Especialmente los ataques de Denegación de Servicio (DoS o DDoS), que consiste en realizar un alto número de accesos simultáneos al servidor, con objeto de saturarlo y no pueda atender las peticiones de usuarios legítimos.

Los servidores CDN disponen de mecanismos para detectar cuando se produce este tipo de ataques y contrarrestarlos, evitando o limitando el efecto que pueda tener sobre el funcionamiento normal del servidor de alojamiento.

Sin embargo, no debe utilizarse un CDN para WordPress como principal herramienta de protección frente a este tipo de ataques, puesto que el servidor de alojamiento sigue estando accesible a través de Internet y los hackers pueden encontrar caminos para acceder directamente a él, bordeando los servidores.

Por tanto, para prevenir estos ataques directos, siempre deberá contarse también con un proveedor de hosting de calidad, que disponga de medidas de seguridad contra estos ataques.

¿Sólo puedo utilizar un CDN para webs en WordPress?


CDN para webs en WordPress


WordPress es el gestor de contenidos más utilizado para prácticamente cualquier tipo y tamaño de web, desde blogs con solo artículos, hasta verdaderas plataformas de eCommerce con todo lo necesario para realizar compras por Internet.

Esta hegemonía hace que los proveedores de servicios de este tipo dediquen más esfuerzos a las soluciones adaptadas para web WordPress, aunque solo sea porque disponen de un mayor volumen de clientes que utilizan este gestor.

Además, la comunidad de usuarios de CDN WordPress también es considerablemente mayor, con lo que también es más fácil y rápido encontrar soluciones a problemas que otros usuarios ya hayan tenido, resuelto y compartido con la comunidad.

Sin embargo, esto no significa que no se pueda utilizar con otros gestores de contenidos. Los proveedores de CDN ofrecen plugins, complementos o módulos para integrar sus servidores en los principales gestores de contenidos del mercado, no sólo CDN's para WordPress.

En aquellos casos en que este tipo de proveedores no proporcionen un plugin para algún gestor de contenidos, se puede acudir a su servicio de soporte o a la comunidad de usuarios, para preguntar si existe alguna alternativa viable de fácil implantación.

Por otro lado, aún en caso de que un proveedor en particular no ofrezca solución ni soporte para un determinado gestor de contenidos, en el mercado hay un abanico tan grande de proveedores que, casi con total seguridad, alguno de ellos ofrezca una solución para este gestor.

¿Cómo puedo instalar un CDN para mi Web WordPress?


La instalación de un CDN en una web en WordPress no presenta muchas dificultades, gracias a que los proveedores proporcionan plugins que realizan gran parte del trabajo, junto con la configuración del servicio, para registrar el sitio web.

Aunque cada proveedor de este tipo de recursos tiene sus respectivas particularidades a la hora de instalar y configurar el plugin y el servicio en sí, la diferencia principal viene dada por la modalidad de funcionamiento:

► Redirección de las URL’s de los ficheros de recursos

Para esta modalidad, la integración de un servicio de este tipo requiere estos 2 pasos generales (los detalles pueden variar ligeramente entre proveedores):

  1. Registrarse en la plataforma CDN, a través de la web del proveedor y activar el sitio web que utilizará el CDN. Aunque la nomenclatura puede variar entre proveedores, suelen denominarlo “zona”. A esta zona, éste le asocia una URL, que debemos anotar.
  2. Instalar el plugin para el CDN, que se encargará de hacer la redirección de todos los ficheros de recursos. Para ello, deberemos configurar con la URL de zona que anotamos en el punto anterior.

Proveedores bajo esta modalidad estarían KeyCDN y AWS CloudFront (de Amazon).

Ambos ofrecen un periodo de prueba, pasado el cual hay que suscribirse a algún plan de pago.

► Servidor CDN como proxy

Integrar un servicio de esta índole que funciona como proxy también requiere dos pasos generales:

  1. Registrarse en la plataforma CDN, a través de la web del proveedor, y activar el sitio web. Al hacerlo, éste proporciona los servidores de nombre para el dominio del sitio web.
  2. Cambiar los servidores de nombres en nuestro proveedor para que apunten a los servidores de nombres del CDN. Desde ese momento, cualquier acceso a nuestro sitio web se hará siempre y exclusivamente a través de los servidores.

En este caso, no es imprescindible la instalación del plugin de CDN para WordPress, puesto que los cambios anteriores son suficientes para el funcionamiento del recurso. Aunque sí es aconsejable, para poder configurar algunas áreas sin tener que entrar en la web del proveedor.

Proveedores de este tipo que actúen como proxies serían CloudFlare e Incapsula.

Ambos ofrecen un servicio gratuito sin límite de tiempo y con suficientes prestaciones para sitios web pequeños y medianos con un volumen de tráfico no muy elevado.

► Instalación y configuración del CloudFlare CDN Wordpress

Como vimos en el apartado anterior, CloudFlare pertenece a los CDN's que actúan como un proxy, situándose por delante del servidor de nuestro sitio web y atendiendo directamente a los navegadores.

A continuación veremos cómo instalar y configurar este CDN para WordPress, desde tres frentes:

  • Registro del sitio web en CloudFlare

  1. Entra en la página de registro de CloudFlare y crea una cuenta con tus datos.
  2. Después de crear la cuenta, debes añadir tu sitio web en la plataforma, para que CloudFlare lo analice y registre sus datos de nombre de dominio. Tan sólo necesitas introducir la dirección web y dejar que CloudFlare lo escanee:

Añadir sitio web CDN

Haz clic en la imagen para ampliarla  


  1. CloudFlare muestra una pantalla con los datos de dominio que ha detectado del sitio web y que solo tenemos que validar.

Observarás que extrae muchos datos, pero los relevantes para el funcionamiento son los dos remarcados en la siguiente imagen, que siempre aparecerán con el icono de la nube naranja (“On CloudFlare”):


Registro CDN de un sitio web

Haz clic en la imagen para ampliarla  


  • En la siguiente pantalla, debemos seleccionar el plan de pago. Por ahora, elegiremos el plan gratuito, pero siempre tendremos la opción de contratar cualquier otro plan:

  • Elegir plan CDN WordPress

    Haz clic en la imagen para ampliarla  


    1. A continuación, CloudFlare te muestra los dominios de tus servidores de nombre (a la izquierda en la imagen siguiente) y los dominios de los servidores de nombre por los que debes sustituirlos (columna de la derecha). Toma nota de estos dominios:

    Servidores

    Haz clic en la imagen para ampliarla  


    1. El sitio ya está registrado pero, hasta que no cambiemos los dominios de los servidores de nombre en nuestro proveedor de dominios, CloudFlare lo deja en estado pendiente:

    Nombres de servidores

    Haz clic en la imagen para ampliarla  


    El registro del sitio web ya está terminado y no necesitamos hacer nada más.

    CloudFlare lo activará automáticamente, tan pronto detecte que hemos cambiado los servidores de nombre.

    • Cambio de los servidores de nombre

    Este cambio depende del proveedor de dominios que tengamos contratado.

    Veamos los pasos que, en general, deberemos seguir con cualquier proveedor:

    1. Acceder a nuestra cuenta en la web del proveedor de nombres de dominio.
    2. Entre las opciones de configuración, localizar la opción que muestre los servidores que nos proporciona el proveedor.
    3. El proveedor siempre suministra dos servidores DNS. Debemos modificarlos para introducir en su lugar los dos servidores de nombre que nos proporcionó CloudFlare al registrar nuestros sitio web (punto 5 del apartado anterior).
    4. Una vez hecha la modificación, pueden pasar hasta 24-48 horas para que el cambio se difunda por toda la red. No es posible acelerarlo, así que solo nos queda esperar.

    En el momento que CloudFlare detecte que el cambio se ha producido, activará éste para nuestro sitio web, sin necesidad de que intervengamos más.

    5. Una vez que CloudFlare lo ha activado, debemos indicarle que no cachee el panel de control de WordPress, puesto que podría afectar a su correcto funcionamiento.

    Para ello, accedemos de nuevo a la web de CloudFlare y añadimos la siguiente regla de página (“Page rules”), con los mismos valores que se muestran:


    Cloudflare CDN para WordPress

    Haz clic en la imagen para ampliarla  


    • Instalación del plugin CloudFlare CDN WordPress

    En el siguiente vídeo tenéis el proceso completo, para instalar el plugin de CloudFlare CDN para WordPress y sus posibilidades de configuración.

    La instalación del plugin no es imprescindible, pero nos permite configurar directamente desde nuestra web las opciones más útiles, sin tener que entrar en la plataforma web del CDN:



    Conclusiones

    Pueden ser varias las razones que nos lleven a plantearnos su utilización, como la optimización de posicionamiento orgánico, añadir una capa adicional de seguridad contra hackers al sitio web o un mejor aprovechamiento de los recursos del servidor de alojamiento.

    A pesar de la complejidad técnica que hay detrás de su funcionamiento, los proveedores han dispuesto mecanismos y herramientas de fácil instalación y configuración para los gestores de contenido más populares, entre ellos los CDN para WordPress.

    Aunque muchos proveedores proporcionan planes gratuitos, la mayoría tienen un límite de tiempo, pasado el cual requiere la contratación de un plan de pago, en función del nivel de tráfico y visitas del sitio web.

    Éstos pueden funcionar bajo dos modalidades: reescribiendo las URL’s de los ficheros de recursos estáticos del sitio web (como KeyCDN o AWS CloudFront) o comportándose como un servidor proxy (como CloudFlare o Incapsula).

    Desde el punto de vista del propietario del sitio web, los CDN para WordPress que se comportan como un proxy son algo más fáciles de instalar y configurar.

    Además, los dos más conocidos ofrecen planes gratuitos sin límite de tiempo (aunque sí de tráfico web).


    ¿Te ha resultado interesante este artículo?

    Suscríbete para recibir consejos exclusivos para WordPress, Joomla y PrestaShop



    Antonio Fernández Alonso

    Consultor SEO y Profesor colaborador del módulo SEO del Programa de Social Media Marketing de la Universidad de Sevilla (SMMUS). Ingeniero Superior de Informática, especializado en el desarrollo de estrategias de Posicionamiento Web para PYMES, y el gestor de contenidos WordPress.
    Twitter | Facebook

    Sitio Web: www.afernandezalonso.com/

    Plugin Optimización de Imágenes Gratuito para WordPress