Saber usar el inspector del navegador es imprescindible. Nos permite saber con mucho detalle qué ocurre en una página una vez que se ha cargado en nuestro navegador para ayudarnos a encontrar errores, modificar su contenido, medir el rendimiento y mucho más.
Casi todos los navegadores tienen un inspector de código pero vamos a trabajar con el inspector de Chrome, al ser el navegador más utilizado y tener un inspector muy avanzado con una extensa documentación.
¡Vamos allá!
¡Hey! 🖐 Parece que no tienes acceso a este contenido ☹ Puedes suscribirte al contenido completo o crear una cuenta gratuita para probar gratis una clase de cada guía 😊
Suscribirse Cuenta demoVeamos cómo funciona el inspector de Chrome, con que tareas nos puede ayudar y algunas de sus funcionalidades más básicas.
Sorry! No tienes acceso a este contenido 😢. Puedes iniciar la sesión o suscribirte al contenido completo.
Entramos en la parte más básica de la inspección de cualquier página: la inspección del DOM o la estructura de HTML de la web.
Este contenido es premium pero puedes ver esta sección creando una cuenta gratuita aquí 😊
La inspección y manipulación del CSS es para lo que más uso el inspector de Chrome. Veamos qué opciones nos ofrece para facilitarnos la vida a la hora de estilizar nuestra web.
Sorry! No tienes acceso a este contenido 😢. Puedes iniciar la sesión o suscribirte al contenido completo.
Sorry! No tienes acceso a este contenido 😢. Puedes iniciar la sesión o suscribirte al contenido completo.
Estos dos informes nos muestran todos los recursos que carga nuestra web, de dónde vienen, cuánto pesan y muchas características más.
Es absolutamente imprescindible controlar estos informes para saber qué está pasando con tu web en cada momento.
Sorry! No tienes acceso a este contenido 😢. Puedes iniciar la sesión o suscribirte al contenido completo.
Go responsive or go home. No rima pero es verdad. Vamos a ver cómo controlar y corregir las versiones responsive de nuestra web de forma correcta. (No, redimensionar la ventana del navegador no sirve).
Sorry! No tienes acceso a este contenido 😢. Puedes iniciar la sesión o suscribirte al contenido completo.
En esta sección vamos a ver algo que puede revolucionar tu forma de trabajar con el código en WordPress. Se trata de usar dos herramientas del inspector de Chrome que te van a permitir editar el código CSS, JS u otros directamente en el navegador, sin pasar por un editor de código y en algunos casos incluso los cambios se guardan en tiempo real. ¡Vamos allá!
Sorry! No tienes acceso a este contenido 😢. Puedes iniciar la sesión o suscribirte al contenido completo.
Sorry! No tienes acceso a este contenido 😢. Puedes iniciar la sesión o suscribirte al contenido completo.
Sorry! No tienes acceso a este contenido 😢. Puedes iniciar la sesión o suscribirte al contenido completo.
Suscríbete al contenido completo o crea una cuenta gratuita para probar gratis una clase de cada guía 😊
Más info