Optimizar entrega de CSS en una web alojada en Blogger

daenolpa1997 · 2017-08-01T10:22:30-0500

Tengo una duda y es esa. Page Speed Insights me dice que debo optimizar la entrega de 3 enlaces CSS. No tengo ni la mas minima idea de como hacer esto, pero si me instruyen por código puedo hacerlo.

Estos son los CSS que provocan un bloqueo:

https://www.blogger.com/static/v1/widgets/2258130529-css_bundle_v2.css

http://fonts.googleapis.com/css?fam...leway:400,500,600,700,800,900|PT+Sans:400,700

http://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css

Sindulfo Santacruz · 2017-08-01T10:29:02-0500

de seguro usas insight de google que te arroja ese tipo de resultados.

punto 1. salvo que desactives, no podrás hacer nada al respecto.
punto 2. no todo debe funcionar al 100%... ni el mismo google obtiene 100% en sus métricas.. (has la prueba)

daenolpa1997 · 2017-08-01T10:58:56-0500

Comprendo lo que dices, pero me agradaría tener al menos un 70% cuento solo con 65. PageSpeed Insights

Supongo quizás es mejor enfocarme en lo que puedo realizar, como la optimización de imágenes y enlaces nada más.

- - - Actualizado - - -

siscon dijo:
de seguro usas insight de google que te arroja ese tipo de resultados.

punto 1. salvo que desactives, no podrás hacer nada al respecto.
punto 2. no todo debe funcionar al 100%... ni el mismo google obtiene 100% en sus métricas.. (has la prueba)

Comprendo lo que dices, pero me agradaría tener al menos un 70% cuento solo con 65. PageSpeed Insights

Supongo quizás es mejor enfocarme en lo que puedo realizar, como la optimización de imágenes y enlaces nada más.

Sindulfo Santacruz · 2017-08-01T11:04:18-0500

hay un usuario.. creo de nick gian o algo así.. que desarrollo un xml (es como un theme de wordpress pero para blogger) que se enfoca en especial a la velocidad... lo hace a base de desactivar algunas funcionalidades y técnicas de programación...

checka eso.

Johan Sibulo · 2017-08-01T11:15:47-0500

Hay un usuario que no me acuerdo del nombre, que hace esto para Blogger, no alcanzarás los 100 puntos, pero mejorarás el tiempo de carga considerablemente

Karasu · 2017-08-01T19:12:31-0500

Hola, [MENTION=183271]daenolpa1997[/MENTION]

para poder "quitar" el css_bundle-v2.css sólo deberías buscar esto:

HTML:

<head>

y cambiarlo por esto otro:

HTML:

&lt;!--<head>--&gt;&lt;head&gt;

Esto último lo que hace es comentar y así "quitar" de alguna manera ese estilo que carga blogger por defecto.

Sobre lo segundo (fonts[dot]googleapis), copia todo el contenido css y lo pegas arriba de todo el css que trae tu tema actualmente. 🙂
Respecto a los iconos fontawosome, no sé como ayudarte con eso, ya que no los uso, prefiero svg para iconos en blogger. :encouragement:

Bueno eso sería, yo lo hago de esa manera y me funciona muy bien. Espero que te ayude. Saludos.

PD: Recuerda hacer respaldo del tema antes de hacer algo, así te evitas problemas si cometes algún error.

daenolpa1997 · 2017-08-01T21:23:00-0500

NatsuxD dijo:
Hola, [MENTION=183271]daenolpa1997[/MENTION]

para poder "quitar" el css_bundle-v2.css sólo deberías buscar esto:

HTML:

<head>

y cambiarlo por esto otro:

HTML:

<head>

Esto último lo que hace es comentar y así "quitar" de alguna manera ese estilo que carga blogger por defecto.

Sobre lo segundo (fonts[dot]googleapis), copia todo el contenido css y lo pegas arriba de todo el css que trae tu tema actualmente. 🙂
Respecto a los iconos fontawosome, no sé como ayudarte con eso, ya que no los uso, prefiero svg para iconos en blogger. :encouragement:

Bueno eso sería, yo lo hago de esa manera y me funciona muy bien. Espero que te ayude. Saludos.

PD: Recuerda hacer respaldo del tema antes de hacer algo, así te evitas problemas si cometes algún error.

Muchísimas gracias. Una explicación bien detallada y sencilla. Ahora no me da tiempo de implementarla, pero mañana lo hago.

Enviado desde mi SP-4001 mediante Tapatalk

AlexxxBcN · 2017-08-02T01:59:34-0500

Hola para las fuentes puedes usar este script , a mi me funciona

Yo lo tengo puesto antes de </head>

Insertar CODE, HTML o PHP:

<script type='text/javascript'>
      //<![CDATA[
      //CSS Ready
      function loadCSS(e, t, n) { "use strict"; var i = window.document.createElement("link"); var o = t || window.document.getElementsByTagName("script")[0]; i.rel = "stylesheet"; i.href = e; i.media = "only x"; o.parentNode.insertBefore(i, o); setTimeout(function () { i.media = n || "all" }) }
      loadCSS("//fonts.googleapis.com/css?family=Open+Sans:400italic,700,400");loadCSS("//fonts.googleapis.com/css?family=Dosis:400,700");loadCSS("//maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css");loadCSS("http://fonts.googleapis.com/css?family=Oswald");loadCSS("http://fonts.googleapis.com/css?family=Skranji");
      //]]>
    </script>

A mi solo me queda por " arreglar "

Quitar el JavaScript que bloquea la visualización de contenido:
http://code.jquery.com/jquery-latest.min.js

Perysoc · 22 Abr 2018

Kuroneko-kun dijo:
Hola, [MENTION=183271]daenolpa1997[/MENTION]

para poder "quitar" el css_bundle-v2.css sólo deberías buscar esto:

HTML:

<head>

y cambiarlo por esto otro:

HTML:

<head>

Esto último lo que hace es comentar y así "quitar" de alguna manera ese estilo que carga blogger por defecto.

A mí me funcionó perfectamente, gracias.

AlexxxBcN dijo:

Hola para las fuentes puedes usar este script , a mi me funciona

Yo lo tengo puesto antes de </head>

Insertar CODE, HTML o PHP:

<script type='text/javascript'>
      //<![CDATA[
      //CSS Ready
      function loadCSS(e, t, n) { "use strict"; var i = window.document.createElement("link"); var o = t || window.document.getElementsByTagName("script")[0]; i.rel = "stylesheet"; i.href = e; i.media = "only x"; o.parentNode.insertBefore(i, o); setTimeout(function () { i.media = n || "all" }) }
      loadCSS("//fonts.googleapis.com/css?family=Open+Sans:400italic,700,400");loadCSS("//fonts.googleapis.com/css?family=Dosis:400,700");loadCSS("//maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css");loadCSS("http://fonts.googleapis.com/css?family=Oswald");loadCSS("http://fonts.googleapis.com/css?family=Skranji");
      //]]>
    </script>

A mí esto me funcionó, pero ¡ojo! hay que cambiar la familia de fuentes que se carga por la que te esté dando problemas ( es decir, en loadCSS("ponaquitufamiliadefuentes") ), y adicionalmente hay que eliminarla cuando se carga en la parte superior de la plantilla.

dj cruzi · 8 Jul 2018

hola, trabajo con blogger y mi rendimiento en pagespeed es casi 55/100 , alguien sabe como mejorar estos 2 puntos. -Aprovechar el almacenamiento en caché de los navegadores
-Habilitar la compresión

se los agradeceria mucho

natsu88 · 8 Jul 2018

dj cruzi dijo:
hola, trabajo con blogger y mi rendimiento en pagespeed es casi 55/100 , alguien sabe como mejorar estos 2 puntos. -Aprovechar el almacenamiento en caché de los navegadores
-Habilitar la compresión

se los agradeceria mucho

Para aprovechar el almacenamiento en cache, debes poner dentro del head esto:

HTML:

<include expiration='7d' path='*.css'/>
<include expiration='7d' path='*.js'/>
<include expiration='3d' path='*.gif'/>
<include expiration='3d' path='*.jpeg'/>
<include expiration='3d' path='*.jpg'/>
<include expiration='3d' path='*.png'/>

Optimizar entrega de CSS en una web alojada en Blogger

daenolpa1997

Sindulfo Santacruz

daenolpa1997

Sindulfo Santacruz

Johan Sibulo

Karasu

daenolpa1997

AlexxxBcN

Perysoc

dj cruzi

natsu88

Temas similares