Embellecer código html, css o javascript para entenderlo mejor

Embellecer código html, css o javascript para entenderlo mejor

Cuando miras el código fuente de páginas web en internet es habitual que sean ilegibles.

Cuando te pilla de nuevo sueles pensar que se debe tratar de un error.

Luego descubres que es una práctica habitual para reducir el peso de los documentos web y así optimizar su carga.

Embellecer código html, css o javascript para entenderlo mejor 1
fragmento de código de la web de marca.com

¿hay algo que podamos hacer para leer estas páginas web de un modo más amigable?

Embellecedores de código

Los embellecedores de código son programas capaces de comprimir un documento .css, .html o .js. O de hacer el paso contrario.

En internet podemos encontrar muchas páginas que ofrecen este servicio a cambio de mostrarte publicidad.

Veamos algunos de los que a mi me gustan:

  • http://minifycode.com/. Me gusta por su sencillez. Su punto débil es que no tiene certificado SSL.
  • https://codebeautify.org/. Tantas opciones asustan. La parte buena es que no te faltará ninguna. Es útil para muchos más lenguajes de programación e incluso para texto plano.
  • https://ctrlq.org/beautifier/ . Es estrictamente un embellecedor. No comprime código. Me gusta por su sencillez y limpieza. Es fácil de usar y para tabular código de los 3 el que más me gusta.

Veamos un ejemplo

El siguiente ejemplo de un documento html

Embellecer código html, css o javascript para entenderlo mejor 2
Ejemplo de código html minificado

Se transforma a (se muestra únicamente un fragmento)

html formatedo online
html formatedo online

¡Hola!

Querido lector,

¡Ya no hay excusa para leer cualquier código web!

¡Si te ha gustado este contenido te animo a seguirme en mi perfil de empresa de Linkedin!

¿Te ha gustado esta publicación?

¡Valora sobre 5 estrellas esta publicación!

Puntuación media / 5. Votos:

Todavía no hay votos. Sé el primero en valorar la entrada.

Si te ha gustado este contenido...

¡Sígueme en las redes!

Vaya, parece que hay puntos a corregir

¿Me ayudas a mejorar?

Francesc Ricart
hola@francescricart.com

Aprender y enseñar. Enseñar y aprender. En el ámbito docente soy docente ocupacional. En el ámbito profesional consultor web. Ofrezco servicios de mejora continua y mantenimiento web. ¿Qué quieres aprender hoy? Encontraréis más acerca de mi en la página sobre mi

No hay comentarios

Escribir un comentario

  Acepto la política de privacidad

Responsable: FRANCESC RICART MUÑOZ.

Finalidad: Gestionar los comentarios que realizas en este blog.

Destinatarios: No se cederán datos a terceros, salvo obligación legal.

Derechos: Tienes derecho a acceder, rectificar y suprimir los datos, así como otros derechos, como se explica en la política de privacidad.