Algunas herramientas para realizar la compresión.

Afortunadamente, no es necesario que sea un desarrollador o que conozca uno de los lenguajes de programación para reducir el tamaño de los archivos de su sitio web. La minificación se ha convertido en una práctica común en el mundo del diseño web. Por lo tanto, no debería sorprenderse al saber que existen muchas herramientas maravillosas (y gratuitas) que pueden hacer el trabajo por usted.

Vea también nuestro 6 complementos de WordPress para dar nueva vida a sus artículos

Aquí hay una lista de herramientas útiles para comenzar. Dado que muchos de estos pueden minimizar múltiples tipos de código, he incluido las opciones de tipo de código entre paréntesis.

• • cssminifier.com et javascript-minifier.com (CSS y JS): estos dos minificadores de Andrew Chilton son fáciles de usar. Solo necesita pegar su código, luego hacer clic en el botón Minimizar para mostrar el código comprimido. Incluso puede descargar el código de salida como un archivo para mayor comodidad.
  • htmlcompressor.com (HTML, CSS y JS): esta herramienta de compresión / minificación en línea es compatible con los tipos de código HTML, CSS y JS. Incluso admite diferentes combinaciones de tipos de código como CSS + PHP y JavaScript + PHP. E incluso puede comprobar si hay errores en el código comprimido.

• • csscompressor.net (Solo CSS): este compresor CSS en línea es rápido, fácil y gratuito.

• • jscompress.com (Solo JS): esta herramienta de compresión de JavaScript le permite comprimir código JavaScript copiando y pegando, pero también puede descargar varios archivos JavaScript a la vez. Esto es ideal para combinar archivos JavaScript en un solo archivo para una mejor velocidad de carga de la página.
  • Herramientas de Dan - Herramientas de Dan proponer la ONU minify CSS y un para minimizar JavaScript . Ambas herramientas tienen una interfaz de usuario realmente limpia y fácil de usar. No ofrecen opciones avanzadas, pero son excelentes para propósitos comunes de minificación.

• • refresh-sf.com (HTML, CSS y JS): este compresor reducirá los tipos de código JavaScript, CSS y HTML. También incluye todas las opciones de compresión para cada tipo de código si las necesita.
  • Compilador de cierre (Solo JS): el compilador de cierre es parte de Herramientas de cierre , un conjunto de herramientas de Google Developers. Le permite minimizar su JavaScript junto con otras optimizaciones útiles. Puede usar su código Javascript ingresando la URL de la ubicación del archivo js y luego elegir cómo desea optimizar y formatear el código. 

Por ejemplo, usted elige optimizar su código para eliminar solo los espacios en blanco si lo desea. Una vez que haya hecho clic en el botón de compilación, reducirá el código (o lo compilará) por usted.

• • minifycode.com (HTML, CSS y JS): este sitio web ofrece minificadores para JavaScript , CO et HTML con una interfaz de usuario simple y limpia que comprime su código con un solo clic. También ofrece una herramienta "embellecedora" para descomprimir el código minificado a fin de hacerlo más legible (lo opuesto a la minificación).

Si está buscando herramientas fuera de línea para minimizar su CSS o JavaScript HTML localmente, aquí hay algunas opciones:

• phpied.com/cssmin-js/ (Solo CSS)
• yui.github.io/yuicompressor (JS y CSS)

Cómo reducir el tamaño de su HTML, CSS y JavaScript utilizando una herramienta en línea

Muchas de estas herramientas en línea tienen un proceso similar que implica los siguientes pasos:

• Pegue su código fuente o descargue el archivo de código fuente. 
• Optimizar la configuración para una salida específica (si hay opciones disponibles)
• Haga clic en un botón para comprimir el código.
• Copie el resultado del código minificado o descargue el archivo de código minificado.

Para este ejemplo, voy a usar las herramientas de minify de minifycode.com.

Ver también: Cómo añadir un código CSS con seguridad en WordPress consultando este enlace.

Primero, ubique el archivo CSS (comúnmente llamado style.css) en los archivos de su sitio web y ábralo usando un editor de páginas. Luego copie todo el código CSS en su portapapeles.

ir a minifycode.com y haga clic en la pestaña del minificador de CSS. Luego pegue el código CSS en el cuadro de entrada y haga clic en el botón Minificar CSS.

Una vez que se genera el nuevo código minimizado, cópielo.

Luego regrese al archivo CSS de su sitio web y reemplace el código con la nueva versión simplificada.

Es todo !

Repita el mismo proceso para reducir también los archivos JavaScript y HTML de su sitio web.

Cómo minimizar HTML, CSS y JavaScript en WordPress usando complementos

La forma más fácil de mantener su HTML, CSS y JavaScript al mínimo en WordPress es usar un complemento. Esto le permite optimizar automáticamente los archivos de su sitio web de WordPress para reducir el tiempo de carga de la página con solo unos pocos clics de botón.

Hay muchos complementos que harán el trabajo, pero mencionaré brevemente algunos ejemplos.

Autoptimizar (GRATIS)

La optimización automática es probablemente la Plugin de WordPress de los minify más populares. Es popular porque es fácil de usar y está repleto de potentes funciones. Puede agrupar (combinar scripts), minificar y almacenar en caché su código. Como beneficio adicional, tiene opciones adicionales para optimizar Google Fonts, imágenes, etc.

Para usar Autoptimize, puede descargar, instalar y activar el complemento desde el panel de WordPress en Complemento> Agregar nuevo.

Para obtener más información, consulte nuestra guía sobre:  Cómo instalar un plugin en WordPress

Una vez que el complemento está activado, vaya a Configuración> Optimización automática. Luego, en la pestaña Parámetros principales, marque el código que desea optimizar (HTML, CSS y / o JavaScript) y haga clic en Eguardar cambios.

También puedes hacer clic en el botón Mostrar configuraciones avanzadas en la parte superior de la página para personalizar aún más la optimización de su código.

¡Es más o menos eso! Bastante simple y poderoso.

W3 Total Cache (GRATIS)

W3 Total Cache es un excelente complemento de almacenamiento en caché que ofrece la capacidad de minimizar sus archivos HTML, JS y CSS.

WP Caché más rápido (GRATIS)

WP caché más rápido - Este complemento WordPress el almacenamiento en caché es extremadamente popular con altas críticas. Realiza varias optimizaciones de rendimiento, incluida la combinación y reducción de su HTML CSS y JavaScript para un mejor rendimiento.

Lea también nuestro artículo sobre plugins de WordPress 8 para añadir un chat en vivo en tu blog

Una vez que el complemento esté instalado, simplemente haga clic en la pestaña WP caché más rápido en la barra lateral del panel de WordPress. Bajo la pestaña Ajustes, encontrará opciones para combinar y reducir archivos HTML y CSS. Aunque minificar JavaScript solo está disponible en la versión pro.

Para resumir

Si desea que su blog sea más rápido y tenga un mejor rendimiento, debe reducir el tamaño de sus archivos HTML, CSS y JavaScript. Con todas las herramientas en línea disponibles, puede reducir fácilmente el código de cualquier sitio web. 

Complementos de 9 WordPress para ocultar el contenido de tu Blog para descubrir absolutamente

Para aquellos que usan WordPress, tiene a su disposición potentes complementos para minimizar estos archivos automáticamente con unos pocos clics.

Descubre también algunos complementos premium de WordPress  

Puedes usar otros plugins de WordPress para dar una apariencia moderna y optimizar el manejo de tu blog o sitio web.

Aquí le ofrecemos algunos complementos premium de WordPress que lo ayudarán a hacerlo.

Otros recursos recomendados

También lo invitamos a consultar los recursos a continuación para avanzar en el control y agarre de su sitio web y blog.

Conclusión