Cómo eliminar el JavaScript que bloquea la visualización de la web


Eliminar el Javascript es una de las cosas tediosas que ocurren cuando de pronto tu página no arranca como debiera.
Pasa cuando llevas un tiempo blogueando. Un día se te ocurre hacer las veces de SEO y desembarcar en Websmaster de Google y te conduce a Google Page Speed.

Es lo que me ocurrió cuando me vine a Blogger, los primeros meses no fueron fáciles, hice muchas búsquedas y consultas, porque el blog pesaba mucho.
eliminar javascript
Añadir leyenda


La configuración de los slugs (el dominio+el título del post+html)→ la caja de arriba, que en blogger añaden la fecha y al final el .html, hacía incompatibles los enlaces que tenían los posts con wordpress a pesar de las redirecciones.

Observé que en wordpress hay quien utiliza el slug con fecha y otros sin ella → el famoso %%postname%%

Al final intenté corregir el máximo de posts, pero claro perdí parte de los contadores de las redes sociales, marcadores sociales.

Twitter me preocupaba poco. La red había suprimido los contadores, aunque excepcionalmente algunos blogs lo llevan.

Entrando en materia, vi que al principio mi página tardaba 9,5 segundos en abrirse lo que suponía un engorro para volver a posicionarse.

Ya lo había pasado mal en wordpress, incluso escribí un post sobre reducir el tiempo de carga, creyendo que lo había conseguido reconozco que las imágenes y las infografías pesaban bastante. Una infografia puede pesar unos 8 MB (8 Megabites) lo que hace que tu mismo te aburras al abrir la página.

¿Qué es el JavaScript?

Sin tener idea de lo que era me di cuenta, a base de observar otros blogs, y curiosamente uno de los más llamativos es el mismo Google que puso su "faldón" o bannner sobre la ley de cookies en la parte superior de la página. O sea que Google te dice que molesta el banner y encima te lo pone.
Averigué como quitar el banner de la Ley de Cookies gracias a otro blog de Blogger →  En Oloblogger, que es el blog más completo sobre Blogger de Google.

Aclarar que yo tengo mi propia Ley de Cookies que me traje de wordpress y que va conmigo en la maleta.

De ese modo una parte del análisis de developper.google estaba salvada.

El Javascript lo que hace es entorpecer al visitante de tu blog al impedirle la visualización correcta de la mitad de la página en la parte de arriba, sobre todo en el móvil. Te evita por ejemplo tener una idea clara del menú, a lo sumo sólo ves un post, una foto grande y nada más.

Aunque el Javascript seguía molestando y di con la solución, eso sí reduciendo muchas imágenes e infografias que quedaban muy feas.

Para ello tuve que hacer un pequeño trabajo de verdadero websmaster y experto o aficionado html, lo que se dice en mecánica ver el coche por dentro.

Hay un apartado cuando abres Blogger y encuentras en el margen izquierdo:


Página
Diseño
Plantilla
Te vas a Plantilla → haces una copia de seguridad por si acaso (Hay un asterisco arriba a la derecha)
En el cuadro central hay una plantilla a escala de tu blog, pone → Edición de HTML
y encuentras entre aspas < > un código que pone:
<script con un texto y cierra >
o de esta forma
<script type='text/javascript'> y cierra también
o de esta otra forma
<script> </script>

Estos códigos o comandos hacen ralentizar el blog a parte de que hacen que los contenidos, no tengan buena visibilidad en un laptop u ordenador de sobremesa o en un smartphone.

Descubrí que el texto

Cómo eliminar el JavaScript que bloquea la visualización de la web

impedía cantidad de funciones en el blog y que las cosas que más bloqueaban curiosamente eran los anuncios de Google (utilizan cantidad de scripts)
Las cajas de las redes sociales (Facebook, Twitter, Google Plus), por lo que decidí quitarlas.
Por lo que verás en el blog que no las tengo colocadas.

Gracias a ello, conseguí que el blog descendiera de 9,5 segundos a 5,5
En otra entrada o post te contaré como bajé de 5,5 a 2 segundos

Eliminar el JavaScript que bloquea la visualización y el CSS del contenido de la mitad superior de la página, es una tarea que para los paganos o no técnicos, supone tiempo, salvo que seas un explorador como yo. Una de las sugerencias que leí, era trasladar los javascripts lo más lejanos de la cabecera. Ahora la estética del blog o de la web, sería un asunto secundario, por el que he optado.

En consecuencia y siguiendo los consejos, todo lo que empezaba por javascript, lo lleve al footer o abajo del blog. Tenerlos en el header o arriba, te perturban la apertura del mismo.

En lo referente al CSS, no lo he modificado, porque tiene unas aplicaciones que me interesa tener en el blog. Si consigo alguna solución te la comentaré.

Si tienes un blog en wordpress y no entiendes de código, prueba estos plugins

Async JS and CSS y Script to footer



Imágen elaborada en Recite