English Português

formato-html-css-php

Mantener un código con buen formato, con comentarios, identación y separando en lo posible cada lenguaje web son buenas prácticas para facilitar el mantenimiento de un sitio o una aplicación web.

Sea un código que hicimos hace tiempo o aun peor, el código de otra persona, puede tornarse en un verdadero dolor de cabeza dar formato al código para entender mejor su lógica. La buena noticia es que existen herramientas para organizar el código de los principales lenguajes web:

HTML

HTML Tidy es una versión en línea de la librería Tidy, que a partir de código HTML directo o de una URL da formato al código. Además de organizar el código, también hace algunas optimizaciones como agrupar div’s, unificar clases y separar el CSS del HTML.

Ir a HTML Tidy 

CSS

A partir de la librería CSStidy, en su momento monté CSS Óptimo para uso personal, pero después de darle un toque de diseño y traducirlo al español, creo que puede ser una herramienta útil para todos. Tiene la opción para formatear el código CSS de acuerdo a un grado de optimización seleccionado.

Muy útil para formatear CSS, pero más aun, para optimizarlo y reducir el peso de una hoja de estilos en más de un 30%.

Ir a CSS Óptimo

PHP

Beautify PHP es una herramienta que a partir de un archivo PHP genera un código organizado y formateado, incluso codifica las imágenes para que no hagan una petición al servidor y se disminuya la carga del mismo.

Ir a Beautify PHP / vía kabytes

Fotografía de Kyle

Escrito por Francisco

Soy un gran aficionado del diseño y de todo lo que el código puede comunicar. Ingeniero mecánico por profesión, pero dedicado al desarrollo web a tiempo completo.

Blog / Twitter

Artículos relacionados

Sigue leyendo consejos, tips y tutoriales para tu blog.

Comentarios

  1. Kevin Maschke / Hace 785 días /

    Genial, muchas gracias!
    Lo probaré a ver que tal.
    Saludos!

    Responder a Kevin Maschke →
  2. Julia C. / Hace 726 días /

    Como hago para que los comentarios recibidos se vean como en el caso de esta pagina. Desde ya muchas gracias, no solo por la respuesta que imagino me darán sino porque gracias a Uds. voy día a día “desasnándome” un poquito mas. Julia C.

    Responder a Julia C. →
  3. Francisco / Hace 726 días /

    @Julia, creo que sería dificil contestar en un comentario. Se hace todo con CSS, son bordes y un color de fondo. Que se muestre en color intercalado (blanco/gris) lo hace este caso WordPress, en Blogger me parece existe un script (no lo encontré :( )

    Responder a Francisco →
  4. Julia C. / Hace 723 días /

    Gracias Francisco, intentaré el script.

    Responder a Julia C. →
  5. @sebasxnco / Hace 701 días /

    exelente esta herramienta muy util por que cuando uno esta programando cualquier web se le vuelve un enredo todo el codigo

    Responder a @sebasxnco →
  6. valeria / Hace 693 días /

    hola..mira sigo el blog tienen cosas muy interesantes, quisiera saber y perdon si no es la entrada adecuada, si existe algun codigo para enlazar una entrada a una imagen o hacer que la imagen para que en vez que se vea el contenido escrito se vea solo la imagen, posteo sobre peliculas y me gustaria q se vea mas estetico probe con la plantilla gallery pero me dejaba muy chatas las imagenes. Te agradere alguna respuesta. Saludos

    Responder a valeria →

Trackbacks

  1. Bitacoras.com

Responder

¡Gracias por dejar tu opinión! Por favor procura que tus comentarios estén dentro tema, que no sean promocionales (spam), ilegales u ofensivos, de otro modo, serán borrados.

Blog and Web es un blog de Blógstica

Términos de uso - Política de privacidad