Elementos de interfaz de usuario

User Interface Elements

Web page with different user interface elements

Todos los días usamos interfaces gráficas proporcionadas por el sistema operativo, el navegador y distintas aplicaciones. Todo usuario conoce intuitivamente los principales elementos de interfaz.

Elementos de interfaz de usuario — todo lo que vemos y con lo que interactuamos en la pantalla.

Elementos de interfaz de entrada

Elemento Ejemplo
Radio Button (radio button)
Checkbox (checkbox)
Input Field (input field)
Textarea (textarea)
Dropdown List (dropdown list)
Button (button)

Elemento Form

Form element

Form — un elemento clave mediante el cual el usuario puede enviar datos para que el servidor los procese.

Los datos de los campos del formulario se convierten en cuerpo de solicitud.

Al hacer clic en el botón se envía una solicitud HTTP al servidor.

Los detalles de solicitud-respuesta del formulario «Formulario de prueba» están disponibles en DevTools Network.

Pruébalo

Formulario de prueba

Sección Elements en DevTools

Exploremos la sección de DevTools Elements, que permite ver el código real de un elemento oculto detrás de su representación visual habitual.

Experimenta con elementos de interfaz de entrada:

  1. Abrir DevToolsF12
  2. Haz clic en la flecha a la izquierda de Elements (Inspector en Firefox)
  3. Selecciona el elemento con el cursor
  4. Haz clic en el elemento para saltar a su código
devtools-elements
Tarea
¡Tarea disponible para usuarios premium!

Desbloquea el acceso para aprender sin límites.

Acceso completo a todas las tareas prácticas
Verificación de respuestas
Intentos ilimitados
Sidebar arrow

INTRODUCCIÓN

CONCEPTOS BÁSICOS

NIVELES DE PRUEBAS

PRUEBAS DE UI

DISEÑO DE PRUEBAS

DOCUMENTACIÓN DE PRUEBAS

AUTENTICACIÓN Y AUTORIZACIÓN

POSTMAN

BASES DE DATOS

PRUEBAS DE RELEASE

ANÁLISIS DE LA APLICACIÓN

PREPARACIÓN PARA ENTREVISTAS

Cómo escribir un CV Preguntas frecuentes de entrevista Test Entrevista simulada