ver vídeo
Programación Entornos de programación

Cod. DEVTOOLS

Curso de DevTools: inspección, depuración y optimización de sitios web

ver vídeo

La capacidad para identificar y resolver problemas rápidamente es fundamental, y eso forma parte del desarrollo y mantenimiento de sitios web. Las herramientas de desarrollador integradas en navegadores como Chrome, Firefox y Edge permiten inspeccionar y modificar el código en tiempo real, analizar el comportamiento de scripts y evaluar el rendimiento de una página. Estas funciones facilitan una comprensión más profunda del funcionamiento interno de las aplicaciones web y contribuyen a optimizar su funcionamiento y experiencia de usuario. Dominar estas herramientas no solo agiliza la resolución de errores, sino que también mejora la calidad del producto final y la eficiencia en el trabajo diario.

Este curso te proporcionará los conocimientos y habilidades para utilizar estas utilidades como parte integral de tus procesos de desarrollo y análisis. Aprenderás a inspeccionar elementos, depurar código JavaScript y realizar análisis de rendimiento, convirtiendo estas tareas en prácticas habituales que apoyan la mejora continua de tus proyectos web. De esta manera, podrás afrontar con mayor confianza y precisión los desafíos técnicos que surjan en tu trabajo cotidiano.

  • Dirigido a

    Diseñadores y desarrolladores web, programadores y cualquier persona interesada en aprender a inspeccionar, depurar y optimizar sitios web utilizando las herramientas para desarrolladores de navegadores como Firefox, Chrome, Edge...

  • ¿Qué competencias vas a adquirir?

    Identificar las herramientas de desarrollo integradas en navegadores modernos para aprovechar sus principales funcionalidades.

  • Requisitos

    • Conocimientos básicos de HTML, CSS y JavaScript.
    • Navegador Google Chrome instalado (como mínimo).
    • Interés en experimentar directamente con páginas web.

  1. Primeros pasos en DevTools

    • Más allá del escritorio: dispositivos y contextos reales
    • Conceptos básicos
    • Día a día del desarrollador
    • Errores comunes al trabajar con DevTools
    • Acceso a Devtools
    • Herramientas complementarias
    • Buenas prácticas
    • Resumen
  2. Inspección de elementos (HTML y CSS)

    • Pestaña Elements
    • Inspección de elementos
    • Editar código en vivo
    • DevTools como herramienta de aprendizaje de HTML y CSS
    • Privacy and Security
    • Resumen
  3. La consola

    • Interfaz
    • Primeros pasos
    • Funciones prácticas de la consola
    • Opciones avanzadas
    • Uso de comandos en JavaScript
    • Detección de errores
    • Resumen
  4. Red y recursos

    • Pestaña Network
    • Pestaña Application
    • Network y Application: una visión global
    • Resumen
  5. Depuración de código

    • Pestaña Sources
    • Uso de breakpoints
    • Depuración de errores: técnicas prácticas
    • Resumen
  6. Análisis y Optimización

    • Accesibility Tree (Vista de accesibilidad)
    • Pestaña Performance
    • Pestaña Lighthouse
    • Memory
    • Recorder (novedad en Chrome DevTools)
    • Resumen
Área de competencia Competencia 1: Información y alfabetización Digital Básico Bás. Intermedio Int. Avanzado Av. Especializado Esp.
1.1. Navegar, buscar y filtrar datos, información y contenidos digitales
1.2 Evaluar datos, información y competencias digitales
1.3 Gestión de datos, información y competencias digitales
Área de competencia Competencia 2: Comunicación y colaboración Básico Bás. Intermedio Int. Avanzado Av. Especializado Esp.
2.1. Interactuar a través de tecnologías digitales
2.2. Compartir a través de tecnologías digitales
2.3. Participación ciudadana a través de las tecnologías digitales
2.4. Colaboración a través de las tecnologías digitales
2.5. Comportamiento en la red
2.6 Gestión de la identidad digital
Área de competencia Competencia 3: Creación de Contenidos digitales Básico Bás. Intermedio Int. Avanzado Av. Especializado Esp.
3.1. Desarrollo de contenidos
3.2. Integración y reelaboración de contenido digital
3.3. Derechos de autor (copyright) y licencias de propiedad intelectual
3.4. Programación
Área de competencia Competencia 4: Seguridad Básico Bás. Intermedio Int. Avanzado Av. Especializado Esp.
4.1. Protección de dispositivos
4.2. Protección de datos personales y privacidad
4.3. Protección de la salud y del bienestar
4.4. Protección medioambiental
Área de competencia Competencia 5: Resolución de Problemas Básico Bás. Intermedio Int. Avanzado Av. Especializado Esp.
5.1. Resolución de problemas técnicos
5.2. Identificación de necesidades y respuestas tecnológicas
5.3. Uso creativo de la tecnología digital
5.4. Identificar lagunas en las competencias digitales

¿Necesitas impartir esta formación en tu organización?

DevTools: inspección, depuración y optimización de sitios web

DevTools: inspección, depuración y optimización de sitios web

Indícanos la dirección de email corporativo en la que quieres recibir el temario completo del curso en PDF.

DigComp 2.2 Marco Europeo de Competencias Digitales

Este sitio utiliza cookies propias y de terceros con fines analíticos anónimos, para guardar tus preferencias y garantizar el correcto funcionamiento del sitio web.

Puedes aceptar todas las cookies, rechazarlas o configurarlas según tus preferencias utilizando los botones correspondientes.

Puedes obtener más información y volver a configurar tus preferencias en cualquier momento en la Política de cookies