# 📡 Guía de Publicación - Banda de Música

Instrucciones para publicar tu sitio web en línea.

## Opciones de Publicación

### 1. **Hosting Gratuito - GitHub Pages** ⭐ Recomendado

GitHub Pages es gratis, rápido y perfecto para sitios estáticos.

#### Pasos:

1. **Crear una cuenta en GitHub** (si no tienes)
   - Ve a https://github.com
   - Regístrate

2. **Crear un nuevo repositorio**
   - Haz clic en "New repository"
   - Nombre: `banda-musica.github.io` (reemplaza "banda-musica" con tu nombre de usuario)
   - Elige "Public"
   - Haz clic en "Create repository"

3. **Subir tu sitio web**
   - Abre terminal/CMD en la carpeta `Desarrollo`
   - Ejecuta:
   ```bash
   git init
   git add .
   git commit -m "Primer commit - Sitio web Banda de Música"
   git branch -M main
   git remote add origin https://github.com/TU_USUARIO/banda-musica.github.io.git
   git push -u origin main
   ```

4. **Esperar a que se publique**
   - En tu repositorio, ve a "Settings" → "Pages"
   - Verifica que esté publicando desde "main" branch
   - En pocos minutos tu sitio estará en: `https://banda-musica.github.io`

---

### 2. **Hosting Económico - Netlify**

Netlify es muy fácil de usar y tiene un plan gratuito excelente.

#### Pasos:

1. **Registrarse en Netlify**
   - Ve a https://netlify.com
   - Haz clic en "Sign up"
   - Elige "GitHub" para registrarte con tu cuenta GitHub

2. **Conectar tu repositorio**
   - Haz clic en "New site from Git"
   - Conecta tu cuenta GitHub
   - Selecciona el repositorio del sitio

3. **Configurar build (si es necesario)**
   - Build command: (dejar en blanco)
   - Publish directory: `.` o `Desarrollo` según dónde esté tu código
   - Haz clic en "Deploy"

4. **Tu sitio estará en vivo**
   - Netlify te asignará un nombre como `truthy-cat-12345.netlify.app`
   - Puedes personalizar el nombre gratuitamente

---

### 3. **Hosting Económico con Dominio Propio - Hostinger**

Si deseas un dominio personalizado (como `tuband a.es`).

#### Pasos:

1. **Comprar hosting**
   - Ve a https://hostinger.es
   - Busca planes de hosting compartido (desde ~€2/mes)
   - Compra el plan básico

2. **Obtener acceso por FTP**
   - Hostinger te proporcionará credenciales FTP
   - Descarga un cliente FTP (Filezilla, WinSCP, etc.)

3. **Subir tus archivos**
   - Abre el cliente FTP
   - Conecta con las credenciales proporcionadas
   - Sube la carpeta `Desarrollo` a la carpeta `public_html`

4. **Comprar dominio (opcional)**
   - En Hostinger también puedes comprar un dominio
   - Configura los DNS del dominio para que apunte a tu hosting

---

### 4. **Hosting Profesional - HostGator o Bluehost**

Alternativas populares con buen soporte en español.

- **HostGator**: https://hostgator.es
- **Bluehost**: https://bluehost.com

Proceso similar a Hostinger.

---

## Configura un Dominio Personalizado

### Si ya tienes un dominio:

#### En GitHub Pages:
1. Ve a tu repositorio
2. Settings → Pages
3. Custom domain: `tudominio.es`
4. Marca "Enforce HTTPS"

#### En Netlify:
1. Site settings → Domain management
2. Add custom domain
3. Sigue las instrucciones para configurar DNS

#### En otros hostings:
1. Panel de control del host
2. Gestor de dominios
3. Apunta los servidores DNS a tu hosting

---

## Certificado SSL (HTTPS)

**Importante:** Asegura que tu sitio tenga HTTPS

- **GitHub Pages y Netlify**: ✅ Certificado SSL es automático y gratuito
- **Hosting tradicional**: Muchos hostings ofrecen Let's Encrypt gratuito
- **Dominios personalizados**: Verifica que tu hosting incluya SSL

---

## Mejoras Tras Publicar

### 1. **Configurar Email de Contacto**
Actualmente el formulario no envía emails. Para habilitarlo:

**Opción A: Usando Formspree** (Gratis)
- Ve a https://formspree.io
- Crea un proyecto nuevo
- Reemplaza el formulario HTML con el código que Formspree proporciona

**Opción B: Usando un backend propio** (Requiere programación)
- Node.js + Express
- Python + Flask
- PHP (si tu hosting lo permite)

### 2. **Optimización SEO**
Edita el `index.html` y las meta etiquetas:

```html
<meta name="keywords" content="banda música, semana santa, procesiones">
<meta name="author" content="Banda de Música">
```

### 3. **Google Analytics**
Agrega seguimiento de visitantes:

1. Ve a https://analytics.google.com
2. Crea una propiedad nueva
3. Copia el código de seguimiento
4. Pegalo en el `<head>` de todos los HTML

```html
<!-- Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=GA_MEASUREMENT_ID"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'GA_MEASUREMENT_ID');
</script>
```

### 4. **Mapa Interactivo**
Integra Google Maps:

1. Ve a https://developers.google.com/maps
2. Obtén una API key
3. Reemplaza en `contacto.html`:

```html
<iframe width="100%" height="450" style="border:0; border-radius: 8px; margin-top: 1rem;" 
  src="https://www.google.com/maps/embed?pb=...TU_API_KEY..." 
  allowfullscreen="" loading="lazy"></iframe>
```

---

## Checklist Antes de Publicar

- [ ] Actualizar todos los datos de contacto
- [ ] Cambiar fechas de actuaciones reales
- [ ] Agregar fotografías de la banda
- [ ] Revisar todos los enlaces
- [ ] Probar en móvil y tablet
- [ ] Cambiar los colores si lo deseas
- [ ] Revisar ortografía y redacción
- [ ] Probar el formulario
- [ ] Configurar dominio personalizado
- [ ] Activar HTTPS

---

## Mantenimiento

### Actualizar Contenido:

1. Edita los archivos HTML en tu computadora
2. Haz un commit en Git:
   ```bash
   git add .
   git commit -m "Actualizar noticias de actuaciones"
   git push origin main
   ```
3. Los cambios se publican automáticamente

### Actualizar desde Netlify UI:
- Puedes editar archivos directamente desde el panel de Netlify

---

## Solución de Problemas

### El sitio no aparece tras publishar
- Espera 5-10 minutos
- Borra la caché del navegador (Ctrl+Shift+Delete)
- Verifica que los archivos se subieron correctamente

### Los enlaces no funcionan
- Verifica que las rutas sean relativas
- Revisa que los nombres de archivo coincidan exactamente (mayúsculas/minúsculas)

### El formulario no envía emails
- Necesitas implementar un backend (ver sección "Mejoras Tras Publicar")

### Los estilos no se cargan
- Verifica que las rutas de CSS sean correctas
- Borra caché del navegador

---

## Soporte

Si necesitas ayuda:
- Contacta a tu proveedor de hosting
- Consulta la documentación de GitHub Pages, Netlify, etc.
- Busca tutoriales específicos en YouTube

---

**¡Tu sitio web está listo para publicar!** 🚀

```