Alguien le dijo que una página de inicio moderna necesita un video, y ahora tiene delante una cotización por algo que no pensaba comprar. Tal vez le preocupa que una página sencilla se vea anticuada, o sospecha que un video hará que la página se arrastre en un teléfono.
Una página de inicio no necesita un video por defecto. Lo necesita cuando un clip muestra o explica algo que ayuda a un cliente a elegirlo, como su trabajo, su equipo, su espacio, un producto en uso o cómo es una primera visita.
Si no cumple esa función, una foto fuerte y un titular claro sostendrán mejor la primera pantalla, y costarán menos mantenerla rápida.
Puntos clave
Agregue un video cuando responda una pregunta específica que tiene un comprador, como cómo se ve el trabajo terminado o qué pasa en una primera visita. Un video que repite su titular no tiene ninguna función que cumplir.
Un fondo en bucle silenciado es decoración. Un clip que el visitante decide iniciar puede llevar una demostración o un testimonio, y mantiene ligera la primera pantalla.
Use una imagen de portada con botón de reproducción, una proporción fija, un video de YouTube que se carga con un clic, subtítulos para la voz y nunca reproducción automática con sonido.
Pruebe la página móvil en PageSpeed Insights antes y después, y compare LCP, CLS, INP, bytes transferidos y JavaScript de terceros. Mide la velocidad, no si los clientes prefieren el video.
Un titular más claro, una mejor oferta, un camino de contacto más fácil, fotos reales o reseñas escritas pueden ayudar más primero. Agregue el video cuando tenga un tema, un propósito y un plan para mantenerlo.
Un video en la página de inicio gana su lugar cuando muestra lo que el texto no puede
El movimiento y un rostro humano responden algunas preguntas que los párrafos responden mal. ¿Cómo sale el equipo de la obra? ¿Quién tocará la puerta, en realidad? ¿Cómo es la sala de espera? ¿Qué pasa después de que reserve? Cuando su video responde una de esas, el visitante siente menos incertidumbre y tiene una razón para tomar el teléfono.
La guía de web.dev sobre rendimiento de video trata el video como opcional, y usted también debería hacerlo. La prueba es sencilla: termine la frase «Este video permite que un cliente vea ___». Si no puede llenar el espacio con algo específico, el video es decoración.
Los clips grabados con el teléfono pueden pasar esa prueba. Estos temas suelen ganar un lugar:
- Una presentación breve del dueño sobre a quién atiende.
- Una secuencia de antes y después de trabajos reales.
- Un recorrido por la entrada, el estacionamiento o la recepción.
- Un producto o servicio mostrado en uso.
- Una presentación del personal que pone nombres y rostros al negocio.
- Una breve explicación de lo que pasa después de que alguien reserva o llama.
- Un testimonio de un cliente, con permiso y redacción precisa.
- Un primer plano de los materiales, el equipo o los controles de calidad.
Un montaje genérico, una animación de logotipo o un clip de tendencia sin relación no pertenecen a esa lista. La guía de usabilidad de video de Nielsen Norman Group es una lectura útil antes de dar instrucciones a alguien.
Un fondo en bucle y un clip con clic cumplen funciones distintas
Las expresiones «hero video» y «background video» (video principal y video de fondo) suelen describir un bucle, cuando lo que usted necesita podría ser otra cosa. Un video de fondo es un clip silenciado y en bucle detrás de su titular. Crea un ambiente, pero no le pide nada al visitante y le enseña muy poco.
Un clip con clic es lo contrario. El visitante ve una imagen de portada y un botón de reproducción, decide ver el video y obtiene una demostración, una explicación o un cliente hablando. Esa es la versión que puede llevar evidencia real.
| Característica | Bucle de fondo silenciado | Clip de reproducción con clic |
|---|---|---|
| Qué hace | Crea un ambiente detrás del titular | Demuestra, explica o muestra a un cliente |
| Elección del visitante | Ninguna; se mueve solo | El visitante presiona reproducir |
| Empieza a cargarse | De inmediato, si se reproduce solo | Después del clic, si está configurado como fachada |
| Sonido y subtítulos | Silencioso por diseño | Sonido claro con subtítulos sincronizados |
| Buen uso | Rara vez es un factor decisivo | Muestras de trabajo, presentaciones del equipo, recorridos de la primera visita, testimonios |
El costo en velocidad también cambia. web.dev señala que un `<video>` que se reproduce solo empieza a descargarse de inmediato, incluso si está debajo del pliegue. Así que, un bucle de portada agrega peso justo en el momento en que el visitante espera la página. Una imagen de portada no lo hace.
Una portada, una forma fija y un reproductor que carga con clic mantienen la página rápida
Cuatro ajustes hacen casi toda la protección. Cada uno es pequeño, y vale la pena revisar cada uno, ya sea que contrate el trabajo o que se lo pida a su desarrollador actual.
Primero, muestre una imagen de portada con un botón de reproducción visible. web.dev recomienda una portada para el video que no se reproduce solo. Segundo, declare el ancho y el alto del video o su proporción, para que la página no salte cuando aparezca el reproductor. El contenido que salta se nota como cambio de diseño (CLS).
Tercero, cargue la parte pesada solo después de un clic. En el caso de YouTube u otro video de terceros, web.dev recomienda una fachada: una miniatura ligera que ocupa el lugar del reproductor, y el iframe real solo se carga después de que el visitante hace clic. Un video insertado normal puede traer scripts considerables antes de que alguien presione reproducir, así que un video de YouTube sin más no es ligero automáticamente. La página sobre carga diferida de imágenes e iframes explica la técnica.
Cuarto, aplique carga diferida al video que está fuera de la primera pantalla, y mantenga su titular, su oferta y su botón de contacto como texto real. Un video nunca debe ser el único lugar donde un cliente pueda saber qué vende.
Alojar en YouTube o en su propio servidor es un intercambio entre comodidad y control
YouTube es cómodo cuando le importan la distribución y compartir el video, y se encarga de la codificación y la entrega. YouTube documenta los pasos actuales para insertarlo en su centro de ayuda. Un archivo MP4 o WebM directo en su propio sitio le da más control sobre cómo se ve el video y qué terceros intervienen. También lo hace responsable de la codificación, el almacenamiento, la entrega y el mantenimiento.
Si usa una etiqueta `<video>` directa, agregue `controls`, una portada, una proporción declarada y una pista de subtítulos WebVTT cuando el video tenga diálogo relevante. La guía de web.dev sobre audio y video en HTML explica esos atributos.
No reproduzca automáticamente con sonido. La guía de reproducción automática de MDN dice que los navegadores suelen bloquear la reproducción automática con audio, a menos que el visitante haya interactuado con el sitio, el medio esté silenciado o se cumpla otra condición propia de cada navegador. Si de verdad necesita un bucle silencioso, use `muted`, `playsinline` y `controls`, y mantenga una portada como respaldo.
Los reproductores de terceros pueden instalar cookies y recopilar datos. Confirme las reglas de privacidad y consentimiento del lugar donde viven sus visitantes antes de agregar uno.
Los subtítulos son parte de la configuración, y la calidad del sonido decide si la gente se queda
Si el clip tiene voz o sonidos importantes, necesita subtítulos. La Web Accessibility Initiative (WAI) del W3C describe los subtítulos como texto sincronizado que lleva la voz y los sonidos sin habla que el espectador necesita. El criterio de éxito 1.2.2 de WCAG 2.2 pide subtítulos para medios sincronizados pregrabados, salvo cuando el medio es una alternativa al texto y está claramente identificado como tal.
Los subtítulos ayudan a las personas sordas o con dificultades auditivas. También ayudan a un visitante con el teléfono en una sala de espera y el sonido apagado.
La claridad del sonido importa tanto como la claridad de la imagen. En muchas demostraciones y presentaciones, la relevancia, un sonido claro y subtítulos útiles importan más que un aspecto cinematográfico. Escriba los subtítulos a partir de un guion o de una revisión, no de una transcripción automática sin revisar que nunca haya leído.
Que un video se indexe es posible, pero no es un plan para posicionarse
A los dueños a veces les dicen que un video en la página de inicio ayuda a los rankings de búsqueda. La guía de video de Google Search Central dice que Google puede encontrar videos en los elementos `<video>`, `<embed>`, `<iframe>` y `<object>`, y recomienda una URL de miniatura estable, preferiblemente mediante `poster`, `thumbnailUrl` o metadatos de mapa de sitio de video. También dice que la indexación no está garantizada solo porque un video esté insertado.
La página de datos estructurados para video de Google agrega que el marcado tampoco garantiza una función de búsqueda. Trate la indexación como un extra posible, nunca como la razón para agregar el clip.
No poner un video no hace que una página de inicio esté incompleta a ojos de Google. Una página con texto claro, buenas fotos y una carga rápida es una página completa.
Un estudio grande encontró que el video aportó poco a la conversión, y no resuelve su caso
Unbounce revisó unas 35,000 páginas de aterrizaje de clientes entre finales de 2020 y principios de 2021, y reportó que el video tuvo un efecto general mínimo o negativo en las tasas de conversión. Ese fue el análisis observacional de Unbounce sobre páginas de aterrizaje. No es una regla para cada página de inicio, y no describe específicamente a los negocios locales.
Léalo como una advertencia contra suponer una mejora. Un video puede ayudar a entender y a generar confianza cuando muestra algo relevante. Puede perjudicar cuando hace más lenta la primera pantalla, se reproduce solo con sonido, repite el texto, no tiene subtítulos o empuja el botón de llamada hacia abajo en la página.
Nadie puede darle un porcentaje de conversión para su negocio. Sus propias llamadas, formularios y reservas antes y después de un cambio son la evidencia que cuenta. Para una mirada más amplia de lo que significa un buen número, vea cuál es una buena tasa de conversión de un sitio web.
Una lista corta de errores corregibles cubre los problemas habituales de los videos en la página de inicio
Cada uno de estos problemas tiene una solución, y varias son trabajos pequeños. Tome el orden como una lista de verificación práctica, no como un ranking de qué tan seguido ocurre cada uno.
| Problema | Solución | Tamaño del trabajo |
|---|---|---|
| Se carga de una vez un reproductor completo de YouTube o Vimeo | Reemplazarlo por una fachada con portada que carga el reproductor después de un clic | Pequeño a mediano |
| Un video o una portada grande se convierte en el elemento más grande de la primera pantalla | Cambie el tamaño, comprima y codifique bien, y después revise el elemento LCP | Pequeño a mediano |
| Reproducción automática con sonido | Quite la reproducción automática o silénciela, agregue controles y un botón de reproducción claro | Pequeño |
| Sin subtítulos ni transcripción | Cree un archivo de subtítulos preciso y una transcripción donde sea útil | Pequeño a mediano |
| Un clip genérico que no responde ninguna pregunta | Vuelva a filmar o edite alrededor de una sola pregunta del cliente | Mediano |
| Sin dimensiones fijas, el diseño se desplaza | Declare el ancho y el alto o una proporción | Pequeño |
| Un recorte para móvil que oculta la acción | Encuadre una versión segura para móvil o proporcione una fuente móvil separada | Pequeño a mediano |
| No hay forma de saber si alguien lo usa | Registre las reproducciones del video junto con llamadas, formularios y reservas | Mediano |
Si su sitio ya se siente lento, corrija eso primero. Nuestra publicación sobre por qué un sitio web tarda en cargar explica las causas habituales, y un video agregado a una página lenta solo alarga la espera.
Una revisión de diez minutos muestra lo que le costó el video a la velocidad de su página
Puede hacer esto usted mismo, sin desarrollador. Abra PageSpeed Insights de Google y pruebe su página de inicio en móvil antes de agregar o cambiar algo. Anote LCP, CLS, INP, el tamaño total de transferencia y cualquier advertencia de terceros. Repítalo dos veces si los números fluctúan.
Luego agregue el video de la forma en que piensa mantenerlo, y vuelva a probar la misma URL. Compare primero los resultados en móvil. Busque estos cambios:
- Si el video o su iframe ahora aparece entre las primeras solicitudes.
- Si la portada provoca un cambio de diseño.
- Si cambió el elemento más grande de la pantalla.
- Si creció el JavaScript de terceros.
Esto es una revisión de rendimiento, no una prueba de conversión. Una página más rápida no demuestra que los visitantes prefieran el video, y una más lenta no demuestra que lo rechacen. Para juzgar el resultado del negocio, observe sus llamadas, envíos de formularios y reservas durante un período justo de tiempo.
Quizá aún no necesite un video en la página de inicio, y esa es una decisión sensata
A veces la respuesta es esperar. Si no puede nombrar la pregunta del cliente que responde el video, si no tiene un clip utilizable, o si no puede subtitularlo y alojarlo bien, el dinero quizá rinda más en otra parte. Un titular más preciso, una oferta más clara, un camino de contacto más fácil, fotos reales o testimonios escritos pueden rendir más primero. Nuestra guía sobre qué debe incluir la página de inicio de un negocio pequeño explica lo que conviene resolver antes de agregar algo que se mueva.
El costo también importa aquí. Un clip grabado con teléfono, con sonido claro y subtítulos, cuesta mucho menos que una pieza producida, y nuestra publicación sobre cuánto cuesta un video de marketing muestra cómo se mueven los rangos de precios. Si su mejor material de video es un cliente hablando, lea sobre videos testimoniales para un negocio pequeño antes de planear una filmación.
Un video se convierte en un proyecto justificado cuando tiene un tema útil, un propósito medible y un plan para alojarlo, hacerlo accesible, cuidar el rendimiento y darle mantenimiento. Sin los cuatro, espere. Una página rápida y hecha a medida con una primera pantalla sólida es mejor punto de partida que un video que nadie pidió.
¿Su video de la página de inicio gana su lugar?
Elija una respuesta para empezar.
1. Un diseñador dice que toda página de inicio necesita un video principal. ¿Cuál es la mejor primera pregunta que hacer?
2. ¿Qué configuración evita que un video de YouTube frene la primera pantalla?
3. Después de agregar el video, PageSpeed Insights muestra una página más rápida. ¿Qué demuestra eso?
Preguntas frecuentes sobre los videos en la página de inicio
¿Toda página de inicio necesita un video?
No. Use uno cuando responda una pregunta del cliente o muestre una evidencia que el texto y las fotos no pueden mostrar, como su trabajo, su equipo o cómo es una primera visita.
¿Un video en la página de inicio mejorará el SEO?
No automáticamente. Google puede indexar videos elegibles, pero Google dice que insertar un video no garantiza la indexación, los rankings ni las funciones de video.
¿Un video de la página de inicio debe reproducirse solo?
Por lo general, use reproducción con clic. Los navegadores suelen bloquear la reproducción automática con sonido. Si de verdad necesita la reproducción automática, manténgala silenciada, agregue controles y muestre una portada como respaldo.
¿Un video de YouTube insertado hace lenta una página web?
Puede hacerlo, porque un video insertado normal puede cargar scripts considerables antes de que alguien presione reproducir. Una fachada carga primero una miniatura ligera y el reproductor después del clic.
¿Debo alojar el video en YouTube o en mi propio sitio?
YouTube es cómodo para compartir y se encarga de la entrega. Alojarlo directamente le da más control sobre la presentación y las solicitudes de terceros, y agrega el trabajo de codificación, almacenamiento y mantenimiento.
¿Los videos de un sitio web necesitan subtítulos?
La voz y los sonidos importantes deben tener subtítulos, sincronizados con el video. El criterio de éxito 1.2.2 de WCAG 2.2 cubre los medios sincronizados pregrabados.
La conclusión
Agregue un video en la página de inicio cuando responda una pregunta del cliente que usted pueda nombrar, y omítalo cuando solo decoraría la página. Configúrelo con una portada, una forma fija, un reproductor que carga con clic, subtítulos y sin reproducción automática con sonido. Luego haga la revisión de antes y después en móvil para saber cuánto le costó a la página en velocidad.
Un clip corto y útil con sonido claro puede ganarse su lugar y seguir ganándolo. Uno genérico nunca lo hará. Si decide esperar, no ha perdido nada; un titular más fuerte, un camino de contacto más fácil y las fotos reales trabajan mucho por usted mientras tanto.
Si quiere ayuda para decidir o construirlo, Web Leveling puede ayudarle a elegir la única pregunta que debe responder un clip, y después configurarlo para la velocidad y los subtítulos a través de nuestro trabajo de marketing con video. Si lo correcto es omitir el video por ahora, se lo diremos. Trabajamos con pequeñas y medianas empresas en todo el país y en el extranjero. Cuéntenos qué quiere que haga un video en la página de inicio, y le ayudaremos a planearlo.
Términos
Términos sobre videos en la página de inicio
Toque un término para ver qué significa.
Imagen de portada. Una imagen fija que se muestra en lugar del video hasta que el visitante presiona reproducir.
Fachada (facade). Un sustituto ligero, por lo general una miniatura con un botón de reproducción, que carga el reproductor real de YouTube solo después de un clic.
LCP. Largest Contentful Paint (pintado de mayor contenido), el tiempo que tarda en cargarse el elemento visible más grande de la pantalla.
CLS. Cumulative Layout Shift (cambio de diseño acumulado), una medida de cuánto se mueve la página mientras carga.
INP. Interaction to Next Paint (interacción hasta el siguiente pintado), una medida de qué tan rápido responde la página cuando el visitante toca o hace clic.
Subtítulos. Texto sincronizado que lleva la voz y los sonidos importantes sin habla de un video.
