Cómo hospedar una página web: guía para principiantes

Una página web en tu máquina solo existe para ti. Hospedar es poner sus archivos en una computadora conectada a internet todo el tiempo, llamada servidor, que responde cuando alguien escribe la dirección. Lo demás (dominio, HTTPS, deploy) son capas alrededor de esa idea.

El camino más corto para un principiante tiene cinco pasos: crear el sitio, generar los archivos finales, publicar, conectar un dominio y comprobar. Los ejemplos usan un sitio estático, que cubre portafolios, blogs, documentación y páginas de empresa.

¿Qué necesitas para hospedar una página web?#

Tres piezas, todas separadas:

1. Los archivos del sitio. HTML, CSS, JavaScript e imágenes.
2. Un servidor que los entregue. Es el hosting. Debe estar encendido y conectado.
3. Una dirección. Puede ser el subdominio que da el hosting o un dominio tuyo. El dominio es el nombre legible que apunta al servidor, en lugar de una dirección IP difícil de recordar (MDN).

Desde el navegador el flujo es simple: pide una URL y el servidor responde con un archivo. Cuando el servidor solo lee y devuelve archivos ya hechos, el sitio es estático. Cuando ejecuta código y consulta una base de datos en cada visita, es dinámico. La diferencia está explicada en qué es un sitio estático.

¿Qué tipo de hosting elegir?#

• Sitio estático: solo necesita un servidor de archivos. Es el más simple y rápido de poner en línea. Sirve para la mayoría de los sitios sin login ni base de datos en el servidor.
• Sitio dinámico (Node.js, Python, PHP): necesita un servidor que ejecute tu código, con RAM y, muchas veces, una base de datos.
• Constructores de sitios (Wix, WordPress.com): no tocas archivos ni servidores, pero aceptas los límites de la herramienta.

Si estás empezando y no tienes motivo para lo contrario, empieza por lo estático. Puedes migrar después. Para comparar precios, mira cuánto cuesta hospedar un sitio web.

¿Cómo crear y generar los archivos del sitio?#

Puedes escribir un index.html a mano. Ya es un sitio completo:

<!doctype html>
<html lang="es">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>Mi primer sitio</title>
  </head>
  <body>
    <h1>¡Hola, mundo!</h1>
  </body>
</html>

Si prefieres una herramienta moderna, Vite crea un proyecto base. Requiere una versión reciente de Node.js, con el mínimo indicado en la documentación de Vite:

npm create vite@latest mi-sitio -- --template vanilla --no-immediate
cd mi-sitio
npm install
npm run build
npm run preview

--template vanilla elige la plantilla con HTML, CSS y JavaScript puros, y --no-immediate evita que la herramienta instale y arranque el servidor de desarrollo por su cuenta, para que ejecutes tú cada paso. Sin estas opciones, create vite hace las mismas preguntas en la terminal.

build genera la carpeta dist con los archivos finales, listos para publicar (build de Vite). preview sirve esa carpeta en local para que revises antes de subir. Publica el contenido de dist, no la carpeta del código fuente.

¿Cómo publicar los archivos?#

Las rutas más comunes:

• Subida manual (ZIP o panel): envía la carpeta desde el panel del hosting. Buena para el primer sitio.
• Git: conectas el repositorio y cada push hace un deploy nuevo. Es lo ideal cuando el sitio cambia con frecuencia. Mira qué es un deploy.
• FTP/SFTP: común en el hosting compartido tradicional.

Al terminar, el hosting muestra una URL provisional. Ábrela en el navegador y confirma que la página carga antes de tocar el dominio.

¿Cómo conectar un dominio al sitio?#

1. Registra el dominio en un registrador. Pagas por el derecho de uso durante uno o más años y lo renuevas cuando venza (MDN).
2. Crea los registros DNS que indique el hosting, en el panel del registrador. Normalmente un registro CNAME para subdominios (www) o A/ALIAS para el dominio raíz.
3. Espera la propagación. Puede tardar de minutos a unas horas.

El paso a paso detallado está en cómo apuntar un dominio a tu aplicación.

¿Y el HTTPS?#

Sin HTTPS, los navegadores suelen avisar que el sitio no es seguro y el tráfico viaja sin cifrar. Hoy la mayoría de los hostings emiten el certificado solos cuando el dominio apunta bien. Si el tuyo no lo hace, usa un certificado de Let's Encrypt (mira cómo funciona Let's Encrypt). No dejes el sitio solo en HTTP.

¿Cómo comprobar que el sitio está en línea?#

Prueba desde la terminal para ver lo que el servidor realmente devuelve:

curl -I https://misitio.com

Busca un estado 200 en la primera línea (por ejemplo HTTP/2 200; HTTP/1.1 200 también sirve). Luego revisa en el celular, fuera de tu Wi-Fi, y abre una página que no exista para confirmar que el error 404 aparece bien.

¿Cuáles son los errores comunes?#

• 404 en la página principal: publicaste la carpeta equivocada. El index.html debe estar en la raíz de lo que subiste.
• CSS e imágenes rotos: rutas absolutas (/img/foto.png) en un sitio servido desde una subcarpeta, o archivos que no se subieron.
• El dominio no abre: el registro DNS está mal o todavía no se propagó. Revisa el valor exacto que pidió el hosting.
• Aviso de certificado: el dominio aún no apunta al servidor, así que no se emitió el certificado.
• Cambiaste el código y no pasó nada: olvidaste volver a hacer el build o el deploy, o el navegador muestra una copia en caché.

Cómo hacerlo en Square Cloud#

Square Cloud es hosting self-service: tú haces el deploy y controlas todo. Entre diversos runtimes, como Node.js, Python y Go, hay uno para sitios estáticos: nginx está siempre en línea sirviendo tus archivos, ningún código tuyo se ejecuta en el servidor, y cada actualización queda en línea al instante. Consulta los runtimes disponibles hoy en Runtimes. Subes el contenido del sitio (la carpeta dist) como ZIP en el panel, con la CLI, desde GitHub o con la extensión de VS Code. El archivo squarecloud.app es opcional: el panel genera la configuración en el deploy, o puedes escribirlo en la raíz del proyecto.

Toda aplicación web recibe un subdominio *.squareweb.app con HTTPS en cualquier plan. El dominio personalizado está disponible desde el plan Standard: creas en tu registrador los registros DNS que muestra el panel y el TLS es automático. El dominio sigue registrado a tu nombre, en tu registrador.

El Hobby cuesta desde R$12,49 al mes, y una aplicación web necesita al menos 512 MB de la RAM del plan. Todos los planes incluyen CDN global, tráfico ilimitado (política de uso justo) y analytics web sin cookies. Los detalles están en la página de sitios.