Cada archivo CSS, que está utilizando tu sitio web, añade tiempo a la velocidad de carga de la página.

A veces esto es inevitable, sin embargo, en la mayoría de los casos se pueden combinar dos o más archivos CSS usando la conocida técnica de “copiar y pegar”.

Al código CSS no le importa dónde está o en qué cantidad de archivos se encuentre.

A menudo, una de las razones por que las que tienes varios archivos CSS, es porque el diseñador de tu página ha encontrado que es más fácil trabajar con archivos separados.

Combinando archivos CSS aceleras la carga de tu página.
Combinando archivos CSS aceleras la carga de tu página.
Un archivo CSS, que contiene toda la información de tus archivos CSS combinados, funcionará igual de bien y mejorará la velocidad de tu página. Combinando todo el CSS en un archivo se reduce considerablemente la cantidad de tiempo que tarda en cargar la página web ya que se reduce la cantidad de recursos que el navegador tiene que cargar antes de mostrar la página.
¿Cómo combinar CSS?
A menudo se puede simplemente copiar y pegar el contenido de cada archivo CSS para hacer un archivo principal CSS. Tendrás muchos archivos CSS que están siendo cargados y puedes crear un nuevo archivo CSS que contenga todo el contenido de los otros.

Con este método, se mantendrá todos tus viejos archivos CSS a salvo y nombrados correctamente por si tienes que utilizarlos de nuevo.

A continuación, actualiza el código HTML con el nombre del nuevo archivo y elimina todas las declaraciones a los archivos antiguos.

Otra forma de hacerlo es tener dos o tres archivos CSS y simplemente añadir el contenido de un archivo en otro ya existente. Por ejemplo, puedes tener un archivo CSS llamado “main.css” y otro llamado “sidebar.css” que están declarados en el código HTML. Para combinarlos, puedes copiar el contenido de “sidebar.css” y pegarlo el contenido de “main.css.”

Una vez que hayas hecho esto, quita la declaración a “sidebar.css” del HTML. Ahora tienes un solo archivo CSS en lugar de los dos que tenía que cargar el navegador antes de mostrar la página web. Tu página web ahora cargará más rápido.

¿Quieres más?

No te pierdas las actualizaciones del blog y recibe mas información en tu email sobre el correcto “Posicionamiento en Google“.

¡Suscríbete y mantente al día!

Suscríbete…

¿Me Compartes?
Me gustaría conocer tu opinión sobre este artículo en la sección de comentarios que encontrarás a continuación y que lo compartas para que otras personas lo puedan disfrutar. Gracias.
Share on Facebook0Tweet about this on TwitterShare on Google+0

2 comentarios para: Combinar CSS Externos

  1. FABIOLA

    Hola, por favor me puedes explicar cómo: “actualiza el código HTML con el nombre del nuevo archivo y elimina todas las declaraciones a los archivos antiguos” en WordPress
    Gracias

    • Gian Oliveira

      Hola Fabiola, esto es un poco complicado de explicar por aquí ya que eso depende de la plantilla que estés utilizando. Cada plantilla es diferente y cada desarrollador programa distinto. Lo mejor es que busques en el código fuente de tu plantilla (no de WordPress, solamente de la plantilla) con mucha calma, desde donde se declaran los archivos .css y .js para modificarlos. Un saludo!

Deja un comentario

Los campos marcados con * son obligatorios.

Borrar formularioEnviar Comentario