¡Feliz navidad afable lector! ¡Feliz navidad educada lectora! crear pagina web barcelona en mi habitación y los reyes a la vuelta de la esquina en B30 no paramos…
Hoy hablamos del Page Speed. ¿Es útil para posicionamiento SEO? ¿Realmente mide la velocidad de tu página? Quédate… el día de hoy tenemos un posicionamiento web-blog post entretenido 😄
Lo vamos a escribir en un tono plenamente 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 verdaderamente 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 , tan insana como romántica: think big o lo que es lo mismo…
piensa en grande.
Está creando un CMS que competirá con el mismísimo WP (aunque él afirme que no y pese a las incontables discusiones que hemos tenido sobre ese tema): Mishell.
Fue el creador del pluginjunto conmigo, el que pusimos sin coste a disposición de toda la comunidad.
En definitiva, es capaz de hacer que el código «hable», algo que compruebo cuando voy a verlo a su apartamento 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 acabar por mi parte.
Código es poesía. Sempere… dales caña en el último artículo del calendario 2018 de Blogger3.0.
¡Nos vemos a la vuelta lector!
Nadie lo sabe, pero una vez tuve que salvar al Universo. Recolecté las 5 gemas del infinito, surqué dos galaxias, negocié con Estela Plateada y también imploré ante Galactus al otro lado del agujero negro de una supernova.
Pues bien, todo aquello no fue nada en comparación con la tarea que tengo el día de hoy entre manos:
escribir sobre el Page Speed.
Y tú querido lector, lo sé (como supe cómo hacer reír a Galactus – y salvar al universo – 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 libre, 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 al lado de las mallas de Spiderman.
Si has usado el complemento, probablemente 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, sencillo, como un jardín Zen en el que cada cosa está donde debe estar y hace lo que debe hacer.
Por eso, creo que puedo entender un poco al incomprendido Google Page Speed de algún modo… lo cual no quiere decir que no sea siendo consciente de la enorme importancia desmedida 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 desea 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 muy bien aquí).
Google tiene una idea (atinada mas 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 realmente 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 e 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 optimizar tu página.
Tu página podría sacar un cien y otra página de noventa 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 poco absurdos (ver más adelante el caso desgranado de dinosaurioss.com).
Pero no me creas solo a mí. Exactamente los mismos chicos del archiconocido complemento 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 lugar rápido aún pesa más que el lento (casi 900Kbs frente a 431kb), con lo que su velocidad aún tiene más mérito puesto 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) versus sitio 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í, algunos de los 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 toda vez que puedas, tu web funcionará igualmente bien, utilizando ficheros más pequeños
Rotar
Importancia:Media-baja
Facilidad de implementar:Fácil mas en ciertos casos puede presentarte inconvenientes de visualización.
Plugins:WP Rocket, W3 Total Cache
Volver
Significado:Es un método de comprimir tus ficheros (además de minificarlos) a fin de que ocupen menos, y por consiguiente tu página cargue antes.
Rotar
Importancia:Media-baja
Facilidad de implementar:Cualquier servidor de el día de hoy en día podrá servir ficheros 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 siempre que subas imágenes a WP comprímelas.
Rotar
Importancia:Alta. Puedes ahorrar mucho comprimiendo adecuadamente las imágenes.
Facilidad de implementar:Simplemente antes de subir una imagen, comprímela. Te recomiendo la herramienta on-line y gratuita
Plugins:Como alternativa a TinyPng (que te la recomiendo frente a instalar más complementos), 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 la medida para esto.
Plugins:El complemento WP-Rocket sí que me llegó a hacer este punto bien en un weblog sin mayor inconveniente. No sé qué clase de magia negra usará, pero lo hizo bastante bien.
Volver
Significado:Esto es lo mismo que hablábamos con los ficheros CSS, mas para los ficheros de JavaScript. Es decir, desplazar archivos que se cargan en el header, al final de tu página, a fin de 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 plugin 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 en el momento en que una persona navegue por tu blog, no deba volver a cargar los ficheros comunes de múltiples páginas, y utilizar una versión previamente guardada de ese fichero (básicamente serán archivos JavaScript y CSS)
Rotar
Importancia:Baja
«A poco que utilices algún plugin con recursos externos, te vas a encontrar este error. No siempre y en toda circunstancia puedes detallar la caché de navegador (scripts externos). Así que solo queda resignarse y hacer oídos sordos»
Si aun así deseas intentarlo
Volver
Ahora, aun el análisis del Page Speed, te sugiere que uses formatos de ‘nueva generación’ como JPEG 2000, JPEG XR y WebP. Pero basta de charla técnica, hablaremos de Romuald, de Dean y de Amazon. Que sí hombre, que sé que sin un poco de salseo os dormís.
Disclaimer: La narración que sigue a continuación es pura ficción y cualquier similar con la realidad es pura coincidencia.
Los 3 encapuchados con túnica se reunieron en el lugar acordado, a la hora señalada, bajo la tenue luz de unas velas al filo de consumirse. Ni móviles, ni nombres, ni nada que sirviese para registrar aquella reunión en las sombras, tal y como dictaban las reglas.
Con gestos ceremoniosos, hicieron el saludo que les identificaba como miembros de aquella secta cuyo nombre no se puede vocalizar.
–
No puedes hacer eso, hermano lector. – afirmó el encapuchado con voz aterciopelada y pausada.
– ¿ propuesta redes sociales é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 riesgo. Y la verdad. Dejarme llevarla a más gente. Dejarme enseñar vuestras vergüenzas para convencerles de una vez. A fin de que despierten, se olviden del Page Speed, y se centren en otras cosas más importantes, como combatir por sus sueños y un buen enlazado interno.
Los dos interpelados cruzaron miradas por un momento, en el que parecieron decirse todo. Por último acordaron:
– Está bien, pero no olvides que estás a prueba. A ver cómo sale esto. Si luego tenemos problemas, habrá consecuencias.
Y los dos se alejaron del lugar 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, cuando 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 100 de 100.
¿100 de cien con WordPress? Mis respetos, hermano. Creo que conseguir un 100 de cien con Wordpress 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 poner un ejemplo, a su página de aves exóticas, te puedes hallar 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 tonto? ¿Es Orbital una mierda? ¿Van todos y cada uno de los perros buenos al cielo? No. Ni muchísimo menos. Y sí (así como los caballitos ponys y los osos amorosos).
Estoy seguro de que Romuald -si quisiera- podría subir esa puntuación hasta un cien o prácticamente un 100, pero sencillamente creo que no se ha preocupado aquí (y para mala suerte de él, lo hemos pillado).
Ha pasado un tanto del Page Speed,
centrándose en las cosas que verdaderamente importanpara posicionar una página.
Lo como me recuerda el caso de otro posicionamiento web quizá todavía «aún más guapo» que Romuald Fons.
Me estoy refiriendo a ese monstruo de las SERPS. A esa fiera de las palabras clave. A ese bestia parda del enlazado interno. Al crack 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í sigue) Dinosaurioss.com perfectamente 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 40 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 conseguido subirla hasta un 78:
Y según Google Page Speed estos son nuestros cuatro 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 ser el Page Speed:
Aún no es algo banal el empleo de webP en WordPressy, en mi entender, hasta que WordPress no incluya soporte nativo del formato, pero sobre todo, hasta el momento en que la mayoría de los navegadores no sean compatibles, creo que es mejor por el momento no hacer experimentos con el formato.
Aún no es algo banal el empleo de webP en WordPressy, a mi modo de ver, hasta 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 por el momento no hacer experimentos con el formato.
No quería dejar de mentar a Amazon (este no acudió a la reunión nocturna de la secta, mas nos puso un fax diciendo que adelante con sacar sus vergüenzas también).
El gigante Amazon, con probablemente de las mejores infraestructuras informáticas de todo el planeta (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 eliminar a ti?
Déjame contarte mi metida de pata y un momento de agobio infinito que pasé mientras que escribía este artículo.
Cuando empecé el artículo, 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 customizado. 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 de manera continua y pulsando el botón para guardar. Adicionalmente, de cuando en cuando también guardaba el boceto del post.
Básicamente el proceso era: ajuste del CSS, pulso en publicar. Toquecillo en el post guardo borrador. Así mil veces.
Recuerdo que el día precedente (antes de ponerme con las tarjetas), mientras escribía el inicio del post, estuve pensando:
«ostia, como le dé a Publicar artículo en vez de Guardar boceto la puedo liar parda».
¡Adivina qué pasó! Que en algún momento, en el ajuste número doscientos, mi mente 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 primera plana de Blogger3cero, un post sin imagen asociada, con un título de mierda temporal y con divagaciones de un pseudo escritor borracho que aún buscaba y experimentaba con el tono del artículo.
Cuando me di cuenta: sudores fríos, los huevos en la garganta, y una risa de loco 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, 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 desquiciado?«. «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 blog (David Lozano, con una web muy guapa por cierto), 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 hosting 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 mejorar las velocidades de carga (puedes leer más de esto en el enlace adjuntado al final del artículo).
Con esto, la propia página de David, había pasado de ochenta a noventa y cinco en mobile y de noventa y cinco a 100 en Desktop (me comentó que por medio del plugin Autoptimize ya había conseguido buenas puntuaciones en el Page Speed).
Así que este apartado es también para felicitar a Raiola por sus sacrificios en tener unos servidores rápidos que satisfagan las necesidades de sus clientes.
Nota de Dean: comentario singular para Alvarito de Raiola Networks, que debe 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, mas al César lo que es del César.
La anécdota es cien por ciento real, y creo que pegaba bien como chascarrillo y prueba de que
tu hosting también puede influir en el Page Speed. Además, ya que lo pasé mal, así me resarzo, le doy sentido al momento de agobio máximum infinito y todo termina teniendo sentido, y cuadrando como un puzzle cósmico.
Me perdonaréis, mas jamás fui demasiado bueno con el copy de los subtítulos…
El problema de intentar optimar y exprimir a fondo el Page Speed con una plataforma como WordPress es (entre otros)
su arquitectura de plugins.
Los complementos van añadiendo archivos JavaScript y CSS según estén programados. Esto te puede llevar a problemas en el momento de (como hemos hablado) minificar o intentar aplazar la carga de estos ficheros.
Y ahí está uno de los problemas principales a los que te enfrentarás si te obsesionas con alcanzar 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 (caso de que desees jugar un tanto 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 a lo largo de todo el artículo, la plantilla llega hasta donde llega. Prosperar tu Page Speed, casi siempre será cuestión de complementos .
¿Cuál es la oración cliché más repetida por los marketers después de la de «aportar valor» (arcada)?
Pues la de
«dame tu dinero a fin de que yo pueda vivir la vida de mis sueños», digo… «
focoagencia de community manager en madrid >,
foco,
foco«. ¿Te suena?
El Page Speed es una métrica con la que la gente se obsesiona, y sus efectos a la hora de posicionar, parecen bastante intrascendentes.
En la sección final tienes múltiples artículos.
Entiendo que a todos nos agrada tenerla cuanto más larga mejor. De ahí que 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 verdaderamente decides ponerte a ajustar tu Page Speed, tómate como mucho una hora o 2 de tu tiempo, con una cerveza al lado, mientras pruebas alguno de los complementos, aprendes a configurarlos y juegas un tanto 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, socio de Amazon, a mi abogado y amigo Raúl Florido, Edu Coromina, Pablo Suizo, Pedro, Indale y Marcos, mis traffickers, Raquel y Laura, mis redactoras 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 asociados y amigos, Borja Aranda, Jaime Sempere, por aguantar el mayor golpe de mi vida con sus brazos cuando me derrumbé en el suelo, a todo el mundo de mi WhatsApp que soportan mis audios todos los días, a mi madre que lee cada entrada de este weblog con devoción, mi hermana pequeña, mi perro que ya no está, Kovu, te amaré siempre, mi otro cánido que aún permanece, Maxi, me hace feliz besarte. Javi Pastor por enseñarme tanto en Cádiz, Luis Revuelto, Andrés Kloster, Jony Botello, mi nuevo socio 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 toda circunstancia ahí para mí, Chuiso, Alex Navarro y Romuald Fons, que entre todos subieron el nivel del sector y me forzaron 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 web, JoseLab, Rupas, Gastre, Jesús León, mi caso de éxito de DTV y espero que pronto amigo, Sas y Pablo, mis dos 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 los que me dejo en esta interminable lista, que son muchos.
0 
Star