Regreso a las páginas web estáticas
Hace unos 10 años cuando descubrí Wordpress, fue una revolución, de repente podía crear un Blog con la famosa instalación de 5 minutos sin apenas conocimientos de PHP, con un panel de administración amigable para los clientes, un directorio de plugins en continuo crecimiento y unos requisitos de servidor bastante básicos, en este escenario hacer páginas web estáticas estaba bien pero no era lo último, por así decirlo.
Sabemos que la herramienta no es lo importante si no como la usas, dependiendo de tu habilidad como desarrollador, WP puede ser la mejor opción para tu proyecto, pero hoy en día tenemos otras opciones con sus ventajas e inconvenientes que vale la pena analizar.
Ahora podemos aprovechar plataformas de terceros para incluir servicios en cualquier sitio web, sin necesidad de utilizar lenguajes de servidor.
- Comentarios: Disqus, Facebook comments.
- Formularios: Formspree, Simple Form, Formingo…
- Campaña de mailing: MailChimp o Campaing Monitor
- Contenido externo: Flikr, Youtube, Vimeo, Soundcloud y Google Maps.
Tenemos generadores de sitios web estáticos con sistemas de plantillas que nos facilitan el diseño de los layouts.
Los generadores de sitios web estáticos son para programadores o aficionados a la tecnología, que se sientan cómodos utilizando la terminal y escribiendo código.
Tecnologías que te encontrarás según el generador que elijas:
- npm Manejador de paquetes node
- Gulp Automatizador de tareas
- Git / GitHub Control de versiones
- Sass Preprocesador de css
- Liquid Sistema de plantillas
- Handlebars Sistema de plantillas
- Jade Sistema de plantillas
- Yaml Formato de serialización de datos
- JSON Formato de texto ligero para el intercambio de datos
Para esta web he creado mi propio theme a partir de minima, el theme por defecto de Jekyll y para los estilos he añadido Bootstrap 4.
Otros generadores que me parecen interesantes son Hugo y Midlemann.
Cómo funcionan los generadores de sitios web estáticos?
- Te instalas el generador y las dependencias necesarias en local.
- Trabajas en tu proyecto.
- Subes tu página web estática generada a tu servidor vía ftp, rsync, Git o la técnica que prefieras.
Hay generadores de sitios web estáticos de todos los sabores, puedes encontrarlos escritos en .Net, Ruby, Phyton, PHP, Go o JavaScript. Pero finalmente con todos obtienes archivos en los lenguajes que conoce el navegador que son HTML, CSS y JavaScript.
Los generadores de sitios estáticos funcionan vía línea de comandos, soportan uno o más sistemas de plantillas, te montan un servidor local para testar y un sitio web estático final para producción.
En StaticGen puedes elegir el que más te guste.
Lo que me gusta de Jekyll
- Jekyll utiliza Yaml Front Matter y Liquid, lo que permite darle algo de lógica a las plantillas, estructuras de control (if, case, for), definir variables etc…
- Puedes añadir el framework front-end que quieras, Foundation, Bootstrap, Materialize o ninguno.
- Puedes alojar tu web gratis en GitHub.
- Al no tener base de datos son más ligeros y más rápidos.
- Al no tener base de datos son más difícil de hackear.
- Puedes escribir tus posts en Markdown.
- Tienes control de versiones con Git.
- Mejoras el posicionamiento.
- Utilizas menos recursos del servidor.
- Aprendes a utilizar tecnologías web modernas
Si quieres añadir funcionalidades avanzadas como zonas autoeditables o un blog fácil de administrar por el cliente puedes hacerlo con aplicaciones de terceros aquí tienes una lista de CMS para webs estáticas.
Alojamiento para Jekyll:
- Netlify, es la opción que estoy utilizando actualmente, ofrece continuo despliegue desde git-hub, CDN global, SSL, optimización de assets y dominio propio, todo esto absolutamente Gratis!
- Surge, no lo he probado pero es otro servicio gratuito para webs estáticas.
- GitHub Pages, gratis, con dominio propio, es la opción que he utilizado hasta conocer Netlify, funciona genial.
Opciones avanzadas:
- Configurar un VPS en DigitalOcean.
- Alojar Jekyll en Amazon S3.
Definitivamente recomiendo Jekyll si:
Eres desarrollador y quieres tener tu propio blog y portfolio, Jekyll es divertido, aprendes cosas nuevas y tienes muchas opciones de alojamiento gratuitas.
Posteado en Programación con : Jekyll
Tweet