Diez herramientas para optimizar CSS

Posted on viernes, abril 30, 2010 by Puzzle

Optimiza tu CSS (Plantilla)

Os voy hacer una cuenta matemática muy simple: tienes un blog o web, quieres que tu blog/web cumpla una función, cualquiera que fuera esta te aseguro que necesitas visitas, muuchas vistas (vamos, es lo que todos queremos) de donde provienen el máximo porcentaje de visitas hacia una pagina?¡ CORRECTO.. "Buscadores".. Por eso debemos caerle bien a google para que nos ponga en esos primeros puestos que tanto anhelamos.. Para ello necesitamos seguir una seria de tareas para que googlebot (el robot de google) nos indexe en su maravilloso buscador y nos de un buen lugar en ese ranking..
Entre todas las tareas a cumplir, que son muchas (advierto que no conseguimos ese primer puesto en el buscador de google con una sola tarea a seguir sino con el conjunto de muchas) Hoy os hablere de como optimizar una plantilla.. Y explico el porque..

A Googlebot le agrada y mira con MUYY buenos ojos las paginas livianas, facil de cargar para la comodidad del visitante (recuerda también que no todos tienen tu maravillosa conexion ^^) entre estas podemos mencionar: Los iframes, imagines, banners, videos, PLANTILLA (Muy importante esta) todo este conjunto hace o no hace que tu pagina carge rápidamente o pesimamente ante cualquier buscador, es un hecho y debemos luchar contra el.. Caigamosle bien al googlebot ;)

Lo que acontinuacion os enseñare, sera 10 herramientas muy monas para reducir el peso en "kb" de nuestra plantilla, básicamente estas lo que hacen es reducir los espacios innecesarios y otros demás ajustes para comprimirlas a la mínima expresión.


Clean CSS: Muy fácil de utilizar simplemente pegamos el código o le damos la url del mismo.
Puede configurar el nivel deseado de compresión (la compensación a una mayor compresión de lectura es más difícil) y personalizar las opciones de compresión. Se imprime un informe línea por línea después para mostrar exactamente lo que se ha cambiado.

Flumpcakes: Misma metodología, no es tan practico, cuando genera el código optimizado tenemos que copiarlo y pegarlo en el nuevo CSS de forma manual.
Una característica interesante es la función de vínculo de retroceso que le proporciona una dirección URL que puede marcar en cualquier momento y volver a ver estado comprimido de la hoja de estilos.

Icey CSS Compresor: Extremadamente rápido, tiene el “problema” que no genera el archivo, hay que copiarlo directamente del html que genera.
Hay un montón de opciones de compresión se puede establecer y se ocupa de los colores, las mediciones (unidades), las reglas y propiedades CSS. También proporciona una útil herramienta para combinar simultáneamente la combinación y la compresión de hasta tres archivos CSS separados.

CSS Drive's CSS Compresor: Tiene dos modos, modo normal y el modo Avanzado (que tiene unas cuantas opciones más que se pueden establecer). Puede eliminar los comentarios (opción franja comentarios) o especifica para despojar a los comentarios que superen un límite de caracteres determinados, por lo que retiene comentarios que son cortos. modo regular es perfecto para aquellos que no son muy exigentes - sólo elegir entre la Luz, Normal, y la compresión Super Compacto y ya está listo para el rock.

Online CSS Optimizer: Es otra sencilla herramienta de optimizacion. Tienes dos formas de entreda de tu CSS: ya sea a través del cuadro de texto correspondiente en la pagina o que vinculen directamente a su hoja de estilos. A veces pasara que necesitas revertir la compresión, pues puede hacerlo a través de la aplicación Descomprimir CSS en el sitio. (Util en algunos casos)

Format CSS: FormatCSS le permite pegar el código CSS válido, corregir y estandarizar el código fuente. Hay varias opciones disponibles y las normas que se pueden aplicar para lograr el tipo de formato que desee - incluyendo un pedido de CSS en orden alfabético, de la capitalización de su código, y algunas opciones para hacer frente a los estilos.

Prettyprinter.de: No se limita a CSS - también formatos de PHP, Java, C + +, C, Perl y JavaScript, lo que es un excelente "one-stop-shop" para su formato necesidades si le toca trabajar con cualquiera de los otros idiomas admitidos. Cuenta con un total de 13 opciones diferentes se pueden establecer entre ellos "Reducir los espacios en blanco", "Eliminar líneas vacías", y automáticamente después de la adición de nuevas líneas de llaves.

CSS validation Service: Es muy sencillo de utilizar, simplemente introduzca la dirección URL de la hoja de estilos y te mostrara el estado de su hoja, señalara los errores, advertencias y otras cuestiones.

Tabifier: Es la web en varios idiomas-herramienta específicamente diseñada para la normalización de guiones en el código fuente. Es compatible con HTML, CSS y el estilo de C. Es una herramienta sencilla, excelente para la rápida aplicación de formato a los guiones.

CSS Optimizer: Es un optimizador muy simple, tiene la opción de vincular a la dirección URL de su hoja de estilo, cargando un archivo CSS, o directamente ingresando sus estilos. Es una herramienta sencilla que los "plug-and-chu" no hay opciones, así que el procedimiento de optimización seguirá siendo el mismo.


Lo mejor de lo mejor ;) para esos webmasters o bloggeros (aprendicez o veteranos) Si queréis hacer la prueba poco a poco con cada uno, perfecto.. Por otro lado sin ánimos de dar preferencia a uno en particular (Por que no lo uso por ser el MEJOR sino por costumbre ^^).
Clean CSS es el que comunmente utilizo.. No lo llamaria por favorito porque todos me han ayudado bastante, mas bien por costumbre ^^

Como SÉ muy bien que estais interezados en ese tema magico de "posicionamiento" en los buscadores favoritos.. Poco a poco os ire mostrando todas las medidas y las tareas a seguir para ir escalando peldaños en Google, yahoo o cualquier otro buscador..

0 comentarios:

Publicar un comentario