⚡ La GRAN mentira del Google Page Speed y su velocidad ⚡ |
¡Feliz navidad amable lector! ¡Feliz navidad educada lectora! Con Papa Noel trasnochado y secuestrado en mi habitación y los reyes a la vuelta de la esquina en B30 no paramos…
Hoy charlamos del Page Speed. ¿Es útil para SEO? ¿Realmente mide la velocidad de tu página? Quédate… el día de hoy tenemos un SEO-post ameno 😄
Lo vamos a redactar en un tono absolutamente desenfadado por ser las datas que son. Mas ya antes que nada… ¡dale al play!
Índice del artículo
En el último post del año traigo al que es uno de mis mejores amigos a día de hoy.
En este momento, por circunstancias de la vida, muchas veces mis mejores amigos suelen ser también las personas con más talento en sus disciplinas o bien como poco muy buenos… son realmente buenos y podría decir que todos configuran el
equipo B30.
Jaime Sempere ha sido programador de HP y de varias start-ups con gran capital en el ecosistema emprendedor español.
Del mismo modo, es alguien con quien conecto pues tiene exactamente la misma manía que yo, tan insana como romántica: think big o bien lo que es lo mismo…
piensa en grande.
Está creando un Content Management System que competirá con el mismísimo Wordpress (aunque él afirme que no y a pesar de las innumerables discusiones que hemos tenido sobre ese tema): Mishell.
Fue el creador del pluginjunto conmigo, el que pusimos sin costo a disposición de toda la comunidad.
En terminante, es capaz de hacer que el código «hable», algo que constato cuando voy a verlo a su piso de soltero en Zaragoza y miro sus monitores, hasta arriba de numeritos que no alcanzo a entender, sobre una mesa llena de Redbulls vacíos y alguna que otra copa de Baileys a medio terminar por mi parte.
Código es poesía. Sempere… dales caña en el último post del calendario 2018 de Blogger3.0.
¡Nos vemos a la vuelta lector!
Nadie lo sabe, mas una vez tuve que salvar al Universo. Recolecté las cinco gemas del infinito, surqué dos galaxias, negocié con Estela Plateada e imploré ante Galactus del otro lado del orificio negro de una supernova.
Pues bien, todo aquello no fue nada en comparación con la labor que tengo el día de hoy entre manos:
escribir sobre el Page Speed.
Y tú querido lector, lo sé (al igual que supe cómo hacer reír a Galactus – y salvar al cosmos – con un simple chiste de Gila), no paras de preguntarte cosas cómo:
Bueno, pues dale un sorbito a la botella de ron, arremángate y coge el bisturí que nos toca diseccionar al Page Speed.
Empezando por la última, servidor, además de artista bohemio, estrella malograda del rock and roll y un amante irregular con instantes de auténtico genio mezclados con otros de mediocridad, también guarda en el guardarropa un traje de programador, justo a la vera de las mallas de Spiderman.
Si has utilizado el complemento, posiblemente habrás visto mi nombre por ahí junto al imitador más grande de Dani Martin que se está perdiendo España (si quieres sacarle los colores a Dean, puedes preguntarle por esto abajo en los comentarios).
Pero ya antes, déjame adelantarte. No, amigo, no hay nada como las bolas de dragón.
Como pequeño aparejador de Matrix, me agrada que haya belleza en el código. Que sea simple, fácil, como un jardín Zen en el que cada cosa está donde tiene que estar y hace lo que tiene que hacer.
Por eso, creo que puedo entender un poco al incomprendido Google Page Speed de algún modo… lo que no quiere decir que no sea siendo consciente de la gran importancia desaforada y errónea que se le da a día de hoy.
Con los dos puntos de vista contrapuestos presentes… voy a aportar mi opinión como programador parafílico de los bits.
¿Preparado para saber lo que quiere Google? Lo único que Google te pide, es una pequeña, pequeña cosa de nada:
–
Todo.
(Ves cómo las bolas de dragón irían realmente bien aquí).
Google tiene una idea (atinada pero algo alejada de la realidad) de cómo tendría que ser la página perfecta, en términos de optimización (ojo, charlamos de optimización y no de velocidad ).
➔ El Page Speed no te señala verdaderamente la velocidad cuantitativa de tu página . No. Nones. No. Repito no. Para el del fondo de la clase. Que no. Para los que vengan al día siguiente y se les haya olvidado lo que dimos el día de ayer. Que no.
Lo que te dice el Page Speed es el grado de mejora que tiene tu página respecto a esa versión ‘perfecta y también idealista’ que podría ser tu página.
En otras palabras, si tu página
saca un 80en Page Speed, no significa necesariamente que sea más lenta que una que
ha sacado 90, sino que tienes más margen de mejora en cuanto a optimar tu página.
Tu página podría sacar un 100 y otra página de 90 aún podría ganarte en velocidad cual Flash de MARVEL con sobredosis de Redbull.
Y no solo eso. Sus criterios para determinar la puntuación, a veces son un tanto absurdos (ver más adelante el caso desgranado de dinosaurioss.com).
Pero no me creas solo a mí. Exactamente los mismos chicos del archiconocido plugin WP-Rocket, escribieron un buen artículo () donde con atrapas incluidas mostraban esta gran incongruencia:
A continuación, te dejo una captura extraída del artículo en cuestión.
Señalar, además, que el sitio rápido aún pesa más que el lento (prácticamente 900Kbs frente a 431kb), con lo que su velocidad aún tiene más mérito ya que carga el doble de contenido. Mira cómo aún así Google le da una mala puntuación:
Sitio rápido con mala puntuación (izquierda) VS lugar lento con buena puntuación (derecha)
Para no soltarte rollos, te he preparado unas tarjetas a código a fin de que puedas consultar rápidamente los criterios más sonados de Page Speed.
Las tarjetas señalan cuatro puntos:
Y como chiste te contaré más adelante, cómo el tema de haberme trabajado estas tarjetas (las diseñé y programé expreso para este post) me hicieron provocar una pifia con la que pasé más tensión que cuando Galactus me miraba con ojos tiernos.
Aquí, ciertos ejemplos más comunes por los que Google Speed intentará sacarte los colores.
Haz click en«
rotar» sobre las tarjetas para tener información más completa.
Significado:Eliminar los saltos de línea y espacios de los archivos CSS y de JS resultando archivos de tamaño más ligero
Deberías ‘minificar’ tus ficheros siempre y cuando puedas, tu web funcionará igualmente bien, utilizando archivos más pequeños
Rotar
Importancia:Media-baja
Facilidad de implementar:Fácil pero en algunos casos puede presentarte problemas de visualización.
Plugins:WP Rocket, W3 Total Cache
Volver
Significado:Es un método de comprimir tus archivos (además de minificarlos) a fin de que ocupen menos, y por consiguiente tu página cargue ya antes.
Rotar
Importancia:Media-baja
Facilidad de implementar:Cualquier servidor de el día de hoy en día podrá servir archivos GZIP, para ello puedes modificar el .htaccess o bien emplear plugins
Plugins:WP Rocket, W3 Total Cache, WP Fastest Cache…
Volver
Significado:Bueno, creo que se autoexplica, ¿no? No seas gañán/gañana y toda vez que subas imágenes a WordPress comprímelas.
Rotar
Importancia:Alta. Puedes ahorrar mucho comprimiendo apropiadamente las imágenes.
Facilidad de implementar:Simplemente antes de subir una imagen, comprímela. Te invito a la herramienta on line y gratuita
Plugins:Como opción alternativa a TinyPng (que te la recomiendo en frente de instalar más plugins), te dejo.
Volver
Significado:Se refiere a cargar los CSS críticos a fin de que tu página se vea bien primero, y postergar los que no sean críticos, para así no bloquear la carga de tu página.
Rotar
Importancia:Baja
Facilidad de implementar:Complicado. Es un poco utopía intentar conseguir algo así si el tema no está hecho a medida para ello.
Plugins:El plugin WP-Rocket sí que me llegó a hacer este punto bien en un weblog sin mayor problema. No sé qué clase de magia negra usará, mas lo hizo bastante bien.
Volver
Significado:Esto es lo mismo que hablábamos con los archivos CSS, pero para los ficheros de JavaScript. Es decir, desplazar archivos que se cargan en el header, al final de tu página, para que no bloqueen la carga.
Rotar
Importancia:Baja
Facilidad de implementar:Lo mismo que en el punto anterior, no es sencillo decidir o bien saber qué archivos JavaScript son precisos en el ‘header’ y cuáles puedes cargar más adelante.
Plugins:Nuevamente el complemento WP-Rocket se comportó bastante bien en este punto en una de las pruebas que hice en un weblog.
Volver
Significado:Lo que hace la caché es que cuando una persona navegue por tu blog, no tenga que volver a cargar los archivos comunes de varias páginas, y usar una versión previamente guardada de ese archivo (básicamente serán ficheros JavaScript y CSS)
Rotar
Importancia:Baja
«A poco que uses algún plugin con recursos externos, te marchas a hallar este fallo. No siempre y en toda circunstancia puedes precisar la caché de navegador (scripts externos). Así que solo queda resignarse y hacer oídos sordos»
Si incluso así deseas intentarlo
Volver
Ahora, incluso el análisis del Page Speed, te sugiere que utilices formatos de ‘nueva generación’ como JPEG 2000, JPEG XR y WebP. Mas ya basta de charla técnica, vamos a hablar de Romuald, de Dean y de Amazon. Que sí hombre, que sé que sin un tanto de salseo os dormís.
Disclaimer: La narración que prosigue a continuación es pura ficción y cualquier similar con la realidad es pura coincidencia.
Los tres encapuchados con túnica se reunieron en el sitio acordado, a la hora señalada, bajo la tenue luz de diseño de webs baratas de consumirse. Ni móviles, ni nombres, ni nada que sirviera para registrar aquella reunión en las sombras, tal como dictaban las normas.
Con ademanes ceremoniosos, hicieron el saludo que les identificaba como miembros de aquella secta cuyo nombre no se puede pronunciar.
–
No puedes hacer eso, hermano lector. – afirmó el encapuchado con voz afelpada y pausada.
– ¿No queréis que la gente sepa la verdad? ¿No sois vosotros los que lucháis contra el sistema y por despertar a la gente?
– Claro que sí, mas no a costa de dispararnos en el pie. ¿Recuerdas que aún estás en período de prueba, hermano? – su voz contrastaba con la de sus vídeos histriónicos. Era calmada e hipnótica, al tiempo que firme.
– Siempre y en todo momento me gustó el peligro. Y la verdad. Dejarme llevarla a más gente. Dejarme mostrar vuestras vergüenzas para persuadirles de una vez. A fin de que despierten, se olviden del Page Speed, y se centren en otras cosas más importantes, como pelear por sus sueños y un buen enlazado interno.
Los dos interpelados cruzaron miradas por un momento, en el que parecieron decirse todo. Finalmente acordaron:
– Está bien, mas no olvides que estás a prueba. A ver cómo sale esto. Si luego tenemos inconvenientes, habrá consecuencias.
Y ambos se distanciaron del sitio con el mismo sigilo con el que habían llegado.
El aspirante (que ahora lucía una media sonrisa maquiavélica) se quedó en la penumbra, frotándose las manos pensando «mah, mas qué post más rico y salsero voy a escribir»
Recuerdo cuando Romuald Fons (le debo una entrevista, caballero, en cuanto deje al Whiskey, el tabaco y las señoritas que cobran por horas, palabra de borracho) presentaba su plantilla Orbital, en la que llegó a enseñar un
Page Speed cien de 100.
¿100 de 100 con WP? Mis respetos, hermano. Creo que lograr un 100 de 100 con WP es bastante jodido (detalles más adelante – pero qué forma más zafia de generarte intriga y no soltarte, eh amigo lector -).
Pero si vas, por servirnos de un ejemplo, a su página de aves exóticas, te puedes encontrar esto:
Y ahí la tienes, del mismo modo
posicionada en primer lugarpara muchas de sus palabras clave con gran volumen de búsqueda.
¿Es Romuald estúpido? ¿Es Orbital una mierda? ¿Van todos y cada uno de los perros buenos al cielo? No. Ni muchísimo menos. Y sí (junto con los caballitos ponys y los osos cariñosos).
Estoy seguro de que Romuald -si quisiese- podría subir esa puntuación hasta un cien o bien casi un 100, pero sencillamente creo que no se ha preocupado aquí (y para mala suerte de él, lo hemos cogido).
Ha pasado un poco del Page Speed,
centrándose en las cosas que realmente importanpara posicionar una página.
Lo cual me recuerda el caso de otro SEO quizá todavía «aún más guapo» que Romuald Fons.
Me refiero a ese monstruo de las SERPS. A esa fiera de las palabras clave. A ese bestia parda del enlazado interno. diseñador tienda online del Inbound Marketing. Un gigante, que digo un gigante, un titán, un semi dios, un hijo bastardo fruto de una salvaje orgía entre SemRush, Ahrefs y Sixtrix… el gran… Dean Romero.
Ahí estaba (y ahí prosigue) Dinosaurioss.com a la perfección posicionada. Adjunto la atrapa de SemRush del mismo:
Posicionando una web sin preocuparnos del Page Speed
Resulta que todo ese trabajo de posicionamiento lo hizo Dean, sin tocar, ni preocuparse lo más mínimo sobre el Page Speed.
Cuando Dean se propuso sacar en venta la misma plantilla que había construido a la medida para ese nicho, nos pusimos a mirar el Page Speed y sorpresa, sorpresa… sacaba unos cuarenta y pocos puntos en el Page Speed.
Actualmente, tras instalar y ajustar el complemento WP-Rocket (para aplicar
lazy loadingde imágenes y minificación de CSS y Javascript), hemos logrado subirla hasta un 78:
Y según Google Page Speed estos son nuestros 4 pecados capitales cometidos para no llegar al 100:
Te los desgrano (y casi desmonto) uno por uno. Atento a lo tiquismiquis y tocapelotas que puede llegar a ser el Page Speed:
Aún no es algo banal el empleo de webP en WordPressy, en mi opinión, hasta el momento en que Wordpress no incluya soporte nativo del formato, mas sobre todo, hasta el momento en que la mayoría de los navegadores no sean compatibles, creo que es mejor de momento no hacer experimentos con el formato.
Aún no es algo banal el empleo de webP en WordPressy, bajo mi punto de vista, hasta que Wordpress no incluya soporte nativo del formato, pero sobre todo, hasta que la mayoría de los navegadores no sean compatibles, creo que es mejor de momento no hacer experimentos con el formato.
No quería dejar de mencionar a Amazon (este no acudió a la reunión nocturna de la secta, pero nos puso un fax diciendo que adelante con sacar sus vergüenzas también).
El gigante Amazon, con probablemente una de las mejores infraestructuras informáticas de todo el mundo (no en balde, la revende como servicios en la nube) saca un ‘impresionante’
33.
Y tú quejándote de que no llegas a 100
¿Hacen falta más comentarios? Si a Amazon no le quita el sueño su Page Speed… ¿por qué te lo va a quitar a ti?
Déjame contarte mi metida de pata y un momento de agobio infinito que pasé mientras que escribía este post.
Cuando empecé el blog post, estuve diseñando y programando las tarjetas rotatorias que has visto al comienzo.
Parte del trabajo consistía en ajustar el CSS, para eso utilicé la posibilidad que te da Wordpress para añadir un CSS personalizado. Fíjate en la pinta que tiene el botón para guardar los cambios:
Ese «bonito» botón de «Publicar»
El proceso consistía en ir haciendo ajustes continuamente y pulsando el botón para guardar. Adicionalmente, de cuando en cuando también guardaba el boceto del artículo.
Básicamente el proceso era: ajuste del CSS, pulso en publicar. Toquecillo en el artículo guardo boceto. Así mil veces.
Recuerdo que el día precedente (ya antes de ponerme con las tarjetas), mientras escribía el comienzo del artículo, estuve pensando:
«ostia, como le dé a Publicar blog post en vez de Guardar borrador la puedo liar parda».
¡Adivina qué pasó! Que en algún instante, en el ajuste número 200, mi psique ya solo veía botones azules para publicar, y ¡plas!.. Efectivamente, la líe parda y le di a publicar al blog post (este post) en boceto y sin formato alguno casi.
50 minutos estuvo publicado en la portada de Blogger3cero, un post sin imagen asociada, con un título de mierda provisional y con divagaciones de un pseudo escritor borracho que aún procuraba y experimentaba con el tono del artículo.
Cuando me di cuenta: sudores fríos, los huevos en la garganta, y una risa de desquiciado me atacaron a la vez. Pensé «bueno no pasa nada, por el hecho de que se haya visto un ratillo, además la mayoría de gente entra a artículos, ya antes que en la home… bla bla».
A los 5 minutos (cuando ya lo había puesto nuevamente en boceto) me llega un Whatsapp de Dean «
¿qué has hecho ido?«. «Están compartiendo por Twitter tu post sin terminar…» (ahí ya los huevos me hicieron en la garganta ‘ding, ding, ding!’).
Captura de mi liada parda en todo su esplendor
Afortunadamente, no me echaron de la secta y todo quedo en una buena metidita de pata de servidor sin mayor daño (salvo mi subida de tensión y un pensamiento de «pero qué burro eres» que aplaqué con media botella Jack Daniels).
Todo esto tuvo una buena cosa.
Un lector del weblog (David Joven, con una web muy guapa a propósito), dejó un comentario avisando del fallo.
Intercambié dos correos con él para comentarle que sí, que trabajo con monos con ballestas en mi casa y uno había disparado una flecha en todo el botón de «Publicar» involuntariamente.
Y me comentó
algo interesante sobre el alojamiento de Raiola.
Resulta que habían migrado el software de sus servidores a un servidor más veloz (LiteSpeed frente al clásico Apache), para progresar las velocidades de carga (puedes leer más de esto en el link adjuntado al final del artículo).
Con esto, la propia página de David, había pasado de ochenta a 95 en mobile y de 95 a 100 en Desktop (me comentó que por medio del plugin Autoptimize ya había logrado buenas puntuaciones en el Page Speed).
Así que este apartado es también para felicitar a Raiola por sus esfuerzos en tener unos servidores rápidos que satisfagan las necesidades de sus clientes del servicio.
Nota de Dean: comentario especial para Alvarito de Raiola Networks, que tiene que venir a verme a la capital de España ya, ¡vuelve cabrón! Y a Martín de Raiola, que da a preferido en Twitter a cosas que no debería xD
Más allá de que Raiola pueda decir «que tío más salado» y me envíen un buen Whiskey (Álvaro, japonés si puede ser, por favor), no guardo ninguna relación con ellos ni nada afín, pero al César lo que es del César.
La anécdota es 100 por ciento real, y creo que pegaba bien como chiste y prueba de que
tu alojamiento web también puede influir en el Page Speed. Además, puesto que lo pasé mal, así me resarzo, le doy sentido al instante de agobio máximum infinito y todo acaba teniendo sentido, y cuadrando como un puzle cósmico.
Me perdonaréis, pero nunca fui demasiado bueno con el copy de los subtítulos…
El inconveniente de intentar optimizar y exprimir a fondo el Page Speed con una plataforma como WordPress es (entre otros)
su arquitectura de plugins.
Los plugins van añadiendo ficheros JavaScript y CSS según estén programados. Esto te puede llevar a inconvenientes a la hora de (como hemos hablado) minificar o bien tratar de aplazar la carga de estos ficheros.
Y ahí está uno de los problemas principales a los que te enfrentarás si te obsesionas con lograr el 100 del Page Speed con tu página de Wordpress. Será difícil que llegues al 100 sin ‘
romper algo‘ por el camino.
Mi consejo (en el caso de que quieras jugar un poco a progresar tu Page Speed) es que pruebes ciertos complementos mentados. Te dejo una pequeña lista a continuación:
Muchas veces se achaca un mal Page Speed a una plantilla. Pero como has podido ver durante todo el artículo, la plantilla llega hasta donde llega. Progresar tu Page Speed, prácticamente siempre será cuestión de complementos .
¿Cuál es la frase cliché más repetida por los marketers después de la de «aportar valor» (arcada)?
Pues la de
«dame tu dinero para que yo pueda vivir la vida de mis sueños», digo… «
foco,
foco,
foco«. ¿Te suena?
El Page Speed es una métrica con la que la gente se obsesiona, y sus efectos en el momento de posicionar, semejan bastante intrascendentes.
En la sección final tienes múltiples artículos.
Entiendo que a todos nos agrada tenerla cuanto más larga mejor. Por eso nos obsesionamos con esa métrica.
Y lo peor, es que al final, olvidarás «el foco»: el centrarte en cosas de tu página web que importan un millón de veces más para posicionar una web que tener un Page Speed de cien (trabajar los contenidos, la navegación/usabilidad, un buen enlazado interno… vamos todo lo que haga que el visitante permanezca más rato en tu página).
Así que mi consejo es, si realmente decides ponerte a ajustar tu Page Speed, tómate como mucho una hora o bien dos de tu tiempo, con una cerveza al lado, mientras pruebas ciertos complementos, aprendes a configurarlos y juegas un poco a manosear aquí y allá a ver qué efecto van provocando.
Un placer, señores y señoras, y jamás me dejen de danzar
rock&roles:.
Jaime Sempere.
###
Créditos Blogger3.0 2018
Agradecimientos a todos y cada uno de los que habéis hecho mi trabajo posible este 2018: Merced a mi equipo B30, a Raquel Cabalga, a Marián, mi AV, a Jony Ive, mi socio de Google Adsense, a Mijael, asociado de Amazon, a mi abogado y amigo Raúl Florido, Edu Coromina, Pablo Suizo, Pedro, Indale y Marcos, mis traffickers, Raquel y Laura, mis articulistas estandarte, Ana Miller, mi hermano pequeño Emilio García, Sánchez podcaster, Óscar Fernández, Mihaela jefa editora de B30 y mi mejor amiga, Gaby y Jorge, buenos programadores y mejores socios y amigos, Borja Aranda, Jaime Sempere, por soportar el mayor golpe de mi vida con sus brazos cuando me derrumbé en el suelo, a toda la gente de mi WhatsApp que aguantan mis audios todos los días, a mi madre que lee cada entrada de este blog con devoción, mi hermana pequeña, mi perro que ya no está, Kovu, te amaré siempre y en todo momento, mi otro perro que aún continúa, Maxi, me hace feliz besarte. Javi Pastor por enseñarme tanto en Cádiz, Luis Revuelto, Andrés Kloster, Jony Botello, mi nuevo asociado en la agencia de contenidos, Olibot, por enseñarme y motivarme solo con su ejemplo, Guille de HolaSEO, Luis Villanueva por esta siempre y en todo momento ahí para mí, Chuiso, Alex Navarro y Romuald Fons, que entre todos subieron el nivel del ámbito y me obligaron a ser aún mejor. Marcos Séculi, mi nuevo proyecto de amigo en 2019, Madre SEOperiora, Cilver, mi nuevo diseñador y talento emergente como pocos, a Iván y Edu por confiar en mí para mentorías, Aida, Tere, Pilar, mis amigos de Quédate con el cambio, Lúa, Cova, os quiero de forma atemporal, Charly, Juan de Useo, gracias por nuestro accountability, a todos y cada uno de los profes del membership site por lo general, Bruno Ramos, Ingeniero posicionamiento en buscadores, JoseLab, Rupas, Gastre, Jesús León, mi caso de éxito de DTV y espero que pronto amigo, Sas y Pablo, mis 2 mejores amigos de toda la vida compañeros de aventuras, Publisuites, Webpositer, Hotmart, Enlazalia, por aparecer en mi camino. Judith Tiral, por ser tan bonita conmigo, Rocío, por ser sensacional, Mila Coco, Omar de la Fuente, rey en el Norte, Maik Santamorte con el que espero grabar una canción de rap, Ambkor, por haberme integrado en su manada de lobos como uno más, Alex Novás, Jessica Hierro, Bianca y a todos y cada uno de los que me dejo en esta inacabable lista, que son muchos.
| Êîììåíòèðîâàòü | « Ïðåä. çàïèñü — Ê äíåâíèêó — Ñëåä. çàïèñü » | Ñòðàíèöû: [1] [Íîâûå] |
