Plugin para PageSpeed Insights de Google en WordPress (FRBM)

Este plugin para PageSpeed Insights, fabricado para WordPress, está específicamente diseñado para conseguir el 100/100 de su métrica.
Objetivo: Acelerar las páginas y sacar nota en el exámen de Google

No he podido dedicarme a hacer blogs ni buscar tráfico.
Como programador y el poco tiempo libre que tengo, no he podido dedicar mi tiempo a escribir y generar contenido.
Fabriqué mi propio colector solar, y a posterior mi propio termostato solar.
Me sirvió como excusa para abrir mi primer blog, en un entonces en el que apenas sabía casi nada de seo.
El proyecto fue un éxito, pero el blog NO.
Pero ahí está, haciendo presencia, y generando algo de dinero con la publicidad AdSense de Google.

Ahora que tengo más tiempo estoy generando algo de contenido e intentando posicionar algunas páginas.
Creo que me enfrento al mismo problema que todos los bloggers en su inicio, poder ofrecer mucho ante un escenario de butacas vacías.
He aprendido gestionar dominios, hostings, optimizar servidores, y todo ese entramado.
Y como este es un oficio de nunca acabar, y unas cosas te llevan a otras, pues ahora intentando comprender que nos pide Google y como dárselo e intentar ser el primero.

Cuando te metes de fondo en la optimización del html, el seo-on-page, y ahora la puntuación del Google Page Insight, aprendes un montón de cosas.

Todos somos testigos que para conseguir que una página tenga audiencia, se necesitan muchas cosas.
Pero todo empieza por tener una página bien optimizada a nivel de seo-on-page, y una web bien optimizada a nivel de estructuración y rendimiento.

Si bien generar calidad de texto acorde a un tema determinado es más o menos sencillo, generar un HTML a gusto de los buscadores no lo es tanto.

Al final son muchas reglas que hay que cumplir, y todo require muchísimo tiempo.
No es sólo tiempo para tus propios proyectos, es tiempo que se ha de repetir de nuevo en cualquier proyecto ajeno.
Por eso me he plantado fabricar un plugin para PageSpeed Insights.

Seo en WordPress

En el caso de un WordPress, aunque es una plataforma común en muchas webs, es el “Theme” lo que determina toda la estructura de una página, condicionado también por los plugins.
El que conoce WordPress ya sabe que el Theme es literalmente el esqueleto.

Uno de los males comunes son los temas mal diseñados, o los temas modernos de WordPress con automatismos y asistentes para personalizar el diseño.
Muchos de ellos imprimen de forma estática estos valores a posterior de las hojas de estilos.
Esta técnica es correcta, siendo los estilos el diseño predeterminado, y los siguientes valores las sobre-escrituras de los mismos.
El problema está en cuando queremos mover algún estilo.

Ejemplo de ésto. Hay una técnica popular para acelerar páginas, que es mover todos los estilos al pie de página.
Lo podemos ver en una simple búsqueda.
¿Que pasa cuando un estilo pasa al pie, y la sobreescritura de alguno de estos se queda en la cabecera?
Pues que perdemos esa propiedad de personalizar el tema.

El Seo en WordPress no está sólo en el contenido del texto, también está en la estructura HTML.
Por eso encontramos a muchos SEO diciendo cosas como “Tema optimizado para el SEO”.

Este es uno de los problemas cuando queremos optimizar una página ante el Seo y ante el PageSpeed de Google.
Y mi plugin para PageSpeed Insights tiene una herramienta específica para eso.

Influencia de Google PageSpeed Insights

A día de hoy nadie sabe hasta que punto es determinante o no sacar la máxima puntuación de Google PageSpeed Insights.
Quien se dedica a ello dice que es muy importante.
Quien tiene un tema bien seo optimizado que vender también dirá lo propio.
Otras web de perfiles profesoinales en el seo que no tocan el tema tan de cerca, dicen lo contrario.

Dado que Google es dueño y señor del buscador de Google, y es él y sus algoritmos quienes deciden donde situar a cada uno, lo mejor es sacar la puntuación máxima posible.

En mi optimización 100/100, ya dije en otra página que a corto plazo no he notado una mejora notable en mi seoposición, pero si he notado un incremento en el Adsense de Google.
Pero es pronto para saber si mi optimización puede mejorar mi status en el Serp.

Voy a estar generando contenido al tiempo que iré optimizando con este plugin y experimentando con él.

Mi propio Plugin para PageSpeed Insights para corresponderle y ser su sumiso

En el aprendizaje super acelerado de Seo y optimizaciones varias, el PageSpeed es el que más complejo.
Cuando crees entender una cosa, tocas de aquí y rompes de allá.

He dedicado unos 2 meses para entender cada cosa y practicar con varios ejemplos, distintos temas, distintas situaciones, y en instalaciones distintas.

He puesto un gran esfuerzo en hacer capaz de procesar y manipular cada cosa desde este plugin.
Porque no es eficiente ni razonable hacer cambios manuales en cada instancia distinta, y bajo el riesgo de perder cosas por actualizaciones y cambios.

La idea de este plugin para PageSpeed Insights es conseguir ejecutar esos procesos de conversión, de forma automática y auto-regenerable.

El nombre que he puesto a este plugin para PageSpeed Insights, es “Fix Render Blocking & Minify”.
Por nada en especial, no se me ocurría ningún nombre.

¿Que hace este plugin para PageSpeed Insights por mi?

Os pongo un video donde demuestro como optimizo completamente una web en pocos minutos, y acontinuación os explico como funciona este plugin.

Si te interesa este plugin y estar al tanto de su desarrollo o quieres utilizarlo, suscribrete

Se instala en el código Html 5 franjas en la cabecera, y 5 franjas en el pie de página, para poder priorizar el lugar de cada objeto o grupos de objetos, incluso mover pedazos de bloques Html allí.
Es como un cajón con separadores.

En la siguiente descripción, se trata a los objetos como “manejadores”.
Manejador, es la traducción de “HANDLE”.
Handle es lo que utiliza wordpress para mencionar a cada objeto de estilo o script. Cada uno de ellos tienen un nombre único.

Funcionalidades del plugin para PageSpeed Insights

General

  • Proxy para dar y quitar funcionalidades a todo el plugin entero según sea la página/entrada, tipo de post, nombre del objeto (manejador/handle)
  • Exportar e Importar la configuración, que me sirve tanto como para tener un backup mientras juego con varias opciones, o para clonar la misma configuración entre varios sites.
  • Limpieza de caché (Sí, esto tiene su propio caché)
  • Restaurar valores de fábrica.
  • Una lista de sitios para hacer testings.
  • Activar/Desactivar “Compresión Gzip”, “Header expires”, “Accept encoding”

Depurar (Debug)

  • Rastreo, vuelca en ficheros mensajes relacionados con el runtime. (Con sistema LogRotate)
  • Volcado de página. Nos permite ver el HTML real y podemos hacer simulaciones con cambios frente a los servicios que nos testean.
  • Reporte en el pie de página, la lista de objetos procesados y sus propiedades.

Procesamiento de Styles

  • Proxy de reglas adicionales aplicados a la carga y procesamiento de “styles”.
  • Posicionamiento automático preferente de todos los manejadores.
  • Posicionamiento forzado de los manejadores listados.
  • Posicionamiento especial (antes o después de cualquier tag o texto html).
  • Priorización de orden por nombres de manejadores listados.
  • Modos especiales: Asignar a lista de manejadores modo de “combinado” o “enlinea”
  • Minificar Css

Procesamiento de Scripts

  • Proxy de reglas adicionales aplicados a la carga y procesamiento de “scripts”.
  • Posicionamiento automático preferente de todos los manejadores.
  • Posicionamiento forzado de los manejadores listados.
  • Posicionamiento especial (antes o después de cualquier tag o texto html).
  • Priorización de orden por nombres de manejadores listados.
  • Asignación de “defer” “asynch” o ambos, a una lista de manejadores.
  • Modos especiales: Asignar a lista de manejadores modo de “combinado” o “enlinea”
  • Asignación de “defer” “asynch” o ambos, a los objetos del tipo “combinado”
  • Minificar Js

Procesamiento de Html

  • Proxy de reglas adicionales aplicados a la carga y procesamiento de “scripts”.
  • Minificar Html
  • Desplazamiento de código HTML (me resuelve el problema de cuando algún tema imprime de forma estática su sobre-escritura de estilos)
  • Inserción de código adicional Scripts en, Inicio-cabecera, Fin-cabecera, Inicio-pie, Fin-pie
  • Inserción de código adicional Styles en, Inicio-cabecera, Fin-cabecera, Inicio-pie, Fin-pie

Caza de enlaces externos

  • Lista de patrones url’s para cazar enlaces externos:
    Captura los enlaces, los descarga, opcionalmente los minifica, y los cachea.
    Un enlace local se puede manipular y se le aplica el expire-headers
  • Cazar en los objetos cacheados:
    Los enlaces externos pueden contener otros enlaces externos.

Tracking de Google Analytics

  • Proxy de reglas adicionales para la aplicación o no del tracking de Google Analytics.
  • Código UA.

Tracking de Piwik

  • Proxy de reglas adicionales para la aplicación o no del tracking de Piwik.
  • Dirección del servidor.
  • Sitio Id de piwik.

Lista de objetos cacheados

  • Lista de los manejadores cacheados tipo Styles y tipo Scripts (Se pueden borrar para que se regeneren)
  • Listado de Links externos cazados (Se pueden borrar para que se regeneren)

Listado de trazados

  • Lista de ficheros volcados del Depurar-Rastreo (Se pueden descargar y borrar)

Descargar ‘FRBM’

 

Descargar plugin frbm para WordPress

Sobre nosotros Pedro Reina

Más de 12 años de experiencia en programación PHP+Mysql+Html. Webmaster aprendiendo SEO. Entusiasta de la informática y la electrónica, pequeño emprendedor y fabricante de ideas.

Deja un comentario