Un HTML de propuesta listo para revisar: ejemplo mínimo y prueba en pantalla pequeña

Nos-workspace

Pastilla azul
TOP 2 del mes
Registrado
1 Oct 2026
Mensajes
2
Puntos de reacción
2
Aquí tienes un documento HTML pequeño que puedes copiar y adaptar para explicar un trabajo: alcance, resumen y fecha de entrega. Somos el equipo de NOS Workspace; compartimos el ejemplo como recurso, no como una experiencia de un cliente.

Si pides una propuesta o un informe en HTML a una IA, prueba primero con contenido ficticio y comprueba el resultado antes de enviarlo. Este ejemplo conserva los estilos dentro del archivo, usa la fuente del dispositivo y no necesita JavaScript ni imágenes externas.

Ejemplo completo
Guárdalo como brief.html y ábrelo en el navegador. El texto está en inglés para conservar exactamente el ejemplo que comprobamos. Cambia el alcance y la fecha por los datos reales de tu proyecto.

HTML:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Sample project brief</title>
<style>
body { margin: 0; background: #f4f5f7; color: #20242a; font: 18px/1.6 system-ui, sans-serif; }
main { max-width: 42rem; margin: 2rem auto; padding: 1.5rem; background: white; border-radius: 1rem; }
h1 { font-size: clamp(1.5rem, 5vw, 2rem); line-height: 1.2; }
</style>
</head>
<body>
<main>
<p>Fictional sample - no client data</p>
<h1>Sample project brief</h1>
<h2>Scope</h2>
<p>One project summary with a scope and a deadline.</p>
<h2>Deadline</h2>
<p>First draft: 16 October 2026</p>
</main>
</body>
</html>

Qué comprobamos y qué queda por comprobar
El 9 de octubre pegamos este HTML en el editor de la página principal de NOS y abrimos la vista de teléfono. El título Sample project brief, Scope, Deadline y los párrafos aparecieron en la vista. Esta comprobación corresponde al ejemplo; no demuestra que cualquier HTML importado funcione igual ni sustituye probarlo en el teléfono del destinatario.

Antes de entregar tu propia versión:
  • Confirma el alcance y la fecha con el material original.
  • Prueba tu título más largo en una pantalla pequeña.
  • Comprueba las imágenes, fuentes y otros archivos que hayas añadido.
  • Abre el enlace final sin iniciar sesión antes de compartirlo.

Del archivo al enlace
Puedes alojar el archivo en un hosting estático. En NOS Workspace puedes pegar HTML, editar el texto visible y revisar la vista previa sin iniciar sesión. Crear un enlace guardado es un paso distinto y requiere una cuenta; quien recibe el enlace no necesita registrarse. El plan gratuito admite tres enlaces activos. NOS no genera el HTML con IA: trabaja con el HTML que ya tienes.

En esta prueba solo comprobamos la vista previa; no creamos un enlace público de demostración para el ejemplo.

La IA ayudó a redactar este recurso. Revisamos el código y contrastamos la descripción de la prueba con la pantalla real antes de publicarlo.
 
Atrás
Arriba