por .

Un nuevo enfoque para diseño y desarrollo de sitios web: No-DB CMS.

Ya ha pasado casi un año desde que Pixmat dejó de utilizar ampliamente Wordpress para todos los sitios de nuestros clientes y comenzamos a utilizar otras tecnologías y sistemas para construir esos mismos sitios en una cantidad de tiempo inferior y con amplias mejoras en performance.

Ha sido un cambio radical y las mejoras han sido enormes, reduciéndonos costos y el tiempo que demorábamos en diseñar un nuevo sitio.

Queremos compartir con ustedes nuestra experiencia con sistemas alternativos para diseño y desarrollo de sitios web. Esta alternativa es muy útil y recomendable para sitios y clientes pequeños, como instituciones, sitios tipo brochure o páginas que administrarás por tu propia cuenta.

¿Qué hacíamos antes?

Pixmat ha estado haciendo sitios web desde 2008. Desde un principio hemos hecho desde plataformas y aplicaciones web completas, hasta sitios pequeños.

Para todos los sitios que diseñábamos y desarrollábamos utilizamos Drupal (a un inicio), Expression Engine, PyroCMS y Wordpress por más de 4 años.

Hacer sitios con Wordpress y los otros sistemas es sumamente útil y tiene múltiples ventajas:

  • Tienes un panel de administración disponible.
  • Hay una comunidad enorme.
  • Hay plugins, templates, documentaciones y tutoriales disponibles en todos lados.
  • Es fácil diseñar para ellos.
  • Muy flexibles, puedes hacer casi de todo con ellos.

Si bien esto permite hacer cualquier cantidad de sitios, este enfoque tiene también algunas desventajas, sobre todo para sitios (y clientes) pequeños:

  • Dependencia en una base de datos, lo que hace que hasta para el más simple sitio necesites una base de datos.
  • Hay clientes que no les interesa tener un panel de administración ni administrar su sitio, así que se vuelve innecesario.
  • Tu cliente necesita un servidor con base de datos incorporado.
  • Sitios lentos, aún cuando digas que optimizaste tu servidor y estás sirviendo versiones en caché, no es más eficiente que servir archivos puramente estáticos.

Quitando dolores de cabeza

Pensemos un cliente hipotético: una institución pequeña, donde sólo les interesa tener amplia información de la institución, que hacen, su equipo y quizás una galería pequeña. Tu cliente no mantendrá el sitio por el mismo, por lo que un panel de administración es completamente innecesario. A tu cliente le interesa ampliamente que el sitio sea rápido y cuenta con un presupuesto limitado.

Hace año y medio hubiésemos dicho: Wordpress, hoy no:

  • ¿Es realmente necesario tener un Panel de Administración, aún si tu cliente no lo utilizará?
  • ¿Por qué necesitas una base de datos, si sólo consumirás ciertos datos? No tendrás relaciones complejas ni nada. La Base de Datos ya no es una necesidad.
  • Tu cliente tiene un presupuesto limitado, ¿le cobrarás de más por la integración con Wordpress, aún si no la necesita?
  • Por tu “pereza”, ahora tienes un sitio consumiendo ampliamente una base de datos. Adiós rapidez, a menos que gastes mucho más dinero optimizando el servidor.

Al final, debemos recordar que nuestro explorador no entiende de sitios dinámicos, lenguajes en servidor o bases de datos: sólo entienden HTML, CSS y JavaScript. Hagas lo que hagas, lo único que le interesa renderizar es la parte estática, mas no dinámica.

Bienvenido Jekyll

Utilizamos Jekyll por primera vez hace quizás un año. Jekyll es un generador de sitios estáticos escrito en Ruby.

Por sitios estáticos entendamos sitios escritos única y exclusivamente con HTML, CSS y JavaScript, sin un lenguaje de programación en el lado del servidor (como PHP o Python) ni una base de datos.

Jekyll permite generar sitios estáticos (HTML) utilizando templates. Todo el contenido del sitio Jekyll es escrito utilizando lenguajes de marcado básicos, como Markdown o Textile. Jekyll es muy conocido y ampliamente utilizado y también es la tecnología detrás de GitHub Pages.

La idea para utilizar Jekyll es sumamente simple:

  • Escribimos todos los contenidos, como blog posts o el contenido completo utilizando un editor simple de texto (como Byword en Mac).
  • Generamos templates por secciones.
  • Generamos configuraciones y hasta traducciones a nivel de toda la aplicación.

Para editar los contenidos de Jekyll desde GitHub contamos con Prose.io, el cual lo utilizamos sólo una vez y es realmente útil si tenemos nuestro código alojado en GitHub y si vamos a usar GitHub Pages. Alternativas a Jekyll hay varias, quizás la más conocida es Middleman.

Jekyll generará sólo archivos y sitios estáticos, por lo que no podremos utilizarlo para comentarios, servir vídeos o fotografías. Al hacer sitios con Jekyll también utilizamos otros servicios externos, por ejemplo:

  • Amazon S3 para guardar imágenes, vídeos y HTML estático. Incluso podemos guardar todo un sitio por un par de centavos al mes ;).
  • Transloadit para manejar imágenes.
  • Vimeo para guardar vídeos.
  • Facebook o DISQUS para los comentarios.

Bienvenido Kirby

Luego de casi un año utilizando Jekyll encontramos una alternativa de Jekyll escrita en PHP llamada Kirby. El proceso es muy similar al que llevamos con Jekyll: hacemos contenidos estáticos utilizando un simple editor y escribimos templates individuales por sección.

Hemos utilizado Kirby para dos sitios ya y nuestra primera impresión es: ¡Kirby es lo máximo!. Kirby es casi un clon de Jekyll escrito en PHP:

  • Tienes templates por página, mapeados de igual manera por el nombre de los archivos.
  • Tienes mapeo automático de URL por el nombre de los archivos.
  • Tienes configuraciones globales, contenidos escritos en un lenguaje parecido a Markdown.
  • Posee una comunidad y soporte emergente, muy bueno.
  • Kirby es fácil de extender, sólo que en vez de utilizar Ruby usas PHP.
  • Soporte nativo para múltiples lenguajes.
  • Kirby, además, tiene un Panel de Administración opcional.
  • Todo su código está disponible y abierto.

La única desventaja de Kirby es que cuesta $30.00 para su uso, pero les puedo asegurar que lo vale completamente.

Ventajas de este enfoque

Este nuevo enfoque ha ido ganando nuevos adeptos desde hace meses y cada vez es más común leer de personas que dejaron Drupal o Wordpress por Jekyll, Statamic o Kirby. Cada día Más personas escriben de esto.

Las ventajas son grandes, pero para mencionar algunas:

  • Nuestro proceso es realmente más rápido. No necesitamos configurar un CMS como Wordpress, buscar compatibilidad de módulos o plugins, actualizar el sistema. Sólo escribir contenido, diseñar e implementar.
  • La flexibilidad con que contamos para desarrollar sitios no tiene límites.
  • Las aplicaciones resultantes son rápidas, realmente rápidas.
  • Los costos de mantenimiento son muy inferiores. Los costos de servidores serán ínfimos.

Demóstenes lidera el equipo de Ingeniería en Pixmat Studios. Es Ingeniero Electrónico y amante del café.


Comentarios

Nosotros

Pixmat Studios es una agencia de diseño y desarrollo de soluciones tecnológicas basado en Ciudad de Panamá.


Twitter

Continuemos la conversación en las redes sociales. ¡Síguenos en Twitter!



Artículos Recientes


Tags


Notice: Array to string conversion in /var/www/pixmatstudios.com/htdocs/site/plugins/tagcloud.php on line 38

Fatal error: Uncaught Error: Function name must be a string in /var/www/pixmatstudios.com/htdocs/site/plugins/tagcloud.php:38 Stack trace: #0 /var/www/pixmatstudios.com/htdocs/site/snippets/blog_sidebar.php(42): tagcloud(Object(page)) #1 /var/www/pixmatstudios.com/htdocs/kirby/lib/template.php(36): require('/var/www/pixmat...') #2 /var/www/pixmatstudios.com/htdocs/kirby/lib/helpers.php(66): tpl::loadFile('/var/www/pixmat...', Array, false) #3 /var/www/pixmatstudios.com/htdocs/site/templates/article.php(73): snippet('blog_sidebar') #4 /var/www/pixmatstudios.com/htdocs/kirby/lib/template.php(36): require('/var/www/pixmat...') #5 /var/www/pixmatstudios.com/htdocs/kirby/lib/template.php(25): tpl::loadFile('/var/www/pixmat...', Array, true) #6 /var/www/pixmatstudios.com/htdocs/kirby/lib/site.php(206): tpl::load('article', Array, true) #7 /var/www/pixmatstudios.com/htdocs/kirby/system.php(65): site->load() #8 /var/www/pixmatstudios.com/htdocs/index.php(71): require_once('/var/www/pixmat...') #9 {main} thrown in /var/www/pixmatstudios.com/htdocs/site/plugins/tagcloud.php on line 38