Igual aprendemos algo

nonews

Dos prácticas herramientas en Internet Explorer 8

| miércoles, 19 de agosto de 2009
Desde hace unos meses los usuarios del navegador por excelencia, mal que les pese a los seguidores de Firefox, "disfrutamos" de una nueva versión: Internet Explorer 8.

Nota: Lo de disfrutar y lo de Firefox quizá lo explique en otra ocasión.

Nada más instalar la nueva versión, lo primero que nos sorprende es que es prácticamente más de lo mismo, es decir que aparte de cambiar algunas cosillas de sitio o de nombre, aparentemente no encontramos nada nuevo.
Sí que han añadido un gestor de proveedores de búsqueda que puede ser útil en determinadas ocasiones, aunque no del todo necesario.
Y el modo de exploración InPrivate, para cuando queremos ver páginas y no nos apetece que los demás sepan qué hemos visto.

Después de un mes desde que lo instalé y enredando mucho, como suelo hacer siempre, me encuentro la verdadera mejora de esta versión respecto de las anteriores. Y esa no es otra que las Herramientas de desarrollo, que está más escondida de lo que debiera.
Con ellas podemos hacer un montón de cosas como validar el HTML de nuestras páginas web, cambiar de tamaño la visualización de las mismas, ver información de cookies, habilitarlas o deshabilitarlas a voluntad, ver informes detallados de todas las imágenes de cualquier página, ver los códigos fuente de toda la página o de partes de ella, etc.
Y todo ello sin que se produzca un cambio real en la página, lo cual es muy interesante para el estudio de las páginas web o blogs (propios y ajenos), antes de tomar la decisión de cambiar algo en ellas.

Pero todo esto no lo tengo aún probado del todo y por ello en este post sólo nos fijaremos en un par de herramientas de fácil manejo y muy útiles.
A saber:
- La regla para medir sobre pantalla
- Y el selector de colores

Para los que tenemos un blog muchas veces nos será de utilidad saber con exactitud las medidas de todas las zonas de la página, para poder introducir imágenes o widgets sin que se nos vayan fuera de marco.
Ya sabemos que esto lo podemos descubrir en la plantilla del blog, pero por no buscarlo a veces lo hacemos a base del método "ensayo-error".
Algo parecido nos ocurre con los colores.

De modo que vamos a ver como sacamos estas herramientas, que bajo mi punto de vista son un método más rápido para conseguir estos datos.

Iniciamos el navegador y nos vamos a una página cualquiera. Usaré El mito de la taberna como ejemplo. Lo vemos en la imagen siguiente:


Una vez en ella vamos a Herramientas > Herramientas de desarrollo:


Enseguida aparecerá una nueva pantalla:


Hay que advertir aquí, que no debemos cerrar el blog puesto que esta segunda pantalla nos está dando los datos que encuentra en él en todo momento.
Para más comodidad podemos anclar esta segunda pantalla a la primera, la del blog, con pulsar en el botón que he señalado en la imagen anterior, quedando entonces una vista como esta:


Una vez aquí vamos a Herramientas > Mostrar la regla, como se ve en la imagen anterior.
Nos aparecerá en la pantalla del blog una nueva pantalla con las opciones de la regla:


- ajustar al eje X/Y > para medir en horizontal o vertical. Si la desmarcamos podremos medir en cualquier dirección.
- ajustar al elemento > hará que la regla se pegue a los bordes del elemento sobre el que medimos, ya sea una imagen o un cajetín de texto, etc.
- ocultar marcas de graduación y extremos no necesitan explicación.
- pulsar Ctrl crea varias reglas a la vez. Si no se pulsa una regla borra la anterior.
- Ctrl+M muestra una pequeña lupa que podemos desplazar con el cursor. Para hacerla desaparecer volvemos a pulsar la misma secuencia.
La regla tiene además la opción de presentarse en los cuatro colores que se seleccionan pinchando sobre los cuadrados situados arriba a la izquierda.
Las medidas nos las da en píxeles y las muestra sobre la regla y también bajo las opciones.
En la imagen siguiente hemos realizado la medición del cajetín que alberga el reloj del blog:


Cerraremos esta herramienta simplemente pulsando la X de cierre y vamos a abrir ahora el selector de color.
Volvemos a Herramientas > Mostrar selector de colores.
Aparecerá otra pantallita con un cuentagotas:


Pinchando en la imagen del cuentagotas y desplazándonos por la pantalla veremos que el color del rectángulo que hay sobre él va adaptándose al color sobre el que nos movemos. Si nos gusta un color determinado del blog y queremos saber cual es solo tenemos que llevar el cuentagotas hasta allí y pinchar sobre la zona. El color quedará grabado en el rectángulo y a su derecha veremos los valores en hexadecimal y en RGB. Además podemos copiar esos valores con el botón que se encuentra bajo ellos.
Como ejemplo, vemos que en este blog el color de fondo del texto de los artículos responde a los valores siguientes:
- hexadecimal #446666
- R:68 G:102 B:102

Bien, todo esto que parece muy complicado se simplifica con los siguientes atajos de teclado:
F12 > abre la pantalla principal de desarrollo
Ctrl+L > abre la regla
Ctrl+K > abre el selector de color

7 comentarios:

Juan Nadie dijo...

Muy útil, sí señor, aunque un poco complicadillo para los que no solemos enredar mucho y nos conformamos con cuatro cositas para ir tirando.

Nando dijo...

AUPA FIREFOX !!

Nando dijo...

Seguro que son herramientas cojonudas pero como soy bastante zoquete para lo que no sea super básico , no sé si algun dia lo usaré.
Lo bueno de todo esto es que si algun dia me hace falta siempre tendré en "Marcadores" y no en "Favoritos" tu blog . Gracias!!

jose dijo...

Gracias Nando por tu opinión.
Pero no me vendas esa moto del Firefox, porque lo he tenido... bueno en realidad lo sigo teniendo en el trabajo, y no lo quiero ni en pintura.
Al menos hasta que no vean los desarrolladores la manera de hacer que cada vez que lo abres se te coma toda la memoria del ordenador.
En cuanto a Marcadores o Favoritos, no son más que palabras para llamar a la misma cosa.
De todas formas me alegra verte por aquí.
Un saludo

jose dijo...

Perdón, quise decir:
Al menos hasta que no vean los desarrolladores la manera de hacer que cada vez que lo abres no se te coma toda la memoria del ordenador.

Logan y Lory dijo...

Todos estos datos que nos enseñas a manejar son más que útiles e interesantes, aunque para los profanos en estas lides resultan complicados. Pero bueno, nos pondremos a enredar a ver lo que conseguimos aprender de tus enseñanzas.

Muchas gracias y un cordial saludo.

jose dijo...

Siempre digo que si algo te interesa de verdad, terminas aprendiendo.
Yo he aprendido algo a base de enredar porque siempre me ha gustado ir un poco más allá.

Gracias a vosotros por pasaros por aquí.

Los últimos comentarios