{"id":226562,"date":"2022-09-04T18:31:00","date_gmt":"2022-09-04T15:31:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=226562"},"modified":"2022-11-08T18:55:09","modified_gmt":"2022-11-08T15:55:09","slug":"como-optimizar-la-entrega-de-css-en-wordpress-con-pocas-molestias","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/es\/como-optimizar-la-entrega-de-css-en-wordpress-con-pocas-molestias\/","title":{"rendered":"C\u00f3mo optimizar la entrega de CSS en WordPress con pocas molestias"},"content":{"rendered":"\n

CSS puede mejorar el aspecto general de su sitio web y es f\u00e1cil de usar, editar y mantener. La \u00fanica desventaja es la posibilidad de ralentizar la velocidad de carga de tu p\u00e1gina. Por lo tanto, este art\u00edculo creado por nuestro equipo en WpDataTables<\/a> le mostrar\u00e1 c\u00f3mo optimizar la entrega de CSS en WordPress.<\/p>\n

Si CSS no se entrega bien, el navegador deber\u00e1 procesar y descargar datos antes de que termine de mostrar su p\u00e1gina. Esto significa que los visitantes experimentar\u00e1n un retraso al ver su p\u00e1gina y pueden hacer clic en ella porque parece que no se est\u00e1 cargando. De ah\u00ed la importancia de optimizar la entrega de CSS, as\u00ed que sigue leyendo para saber c\u00f3mo evitar las trampas que podr\u00edan ralentizar tu p\u00e1gina web.<\/p>\n

Todo sobre la entrega de CSS<\/strong><\/h3>\n

B\u00e1sicamente,<\/strong> CSS, una hoja de estilo en cascada, hace que los sitios web se vean atractivos y, sin ellos, los sitios web a\u00fan estar\u00edan estancados en los a\u00f1os 90.<\/p>\n

Las p\u00e1ginas web, incluidas las p\u00e1ginas web de WordPress, est\u00e1n dise\u00f1adas con CSS. Cada tema de WordPress usa un archivo style.cc para crear una apariencia elegante. Agregar complementos agregar\u00e1 m\u00e1s hojas de estilo, por ejemplo, si descarga un complemento de widget, agregar\u00e1 un archivo CSS adicional (hoja de estilo) para crear el aspecto deseado.<\/p>\n

Los scripts CSS se cargan antes de que su sitio sea visible, lo que significa que su navegador no mostrar\u00e1 ning\u00fan contenido hasta que se procese la informaci\u00f3n CSS proporcionada. Esto da como resultado un bloqueo de procesamiento que ocurre cuando un navegador carga todos los scripts CSS antes de mostrar un sitio.<\/p>\n

CSS se puede usar de m\u00faltiples maneras para la entrega en WordPress, con muchas configuraciones diferentes.<\/p>\n

Independientemente de c\u00f3mo haya configurado su p\u00e1gina web, CSS en realidad puede ayudar a renderizar su sitio m\u00e1s r\u00e1pido.<\/p>\n

JavaScript y CSS que bloquean el renderizado: \u00bfqu\u00e9 es?<\/strong><\/h3>\n

\"C\u00f3mo<\/a><\/p>\n

Se esperan sitios de carga r\u00e1pida en nuestra sociedad de alta tecnolog\u00eda y es vital para el SEO de alto rango. PageSpeed \u200b\u200bInsights de Google<\/a> puede ayudarlo a comprender la velocidad de carga de su sitio. A veces, aparecer\u00e1 una advertencia cuando utilice la herramienta: "Elimine JavaScript y CSS que bloquean la representaci\u00f3n en el contenido de la mitad superior de la p\u00e1gina", pero aqu\u00ed hay una soluci\u00f3n a este problema.<\/p>\n

Es necesario renderizar el HTML antes de que un navegador pueda mostrar cualquier p\u00e1gina web. Mientras hace esto, encontrar\u00e1 scripts y hojas de estilo, y debe detenerse para solicitar y descargar ese archivo. Luego lo ejecuta y contin\u00faa pasando por el HTML. La mayor\u00eda de los temas y complementos para WordPress utilizan muchos archivos JavaScript y\/o CSS, lo que puede hacer que tarde mucho tiempo en procesar incluso una p\u00e1gina de su sitio.<\/p>\n

Esto evita que los visitantes de su sitio vean r\u00e1pidamente la informaci\u00f3n de las p\u00e1ginas web y, para empeorar las cosas, no es necesario cargar estos scripts de inmediato.<\/p>\n

Estos archivos innecesarios se conocen como CSS y JavaScript que bloquean el renderizado. Contin\u00fae leyendo para averiguar qu\u00e9 son y c\u00f3mo eliminarlos de su sitio de WordPress.<\/p>\n

Use Google Pagespeed Insights para descubrir CSS y JavaScript que bloquean el renderizado<\/strong><\/h3>\n

Los navegadores de carga lenta generalmente intentan procesar una cantidad significativa de c\u00f3digo CSS y, por lo tanto, no pueden mostrar la p\u00e1gina; sin embargo, no todos los recursos de CSS bloquean el procesamiento.<\/p>\n

Los sitios web aparecen en blanco o solo parcialmente visibles si el CSS se carg\u00f3 incorrectamente o a menos que el CSS est\u00e9 optimizado, lo que puede resultar en fuentes o dise\u00f1os incorrectos.<\/p>\n

Es importante comprender qu\u00e9 elementos son necesarios y cu\u00e1les no, para optimizar la entrega de CSS.<\/p>\n

Para iniciar el proceso de bloqueo de procesamiento, primero pruebe la velocidad de su sitio con Google PageSpeed \u200b\u200bInsights<\/a>.<\/p>\n

As\u00ed es c\u00f3mo:<\/p>\n

\"C\u00f3mo<\/a><\/p>\n