Cuando empezamos a personalizar el blog, rara vez pensamos en el tiempo de carga, es normal, ya que el entusiasmo de ver cambios en nuestro blog hacen que nos olvidemos de cosas que también son importantes. Cada caracter que tu pongas, espacios, comentarios etc, ocupan espacio, por ello, una buena forma de hacer que el CSS que usamos sea más ligero, es comprimirlo.
Aunque comprimir el CSS no se reduce tanto el peso de nuestro documento, comparado por ejemplo, con optimizar las imágenes, cualquier cosa que ayude a aligerar la carga del blog, es bienvenida. Existen varias herramientas para lograrlo y una que me gustó, y que conocí gracias a Balluart, es CSS Drive.
Con CSS Drive, es posible comprimir el CSS y concervar los comentarios dentro de este, para poder localizar el CSS que corresponde a cada sección, considerando que al comprimirlo, se hace más difícil de leer para nosotros, al momento de querer editarlo.
Para mantener los comentarios, elige la opción "Don't strip any comments", (como se muestra en la imagen) aunque antes de comprimir tu CSS puedes eliminar comentarios adicionales que estén dentro del código, que son los que están entre: /*...*/, y mantener solamente el comentario que viene al comienzo de los estilos de una sección específica, por ejemplo: del header, del menú de navegación etc, aunque es tu decisión.
Si vas a comprimir todo el CSS de tu plantilla, puede ser buena idea que antes exportes tu blog, o bien, guardes el CSS en un archivo de texto, por cualquier cosa (te arrepientas, etc) y por supuesto, antes de guardar los cambios con el nuevo CSS comprimido, verifica en vista previa que todo luzca bien.
Muchas gracias por la info no había sabido de esta herramienta y es muy buena opción junto la optimización de las imagenes, la carga del sitio es importante tanto para los usuarios como para google.
ResponderSuprimirDe nada, es una herramienta sencilla y efectiva, y si tienes razón la experiencia del usuario debería ser muy importante, para evitar que nos abandonen antes de que puedan ver nuestro contenido, yo lo he hecho, por mi parte, voy a seguir optimizando mi blog.
ResponderSuprimirNo se si ya los has visto pero echa un vistazo a esto:
http://googlewebmaster-es.blogspot.com/2010/04/videos-de-matt-cutts-es-la-velocidad.html
Buen día!
Habia leído en los foros de google pero no había visto el vídeo, gracias. Corrobora lo que habias comentado. Saludos!
ResponderSuprimirdisculpa la ignorancia Karlita linda, pero al conprimir que gano, una de las cosa es espacio en la caja de la plantilla, pero que más.
ResponderSuprimirme interesa el tema
Saludos rFactor Resources y buen día!.
ResponderSuprimirBueno Junior, ahorras algunos bytes, dependiendo de que tan extenso sea tu CSS; no me refiero al espacio físico, sino al peso de tu plantilla.
Nuestras plantillas tienen un peso, y entre más pesado sea mas tarda en cargarse.
Como decía "no es tanto" lo que ahorras en bytes comparado por ejemplo cuando optimizas las imágenes, pero para quienes quieren tomar en cuenta "cada detalle" para aligerar la carga del blog puede ser considerado.
El inconveniente puede venir al momento de querer editar algo, ya que cuando lo comprimes verás linea tras linea de código y para algunos puede resultar muy difícil poder leerlo, y eso dependerá que tan fácil te muevas en este.
salu2!
Es una excelente recomendación la de optimizar el CSS, pues en lo Blogger lo andas cargando en todas las páginas normalmente.
ResponderSuprimirYo hace tiempo traduje y subí el mismo script a Blog and Web, CSSTidy: http://blogandweb.com/cssoptimo/
Gracias por el dato Francisco, está muy completo, seguramente lo usaré en un futuro ;)
ResponderSuprimirBuen día!
Hola Karlita, yo uso Bananascript http://www.bananascript.com/ tbn es recomendable, una preguntita aunque suene tontita pero no hay pregunta tontita creo yo, he visto en muchos casos que hablamos de agregar scripts antes del las etiquetas skin, otros casos en el /body, /head y otros, cual es la diferencia entre ellos? por ej. que pasaria si quiero agregar un script que hace un carrusel de imagenes? es solo un ejemplo ojo, pero bueno podrias explicarme un poco de eso porfavor asi yo puedo hacer mis pruebas y entender mejor. Gracias :-)
ResponderSuprimirSaludos,
Miguel
No Miguelito, también creo que no hay pregunta tontita; bueno, dependerá del scripcito sea chiquito o grandecito, no vayas a creer que me refiero al tamañito, esa ya es otra cosita, me refiero a lo que hace, generalmente se pone en la cabecita, es decir entre las etiquetas <head> </head>, aunque también se puede poner antes de </body>, pero es mejor prestar atención a la recomendación que hace quien lo facilita para no tener sorpresitas.
ResponderSuprimirMejor echa un vistazo a esto:
http://www.w3schools.com/js/js_whereto.asp
Buen fin de semanita :D
Una gran herramienta, gracias por la recomendación, seguro la utilizaré seguido.
ResponderSuprimirHola Olmo ¿cómo estás?, de nada, también echa un vistazo al que ofrece Francisco de Blog and Web, trae algunas opciones extras y también está disponible en español ;)
ResponderSuprimir