Vista 3D de una web con Firefox – Ver etiquetas anidadas

Vista 3D de botón "Me Gusta"
FacebooktwitterinstagramFacebooktwitterinstagram

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:

jesusdml.es-a-vista-de-pajaroActivando 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».

Activar Vista 3D en firefox

Activar Vista 3D en firefox

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): Vista 3D de botón "Me Gusta"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

Print Friendly, PDF & Email
FacebooktwitterredditlinkedinmailFacebooktwitterredditlinkedinmail
febrero 2, 2014

Etiquetas: , , , ,
  • Pingback: Bitacoras.com
  • Deja una respuesta

    Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *