Para los que trabajáis en diseño y creación de páginas web, para los clásicos que conocéis los secretos del HTML, para los que entendéis la filosofía de los DIVS, los TABLES y resto de jergas que componen el esqueleto de un site… encontraréis curioso lo que os voy a mostrar aquí.
Blogmundi descubre un site que permite realizar una representación gráfica del código de una página web con un sistema de colores que identifica los elementos internos:
- azul: para los enlaces (la etiqueta A)
- rojo: para las tablas (etiquetas de TABLA, TR y TD)
- verde: para la etiqueta del DIV
- violeta: para las imágenes (la etiqueta de IMG)
- amarillo: para formularios (FORM, INPUT, TEXTAREA, las etiquetas SELECCIONA y de OPCIÓN)
- naranja: para los saltos de línea y las citas (etiquetas BR, P, y BLOCKQUOTE)
- negro: la etiqueta HTML, el nodo de la raíz
- gris: el resto de las etiquetas
El resultado es una figura semejante a la mostrada abajo, donde se puede, con un poco de práctica, identificar errores y descubrir formas de optimizar la programación de nuestras páginas.
