Cómo grabar una página web en el navegador sin nada que estorbe

Para grabar una página web sin nada que estorbe, usa un perfil del navegador aparte, sin marcadores, extensiones ni datos personales guardados, cierra las demás pestañas, ajusta el zoom de la página, descarta una vez los avisos de cookies y graba solo la ventana del navegador. Después desplázate despacio y para en cada sección. La primera vez te lleva diez minutos prepararlo; a partir de ahí lo tienes listo siempre que lo necesites.

El recorrido por una web es el vídeo para clientes más habitual en las agencias web: el entorno de staging para revisión, la web terminada en la entrega, un error en una página concreta. La web es la protagonista. Lo demás que hay en el navegador es ruido, y parte de ese ruido es privado.

Usa un perfil del navegador solo para grabar

Tu navegador de cada día dice mucho de ti: marcadores con nombres de otros clientes, iconos de extensiones, una fila de treinta pestañas, un autorrelleno que te ofrece la dirección de tu casa en cuanto haces clic en un campo de formulario. Un perfil aparte empieza vacío.

En Chrome: haz clic en el icono de tu perfil arriba a la derecha, elige PerfilAñadir perfil de Chrome y ponle un nombre como «Grabación».

En Safari: elige SafariAjustesPerfiles y crea uno nuevo. Abre una ventana con él desde ArchivoNueva ventanaNueva ventana de Grabación (el último elemento lleva el nombre de tu perfil). Ten en cuenta que las contraseñas guardadas en el llavero de iCloud están disponibles en cualquier perfil de Safari, así que un gestor de contraseñas puede seguir ofreciéndote rellenar inicios de sesión.

En el perfil nuevo, deja solo lo que necesita la grabación: sin extensiones, sin barra de marcadores, sin direcciones ni tarjetas guardadas, y con sesión iniciada solo en los entornos de staging que vas a enseñar.

¿Y por qué no una ventana privada?

Una ventana privada o de incógnito (⌘⇧N en Chrome) también está limpia, y sirve para una vez. Pero lo olvida cada cosa al cerrarla: cada grabación vuelve a empezar con el aviso de cookies y la pantalla de inicio de sesión. Un perfil recuerda lo que has configurado.

	Ventana privada o de incógnito	Perfil de grabación
Preparación	✓ ninguna	~ unos minutos, una vez
Empieza sin tus marcadores y pestañas de cada día	✓	✓
Recuerda los avisos de cookies descartados	✗	✓
Mantiene la sesión en los entornos de staging	✗	✓
Sirve para	Una grabación puntual	Cada grabación después de la primera

Limpia la ventana

Oculta la barra de marcadores. En Chrome, pulsa ⌘⇧B. En Safari, elige VisualizaciónOcultar barra de favoritos.

Cierra las demás pestañas. Los títulos de las pestañas se ven en la grabación, y «Factura vencida, Cliente X» no es algo que quieras en un vídeo para el Cliente Y. Nuestro checklist de privacidad al grabar la pantalla tiene la lista completa de lo que hay que ocultar.

Ajusta el nivel de zoom

Las webs están diseñadas para quien se sienta delante de ellas, no para un vídeo reducido a la ventana de un portátil o a un móvil. El texto pequeño y los detalles finos de la interfaz se vuelven difíciles de leer.

Antes de grabar, amplía la página uno o dos pasos con ⌘+, y vuelve al tamaño normal con ⌘0. Al ampliar, la maquetación puede pasar a un punto de ruptura más estrecho; comprueba que sigue enseñando el diseño como quieres presentarlo. Si quieres la maquetación de escritorio exacta a un tamaño legible, haz la ventana más pequeña en lugar de ampliar, y graba la ventana.

Avisos de cookies, ventanas emergentes y widgets de chat

En un entorno de staging, el aviso de cookies, la ventana emergente de la newsletter y la burbuja del chat aparecen a cada visitante nuevo, que es lo que eres en un perfil recién creado.

• Si no son el tema, acéptalos o descártalos una vez antes de grabar. En un perfil dedicado, se quedan descartados.
• Si son el tema, como un nuevo aviso de consentimiento que necesitas que te aprueben, graba un vídeo corto aparte que empiece por él, para no interrumpir el recorrido principal.
• Los widgets de chat a menudo se abren solos al cabo de un rato. Ciérralos antes de empezar o espera a que aparezcan y descártalos.

Usa datos de prueba, no clientes reales

Si el recorrido incluye un área de cuenta, un checkout o un panel de administración, entra como usuario de prueba. Los pedidos, nombres y emails reales en un vídeo son datos personales, y los vídeos se reenvían. Usa las cuentas de prueba y los modos de pago de prueba del entorno de staging, y rellena los formularios con datos claramente falsos, como «Cliente de Prueba».

Vigila también el autorrelleno. Cuando haces clic en un campo de formulario, el navegador puede ofrecerte nombres, emails o direcciones guardados. Un perfil de grabación sin nada guardado lo evita.

Graba la ventana, no la pantalla

Graba solo la ventana del navegador o un área alrededor de ella. El cliente ve la web y nada más: ni el Dock, ni los iconos de la barra de menús, ni la notificación que se cuela. Nuestra guía para grabar una ventana o una parte de la pantalla explica las opciones de Captura de pantalla de macOS y de otros grabadores.

Para una presentación cuidada, un margen y un fondo alrededor de la ventana ayudan; lee fondos y márgenes para la grabación de pantalla.

Desplázate como si se lo estuvieras enseñando a alguien

El scroll rápido es el problema más habitual en las grabaciones de webs. Tú conoces la página; el cliente ve un borrón.

Si el cliente puede verlo en el móvil, un zoom en los detalles pequeños ayuda; zoom automático al grabar la pantalla: cuándo ayuda y cuándo estorba explica cuándo usarlo.

Versiones móviles y otros casos

Para enseñar la versión móvil de la web, usa el modo adaptable del navegador o un iPhone real; cómo enseñar la versión móvil de una web a un cliente desde el Mac compara las opciones.

Para las entregas, en las que también enseñas el CMS y dónde está cada cosa, lee cómo entregar una web terminada al cliente con un vídeo. Para lo básico sobre grabar en un Mac, empieza por cómo grabar la pantalla en el Mac.