Democratización del Conocimiento con IA

Sitio web informativo sobre “La Democratización del Conocimiento en Tiempos de la Inteligencia Artificial”, desarrollado como práctica del Módulo 1 (Cloud Computing) de la Maestría en IA/ML/Data Science.

Repo: https://github.com/draexx/mod1-cloud-democracia-conocimiento-ia

Demo

Desplegado en Vercel (recomendado). Si aún no existe el deploy, conéctalo a este repositorio y haz Deploy.

Características

• Diseño moderno, responsivo y accesible (HTML5 + CSS embebido)
• Paleta profesional (azules/índigos, acentos cian)
• Tipografías Inter y Plus Jakarta Sans (Google Fonts)
• Íconos Font Awesome
• Secciones: Hero, Problema/La Brecha, Rol de la IA, Beneficios, Recursos, Testimonios, FAQ, CTA y Footer
• Animaciones sutiles on-scroll y microinteracciones
• Modo oscuro automático (según sistema) y manual (toggle) con persistencia
• Mejores prácticas UX: smooth scroll, navegación móvil, foco visible, reduced-motion

Estructura del proyecto

• index.html: Estructura semántica, estilos y JS ligero para interacciones
• vercel.json: Cabeceras de seguridad (incluye Content-Security-Policy)
• .gitignore: Ignora archivos de sistema, logs, node_modules, etc.

Tecnologías

• HTML5 + CSS (sin build) + JavaScript nativo
• Google Fonts, Font Awesome (CDN)
• Vercel (hosting y headers)

Desarrollo local

1. Clonar el repo:

   git clone https://github.com/draexx/mod1-cloud-democracia-conocimiento-ia.git
   cd mod1-cloud-democracia-conocimiento-ia

2. Abrir index.html en tu navegador.

Despliegue en Vercel

1. Conecta el repositorio en https://vercel.com/import/git
2. Proyecto estático (no requiere build). Output: raíz del repo
3. vercel.json añadirá cabeceras seguras automáticamente

Content-Security-Policy

El archivo vercel.json permite imágenes desde https: y images.unsplash.com y fuentes desde Google/Cloudflare. Si usas otros CDNs, ajústalo. Fragmento clave:

{
  "headers": [{
    "source": "/(.*)",
    "headers": [{
      "key": "Content-Security-Policy",
      "value": "default-src 'self'; img-src 'self' https: data: blob: images.unsplash.com; style-src 'self' 'unsafe-inline' https://fonts.googleapis.com https://cdnjs.cloudflare.com; font-src 'self' https://fonts.gstatic.com https://cdnjs.cloudflare.com; script-src 'self' 'unsafe-inline'; connect-src 'self'"
    }]
  }]
}

Modo oscuro

• Respeta prefers-color-scheme
• Toggle en el header con persistencia en localStorage

Accesibilidad

• :focus-visible, contraste adecuado, reducción de movimiento
• Imágenes con loading/decoding y dimensiones para evitar CLS

Personalización rápida

• Edita textos en index.html
• Cambia la paleta en :root (variables CSS)
• Sustituye imágenes (picsum.photos) por activos propios en assets/ si lo deseas y ajusta src

Contribuir

1. Crea una rama
2. Commits claros (ES/EN)
3. Abre un Pull Request

Licencia

MIT. Crea LICENSE si aún no existe.

Descripción del repositorio (GitHub)

Para añadir/editar la descripción y website del repo:

1. Ve al repo en GitHub → Settings → General
2. En “Description” agrega: “Sitio web sobre la democratización del conocimiento en tiempos de la IA (Módulo 1 Cloud Computing)”.
3. En “Website” coloca la URL del deploy en Vercel. EOF

git add README.md && git commit -m "docs: README del proyecto (características, deploy, CSP, modo oscuro)" && git push -u origin main