Subir un archivo HTML a internet

Cómo subir un archivo HTML a internet

La comprobación y la vista previa están en esta página; publicar son dos comandos en tu terminal o dentro del agente con el que ya programas. Aquí no se sube nada: el comprobador es un script que corre en tu propio navegador.

1. Abre el archivo. Arrastra tu .html sobre la caja, elígelo con el selector de archivos o pega el código. Se lee en local con FileReader y se pinta en un marco aislado, así que ves exactamente lo que vería una visita.
2. Quita los bloqueos. Cada aviso trae su número de línea. Los bloqueos son las cosas que se comportan distinto cuando el archivo se sirve por HTTPS desde un dominio: referencias a tu propio disco, subrecursos por http://, un viewport o un título que faltan. Lo demás son cosas que vale la pena añadir antes de que alguien enlace la página.
3. Publícalo. Pon el archivo en una carpeta con el nombre index.html, reserva un handle gratuito con clize claim y ejecuta clize deploy sobre esa carpeta. Tienes dirección HTTPS en el mismo minuto, y esa carpeta se puede volver a publicar tantas veces como quieras.

Qué se rompe cuando el archivo sale de tu disco

Un archivo abierto desde file:///Users/tu/Escritorio/pagina.html y ese mismo archivo servido desde https://tunombre.clize.app/ no viven en el mismo mundo. Las cuatro diferencias de abajo explican casi todos los «en local se veía bien», y el comprobador de esta página las encuentra todas sin enviar tu archivo a ninguna parte.

El comprobador avisa además de dos cosas que no se ven hasta que ya es tarde: un <title> que falta —y que es el texto de cualquier enlace que alguien haga a tu página— y un og:image que falta, que es por lo que algunos enlaces salen con tarjeta en un chat y el tuyo no. Si solo quieres mirar el archivo en lugar de publicarlo, el visor HTML lo pinta igual, con tres anchuras y sin hablarte de publicar.

Si vienes del FTP y del public_html: qué cambia

En español casi todo el mundo aprendió a subir una web de la misma manera: contratas un alojamiento compartido, entras en cPanel o en Plesk, abres FileZilla y arrastras los archivos a public_html. Funciona, y sigue funcionando. Pero esa ruta tiene cuatro trampas que no tienen nada que ver con tu HTML, y conviene saber cuáles son antes de pasar media tarde buscando el fallo en el código.

• La carpeta de más. Si arrastras la carpeta en lugar de su contenido, acabas con public_html/miweb/index.html y la raíz del dominio sigue mostrando la página de bienvenida del alojamiento. Los archivos van dentro de public_html, no en una subcarpeta.
• Los permisos. El servidor sirve archivos en 644 y carpetas en 755. Si el cliente FTP los sube con otros permisos, la respuesta es un 403 Forbidden que parece un problema de configuración y no lo es.
• El nombre del índice. El DirectoryIndex del servidor decide qué archivo abre una carpeta. Casi siempre acepta index.html; si tu archivo se llama inicio.html o index.htm, la raíz muestra un listado de archivos o un error.
• El certificado. En compartido, el SSL gratuito suele haber que activarlo a mano en el panel y esperar. Hasta entonces tu sitio va por http, y todas esas imágenes con src="http://…" parecen correctas… hasta el día que activas HTTPS y desaparecen de golpe.

Aquí no hay ninguno de esos pasos porque no hay FTP. clize deploy toma una carpeta y publica su contenido tal cual: lo que está dentro queda en la raíz del sitio, los permisos los pone el servidor, el índice es index.html y el certificado se emite solo la primera vez. Si vienes de un alojamiento compartido, el cambio de hábito es exactamente ese: dejas de pensar en «subir archivos a un servidor» y pasas a pensar en «publicar esta carpeta», que es también la razón por la que el mismo comando lo puede ejecutar tu agente.

Lo que sí sigue siendo tuyo: el aviso legal y la política de privacidad de un sitio profesional. Esta herramienta no los genera, solo te enseña qué servidores ajenos carga tu página, que es la lista por la que empieza esa conversación.

Dos comandos y el archivo tiene enlace

Publicar no es un formulario. Instalas una vez y, a partir de ahí, reservar un nombre gratis y publicar son un comando cada uno: los mismos dos comandos que ejecuta tu agente cuando le pides que ponga la página en internet, porque es la misma CLI.

$ npm i -g @clize/clize && clize login
      
      $ clize claim lasolana
      ✓ lasolana.clize.app es tuyo; la página provisional ya está publicada.
      
      $ clize deploy ./sitio --domain lasolana.clize.app
      {
        "host": "lasolana.clize.app",
        "url": "https://lasolana.clize.app",
        "files": 2,
        "notFound": "spa (auto)",
        "geo": { "sitemap": "…/sitemap.xml", "llms": "…/llms.txt", "robots": "…/robots.txt" }
      }

El handle es por orden de llegada y es tuyo hasta que lo liberes. clize deploy espera una carpeta, así que mete tu archivo en una y llámalo index.html: en eso consiste toda la ceremonia del «archivo único». Ata la carpeta una vez con clize init --handle lasolana y los siguientes despliegues ya no necesitan --domain. Todos los comandos están en la referencia de comandos (en inglés).

Qué incluye exactamente el hosting HTML gratis de aquí

Gratis significa el nombre, el certificado y los despliegues; no es una prueba con caducidad. Esta es toda la superficie, para que decidas antes de escribir nada:

• Una dirección de verdad. tunombre.clize.app por HTTPS, con el certificado emitido automáticamente. Tu propio dominio puede apuntar ahí más adelante sin mover los archivos.
• Sitios de varios archivos, no solo una página. Sube lo que haya en la carpeta: páginas, CSS, imágenes, tipografías. Hasta 90 MB por archivo y 5 GB por sitio.
• 404 de verdad cuando los quieras. Añade un 404.html y las rutas desconocidas devuelven un 404 real; sin él caen a index.html con un 200, que es justo lo que necesita una aplicación de una sola página. --not-found manda sobre las dos cosas.
• URLs limpias. /talleres/ sirve /talleres/index.html directamente, sin salto de redirección. Las respuestas se cachean en público durante cinco minutos.
• Una superficie legible por máquinas, generada sola. Cada despliegue responde /sitemap.xml, /llms.txt y /robots.txt a partir de la lista de archivos; si publicas los tuyos con esos nombres, ganan los tuyos.
• Un buzón con el mismo nombre, si lo quieres. clize claim tunombre --email abre además support@tunombre.clize.app para recibir correo.

Lo que no es: no hay editor visual y no hay ninguna pantalla publicitaria delante de tu página. El HTML lo escribes o lo generas tú —a mano o pidiéndoselo al agente que ya usas— y el despliegue publica exactamente esos bytes.

$ npm i -g @clize/clize && clize login
$ clize claim tunombre
$ clize deploy ./sitio --domain tunombre.clize.app