Cómo obtener puntos 100 / 100 en Google Pagespeed para su sitio web de WordPress

0
1011
percepciones página de velocidad

Insights de Google Pagespeed es la conocida herramienta de sitio web con la que puede verificar y optimizar todos los parámetros relevantes para el motor de búsqueda. Puede hacer clic en el enlace de arriba o, por lo general, ver en el sistema de administración un valor actualizado diariamente de su página.

En esta guía, le mostraremos lo fácil que es Puntuación de velocidad de página de 100/100 para llegar Tú también puedes hacerlo.

Para nuestro ejemplo, utilizamos un sitio web de demostración con todo tipo de contenido y un tema conocido, que también incluye los complementos habituales. Entonces, exactamente qué crear buenos sitios web.

super-alimentos página de inicio

Estamos aqui para el tema The7 decidido. Realmente no importa qué tema uses. Lo principal es que está actualizado y ofrece algunas opciones de configuración para la creación del sitio web.

Eso es lo que necesitas para un sitio web rápido.

  1. un host web rápido con experiencia
  2. un WordPress limpio y actual
  3. la configuración correcta para el servidor web
  4. una herramienta para optimizaciones y almacenamiento en caché

Usamos en este ejemplo WP Rocket, Todas estas herramientas hacen lo mismo. Comprime archivos de texto, contrae el código y posiblemente crea una página estática como copia.

Esto permite al visitante acceder rápidamente a la página.

Las páginas estáticas recuerdan el código html de aquel entonces. Los sitios web que consisten solo en código html simple e imágenes siguen siendo los más rápidos. Pero no dinámico. Pero con estos complementos, el caché siempre se recrea tan pronto como algo en la página ha cambiado.

Consejo: deshabilite el WordPress Cronjob, No es realmente un trabajo temporal en el verdadero sentido, siempre se llama cuando un visitante llega a la página. Cómo hacer eso te mostramos en otro artículo.

Insights de Google Pagespeed

Ingrese a su sitio web actual en google y vea el rendimiento.

Normalmente uno obtiene los primeros valores en el área amarilla, así que hasta 85 si el Webhoster tiene un buen servidor.

En nuestra instalación predeterminada, PSI nos mostró 85 / 100 en la vista de escritorio.

Instalación de WordPress estándar de PSI

Sin embargo, es algo engañoso la afirmación de que el servidor ha respondido lentamente. Aquí se entiende el tiempo hasta el primer byte que se transmite.

Hay muchos factores que interactúan aquí. A menudo reducirá el llamado TTFB (Tiempo hasta el primer byte), si arregla todos los demás puntos.

Convenientemente, Google ofrece el código optimizado para descargar por muchos puntos. En este punto, sin embargo, generalmente recomiendo incorporar solo imágenes previamente optimizadas en el sitio web.

Incluso puedes hacerlo gratis con el Panda Tinypng hacer.

tinypng-de compresión de imagen
Tinypng.com Panda alimenta los bytes redundantes.

Sin embargo, la mayoría de los temas también crean sus propias imágenes en diferentes tamaños, por lo que siempre vuelve a las nuevas necesidades de optimización.

Por lo tanto, en ocasiones es recomendable volver a optimizar y sobrescribir todos los archivos de imagen que residen en el servidor web.

Pingdom, GTMetrix y Co.

Por supuesto, hay otras páginas de prueba. Aquí, sin embargo, a menudo existe el problema de que la llamada proviene del extranjero y, por lo tanto, no tiene el significado suficiente para simular al visitante habitual de Alemania. También es importante saber que algunos programas de prueba no pueden manejar http / 2 e ignoran exactamente la ventaja de http / s, es decir, la transmisión paralela de datos a través de una conexión e interpretarla negativamente.

gtmetrix
Informe de rendimiento de GTMetrix

TTFB o tiempo de carga total?

Básicamente, el resultado del tiempo total de carga cuenta. El primer byte depende de muchos factores en los que uno solo puede influir. Una página que no está comprimida generalmente tiene un valor TTFB muy bajo que una página perfectamente comprimida. Pero el tiempo de carga total con compresión es obviamente más rápido en una página con mucho contenido. Cómo Google evalúa eso en última instancia es nebuloso. Incluso tenemos páginas que se cargan porque el software está desactualizado y tiene un valor de PSI de 68. Con las palabras clave orgánicas de 28K, pero acerca de los visitantes de 1000 llegan al sitio al día. Pero para sitios comparables, la página con los mejores valores ciertamente aparecerá más arriba.

CDN y módulos de aceleración

También hay módulos que almacenan datos estáticos en otros servidores y los entregan dependiendo de la ubicación del visitante. Esto reduce el número de conexiones al servidor y reduce el llamado TTFB. Los cachés de akamai, cloudflare o incapsula están disponibles aquí, que también ofrecen compresión y optimización según el servicio reservado. También se incluye una pequeña protección (D) Dos si la conexión se realiza completamente a través de estos proveedores.

CloudFlare-web-tráfico-uebersicht
Análisis de tráfico de Cloudflare

Speedkit para Plesk

Por ejemplo, hay un complemento para Plesk, que puede hacer que el sitio web sea más rápido con solo unos pocos clics. En mi prueba, sin embargo, exactamente lo contrario fue el caso. El principal problema con estos complementos es el hecho de que la memoria caché solo se inicia cuando el visitante ve la página por segunda vez o se conecta por primera vez al sistema.

La ventaja es que puede activarlo fácilmente sin realizar ningún cambio en su sistema. Pero la desventaja es la falta de velocidad con los visitantes de 1 View. Por esta razón, no puede ver ningún cambio con los programas de prueba habituales, porque siempre visitan el sitio sin almacenar en caché como un nuevo usuario.

Speedkit-web-acelerador-plesk
Speedkit para Plesk está diseñado para acelerar las páginas web. Pero probablemente no siempre funciona.

Dado que la mayoría de los visitantes a menudo solo llegan al sitio a través de un enlace desde un motor de búsqueda, no hay una ventaja de velocidad para estos visitantes. Con a bordo significa que uno se lleva bien sin cachés externos. En términos de protección de datos, especialmente DSGVO y el próximo Reglamento de privacidad electrónica, el uso de dichos servicios no es adecuado. Ya falta un contrato para el procesamiento de datos de pedidos al solicitar estos servicios.

Entonces haces que el sitio web sea más rápido.

El punto más importante: el proveedor de alojamiento web adecuado.

Visto desde afuera, todos lo hacen Proveedor de alojamiento web lo mismo Pero la diferencia a menudo está oculta.

Hay webhosts que anuncian con núcleos y recursos dedicados, pero que todo esto solo se ejecuta en hardware muy débil. Un pequeño núcleo AMD de un servidor 10 de un año de antigüedad no es lo mismo que un núcleo en un Intel Platinum Xeon la última versión.

vmware_cluster
Un ejemplo de clúster VMWare

La mayoría de los proveedores de hoy también virtualizan toda su infraestructura. A menudo, en estructuras extrañas como sistemas de contenedores en los que el cliente reservó los núcleos fueron reservados por otros clientes de 20. Bueno y costoso debido al costo de la licencia de software, los proveedores usan sistemas de virtualización correctos como vmware o KVM, generalmente conocidos como nube.

kvm_cluster
Un pequeño grupo KVM

A menudo, compartir es suficiente Hospedar a cabo. Nosotros mismos hemos creado sitios web con decenas de miles de visitantes por mes. Estos también se ejecutan en una cuenta de alojamiento pequeña, porque las máquinas de alojamiento web generalmente son dimensionadas por el proveedor que ya es muy grande, por lo que pueden servir a cientos de sitios web.

virtuozzo_cluster
Vista de un nodo Virtuozzo 7

Sin embargo, la mayoría de los sitios no necesitarán los servicios que han reservado, por lo que siempre queda mucha energía.

Al elegir el webhoster, solo busque una cuenta de prueba y juegue su sitio web sin compromiso. Por lo general, puede comunicarse con ellos a través de un subdominio y probar la velocidad. Si no es nada, simplemente cambie a otro proveedor.

En este ejemplo, la página de demostración está en uno Servidor SEO webhoster.de AG donde obtiene una cuenta de revendedor de Plesk con direcciones IP de 10 para sus proyectos.

El hardware utilizado es un servidor Dell R740 con SSD de servidor MLC como una matriz RAID.

La interfaz de gestión es Plesk Onyx en la versión actual

Se instaló un WordPress estándar con los siguientes complementos activos:

  • Amazon Affiliate para WordPress
  • NextScripts: Ayudante de actualización SNAP Pro
  • ScriptsSiguiente: Auto-Cartel de redes sociales
  • SEO Enlaces inteligentes Empresa
  • códigos cortos Ultimate
  • Tabla de Contenidos Más
  • Los elementos 7
  • Complementos definitivos para WPBakery Page Builder
  • WPBakery Page Builder
  • Yoast SEO de primera calidad
  • WP Rocket

La plantilla de diseño

El tema es The7.

El diseño de la página consta de plantillas del tema o del generador de páginas. Las subpáginas generalmente tienen palabras 2500-3000 y muchas imágenes y tablas.

Por lo tanto, siempre es importante no solo verificar la página de inicio, sino también las subpáginas.

Nuestro sitio de demostración se llama www.super-food.de y también está bajo esto Dominio alcanzable. Para que pueda verificar todas las pruebas usted mismo. En otro artículo, mostramos cómo construir un sitio web grande con pocos recursos en poco tiempo. Quizás eso sea algo para ti también. El sitio web a veces se copia a otros sistemas con fines de prueba para crear pruebas comparativas.

Cómo configurar el servidor web a través de Plesk

En primer lugar, el servidor web debe configurarse a través de Plesk. Siempre hay recomendaciones para usar nginx como un servidor web puro. No hacemos eso porque esencialmente no se admiten archivos .htaccess y la mayoría de las funciones de WordPress de los complementos solo se pueden convertir con un mayor esfuerzo, de lo contrario no son efectivos. Tampoco hay ventaja de velocidad.

plesk-salpicadero-dominio
El tablero de Plesk para el dominio

Configuración de PHP en Plesk

Usamos la versión actual de php 7.2.9 con la configuración predeterminada. En la configuración de PHP del elemento de menú, generalmente puede configurar las opciones usted mismo. Si no, el proveedor de alojamiento web tiene que hacerlo.

plesk-php-versión-set-Apache-con
Configuración de PHP en el menú de Plesk. PHP FPM con el servidor web Apache.

Configuraciones para Apache y nginx

En el caso de la configuración de nginx o Apache, solo establecemos los valores ya preparados por el proveedor. Entonces nada especial. Aquí los enlaces simbólicos se desactivan y la compresión estándar se activa solo por razones de seguridad.

Configuración de nginx como proxy en el menú de Plesk

Solo usaremos nginx como servidor proxy con el procesamiento inteligente de archivos estáticos. Básicamente, puedes prescindir completamente de nginx. Entonces http / 2 ya no funciona y se producen otros problemas. Así que vamos a dejarlo en los valores predeterminados.

WordPress Dashboard

Nuestro sitio de demostración ya funciona bastante bien. Pero para llegar a 100 / 100 necesitamos algunas modificaciones como la Minificación, por lo que el resumen de CSS y Javascript como Google recomienda.

Esto generalmente no puede copiar todo junto, por lo que hay ayudantes útiles que hacen el trabajo.

Estamos utilizando el complemento WP-Rocket en esta revisión. Pero la mayoría de los demás pueden.

wp-cohete-reserva
El panel de WP-Rocket

En la sección Preferencias, en la sección Optimización de archivos, simplemente haremos clic en todos los elementos, excepto aquellos que sean perjudiciales para http / 2. Esos son los archivos CSS que "Minificar CSS"Y"Optimizar la presentación de CSS".

css Minify
WP Rocket CSS Minification

Con la configuración de JavaScript, debe cambiar la configuración "Minimizar Javascript"Y"Javascript retrasó la carga"Así como el"Modo seguro para jQuery (recomendado) ".

Javascript minify
Configuración de Javascript de WP Rocket

Eso es casi todo. Con el complemento, la página en el valor de PSI aumenta a 94 / 100. Ahora solo faltan algunas optimizaciones menores de los archivos de imagen o el código CSS, que de alguna manera no se comprimieron en el llamado tema hijo. Convenientemente, Google proporciona estos archivos pero optimizados, por lo que puede reemplazarlos fácilmente por el administrador de archivos.

En este caso pudimos intercambiar las imágenes cambiadas por el tema y colocar un archivo CSS y Javascript en el tema secundario.
Luego solo hubo una pequeña recarga en el esperado 100 / 100 después de que se realizaron todas las optimizaciones.

percepciones página de velocidad

Página de velocidad-100-100
Google Pagespeed Insights con 100 / 100 aprobado.

Esperamos que nuestro pequeño tutorial te haya ayudado con la optimización. Entonces todo es posible. Pero las cosas también están cambiando todos los días. Es por eso que debe mantener su WordPress actualizado, de lo contrario, las nuevas funciones ya no serán compatibles.

Encontrarás un video completo en nuestro canal de YouTube pronto.

Deja una respuesta

Por favor, introduzca su comentario!
Por favor, introduzca su nombre aquí