Borrar CSS no utilizado

Un sitio web tiene que ser rápido para no perder visitantes y no bajar en el ranking de los motores de búsqueda. Eliminar el CSS que no se utiliza es uno de los posibles consejos para ello. ¿Qué es eliminar CSS no utilizado? Te lo explicamos y te damos la solución para arreglar este problema.

¿Qué es eliminar CSS no utilizado?

Eliminar CSS no utilizado es una recomendación que puedes obtener al realizar una comprobación de tu sitio web. Es un consejo que indica que es inteligente eliminar el CSS no utilizado para que un sitio web sea más rápido.(1)

El problema del CSS no utilizado

CSS proporciona el estilo a una página web. Cuando un navegador escanea un sitio web, pasa cada línea de CSS. El navegador busca si debe aplicar el código a la página web. Si hay líneas de código que no están en uso, el navegador las comprueba para nada y esto lleva mucho tiempo extra.

Aunque un navegador es muy rápido y no siempre se nota, el CSS no utilizado afecta sin duda a la velocidad de carga de la página. A largo plazo, esto afecta a la usabilidad y, en última instancia, a los resultados de una página en los motores de búsqueda.

El impacto de la eliminación de CSS no utilizado en SEO

Eliminar el CSS no utilizado puede tener un buen impacto en el SEO de una página web. Elimina el código no utilizado, haciendo que el navegador cargue su sitio web aún más rápido. Puede que sea cuestión de milisegundos, pero marca la diferencia tanto para los visitantes como para el motor de búsqueda. Aunque la eliminación de CSS no utilizado no es la única manera de acelerar el sitio web, es sin duda un paso en la dirección correcta.

Mi consejo

Eliminar el CSS que no se utiliza es una buena forma de hacer que el sitio web sea un poco más rápido. Pero, ¿cómo hacerlo? Recomendamos utilizar el programa Google PageSpeeds Insights. Este programa escanea su sitio web en busca de numerosos problemas y, a continuación, proporciona el análisis. Eliminar el CSS no utilizado puede ser una de las recomendaciones que te hagan. La ventaja de PageSpeed Insights es que también te dice inmediatamente qué hacer para solucionarlo.

El libro más completo sobre la velocidad de los sitios web

He escrito tanto sobre la aceleración de sitios web y todo lo que implica, que me gusta dividirlo en diferentes secciones; general, herramientas, puntos de mejora de la velocidad y consejos. No dude en ver y consultar todos los enlaces que aparecen a continuación para obtener más información sobre herramientas y consejos para acelerar su sitio web.

General

• ¿Cuál es la velocidad del sitio web?
• Velocidad del sitio web: la división entre marketing y desarrollo
• La influencia del SEO en la UX
• La influencia del diseño web en el SEO
• SPA y SEO
• ¿Qué son las Google Core Web Vitals?

Herramientas

• Autoptimize
• Pagespeed.Compare
• W3 Total Cache
• Herramientas Pingdom
• Google Pagespeed Insights
• GTMetrix

Mejoras en la velocidad

• First Contentful Paint (FCP)
• Tiempo hasta el primer byte (TTFB)
• Tiempo para interactuar (TTI)
• Imagen de la vista más grande con contenido (LCP) precargado
• Activar la compresión de texto
• Reducir el CSS
• Tiempo total de bloqueo (TBT)
• Índice de velocidad
• Reducir JavaScript
• El mayor contenido de pintura
• Evitar el exceso de DOM
• Eliminar JavaScript no utilizado
• Imágenes en diseños modernos
• Conéctese con antelación a los orígenes necesarios
• Evite que JavaScript obsoleto llegue a los navegadores modernos
• Utilizar una política de caché eficaz para los elementos estáticos
• Eliminar módulos duplicados de JavaScript
• Evitar redireccionamientos múltiples
• Codificar imágenes con eficacia
• Utilizar la carga lenta
• Cargar las solicitudes importantes con antelación

Consejos generales

• Consejos para cargar rápidamente un vídeo
• Usar Edge SEO para un sitio web más rápido
• Instalación de una red de distribución de contenidos para SEO
• Optimización de imágenes para SEO
• El impacto del alojamiento en el SEO