Vista 3D de una web con Firefox – Ver etiquetas anidadas
El kit de herramientas para desarrollador web de Firefox, tienen una opción que había pasado inadvertida para mi hasta hoy: La posibilidad de ver una web como si fuera el skyline de una ciudad, es decir, en La altura de los «edificios de esta ciudad», dependerá de la profundidad de anidación del HTML en la misma. Por ejemplo:
- <etiqueta1></etiqueta1> producirá una altura.
- <etiqueta1><etiqueta2></etiqueta2></etiqueta1> producirá dos alturas.
- <etiqueta1><etiqueta2><etiqueta3></etiqueta3></etiqueta2></etiqueta1> hará lo propio en 3 alturas.
El efecto que produce en mi blog es el siguiente:
Activando la opción 3D
Desde el menú «Herramientas / Desarrollador web / Mostrar herramientas» podemos activar estas. Si observamos en la barra inferior, en la parte derecha nos aparecerá la opción «Vista 3D».
Activando dicha opción, la web que estemos viendo se nos mostrará en 3D, con la opción de girarla con el ratón, además de poder hacer zoom sobre la misma. Como comentaba, el eje Z, o profundidad, la marcará el número de etiquetas HTML que tenga un elemento. Por ejemplo, el botón de «Me gusta» del widget de Facebook está anidado en unas cuantas (19): A «vista de pájaro», es muy sencillo detectar que partes de nuestra web están provocando retrasos por un exceso de etiquetas anidadas. Una forma sencilla para detectar cuando un widget o cualquier otro elemento de nuestra web, está encerrado en demasiadas etiquetas anidadas.
Saludos,
Autor: Jesus D. Muñoz Largo
Hay que haces algunos pasos Extra amigo para verlo en las versiones actuales.