Los modelos y tecnologías de desarrollo web han evolucionado mucho en la última década, existen multitud de aplicaciones, frameworks, librerías, arquitecturas y sistemas de publicación en diferentes versiones que a su vez reciben cambios o mejoran con el tiempo.
El progreso también ha tenido lugar en lo relacionado con la administración de sistemas, servicios de alojamiento, técnicas de escalabilidad, monitorización y gestión de centros de procesos de datos.
Esta evolución ha dado lugar a la convergencia de una gran cantidad de tecnologías, herramientas y estilos arquitectónicos para desarrollar sitios web y aplicaciones, te contamos los aspectos más importantes relacionados con ellos, y la manera en la que interactúan entre sí.
Contenidos de esta publicación
Arquitectura básica de una aplicación web
Para que un sitio o aplicación web funcione mostrándose al público es necesaria una arquitectura que disponga como mínimo los siguientes elementos:
El navegador: Representa el concepto de cliente realizando peticiones solicitando recursos a diferentes servidores web a través de URL.
El Servidor: Almacena de forma organizada la estructura de la información del sitio web para servir los contenidos en relación a las peticiones del navegador.
El protocolo http: Es el protocolo basado en TCP/IP a través del cual el navegador realiza peticiones al servidor para que este responda.
HTML: Es el formato básico de los documentos que componen las páginas web, está basado en etiquetas y sirve para estructurar la forma de mostrar los contenidos de las páginas.
CSS: Las hojas de estilo en cascada sirven para favorecer estéticamente los elementos y contenidos estructurados a través de las etiquetas HTML, dotándoles de personalidad en cuanto a su diseño, forma y colores.
Tecnologías del lado del cliente o del lado del servidor
Además de reunir los requisitos anteriores básicos para funcionar, un sitio o aplicación web puede crearse utilizando diferentes tecnologías que se dividen en dos grandes categorías:
Tecnologías de cliente: Son aquellas que permiten crear interfaces de usuario y establecer comunicación con el servidor basadas en HTML, CSS y JavaScript, en este caso, el navegador actúa como intérprete.
Tecnologías de servidor: Permiten implementar comportamientos de la aplicación web en el servidor, los lenguajes de programación más utilizados son Java EE, .NET, PHP, Ruby on Rails, Python, Django, Groovy, Node.js, etc…
Arquitecturas web de contenido estático o dinámico
Se dice que el contenido que muestra una determinada página o sitio web al completo es contenido estático cuando no permite la interacción del usuario de ninguna forma, por el contrario las páginas que invitan a interactuar con el visitante a través de diferentes elementos como formularios, botones, mapas, etc… ofrecen contenido dinámico.
Cliente estático y servidor estático: En este modelo el navegador hace una petición al servidor mediante el protocolo http, el servidor transforma la URL a ruta de disco y devuelve el fichero al navegador que lo dibuja o renderiza mostrando la estructura de la página en HTML y su contenido como fotos y vídeos, también la estética de su diseño gracias a los estilos CSS.
En este caso no existe ningún tipo de interacción utilizando JavaScript, el servidor devuelve siempre los mismos recursos, así que desde este punto de vista la web es estática.
Cliente estático y servidor dinámico: Este modelo se compone de 3 capas, ya que intervienen por un lado el navegador y el servidor web, pero también una base de datos asociada a este último.
Cuándo el servidor recibe una petición, devuelve contenido del disco o ejecuta código para generar el recurso dinámicamente, este código normalmente realiza consultas a la base de datos para recuperar la información, generando la página HTML y contenidos de forma dinámica.
Cliente dinámico y servidor estático: En contenido está alojado en el disco duro del servidor de forma estática, pero el cliente es dinámico porque las páginas incluyen código JavaScript que se ejecuta en el navegador.
Este código JavaScript puede realizar acciones y efectos gráficos, mostrar y ocultar información, desplegar elementos interactivos, adaptar los contenidos, etc…
Cliente dinámico y servidor dinámico: Se combinan los conceptos de los dos casos anteriores, utilizando JavaScript para efectos gráficos y comportamientos interactivos, pero también para realizar peticiones en segundo plano (AJAX) y aplicaciones de página única con API REST.
JavaScript se puede utilizar para no tener que recargar completamente la página al pulsar un enlace, realizando peticiones al servidor web en segundo plano (ocultas al usuario). Cuando llega al navegador el resultado de la petición, el código JavaScript actualiza solo las partes necesarias de la página.
A esta técnica se la conoce como AJAX (Asynchronous JavaScript And XML) y mejora mucho la experiencia de usuario ya que al realizar las peticiones el servidor puede devolver fragmentos de HTML generados dinámicamente, recursos estáticos en disco como imágenes, PDF, mostrar errores, cambiar colores, información estructurada en XML o JSON, etc…
Tecnologías estándar del lado cliente
El W3C (World Wide Web Consortium) es una comunidad internacional que desarrolla estándares abiertos que aseguran el crecimiento de la web a largo plazo, tales como HTML5&CSS, Scripting and AJAX, normas de accesibilidad, gráficos, audio y vídeo, web semántica, XML y muchos más.
HTML: (Hypertext Markup Languaje) proporciona la información estructurada en secciones, párrafos, título, imágenes, etc… la versión actual el HTML5, y ofrece muchas librerías avanzadas para la inserción de contenidos multimedia, canvas, comunicaciones y concurrencia.
CSS: (Cascading Style Sheets) se encarga de la distribución de los elementos y su estilo con colores, tipos de letra, fondos, efectos, etc…en documentos HTML, XML, SVG o incluso interfaces de usuario de otras tecnologías.
Scripting: Gracias al scripting las páginas pueden programarse con distintos lenguajes de script, aunque principalmente se utiliza JavaScript, que modifica la página gracias a su capacidad de ejecutar código cuando se interactúa con ella.
JavaScript inicialmente era un lenguaje interpretado pero actualmente también se ejecuta con máquinas virtuales en los navegadores aumentando la velocidad de ejecución y eficiencia de memoria. Es de tipado dinámico y funcionalmente orientado a objetos (basado en prototipos).
Existen multitud de bibliotecas (APIS) para el desarrollo web y de aplicaciones, pero las más utilizadas son JQuery y Underscore.js.
DOM: Es el modelo de objetos del documento (Document Object Model) y consta de una librería (API) para manipular el documento HTML cargado en el navegador, permitiendo la gestión de eventos, o la inserción y eliminación de elementos.
Tecnologías no estándar para desarrollo web
Durante bastante tiempo la carencia de tecnologías abiertas para realizar diferentes acciones asociadas a comportamientos y contenidos multimedia hizo que algunas tecnologías propietarias ocuparan este hueco, siempre por iniciativa de empresas de desarrollo de software, a continuación destacamos algunas de las más conocidas.
Adobe Flash: Se trata de una tecnología utilizada para incrustar contenido multimedia interactivo en páginas web que predominó durante mucho tiempo, gratuita para el usuario pero de carácter propietario y cerrado para los desarrolladores, que deben pagar licencia para poder usarla, motivo principal por el que está cada vez más en desuso.
Java Applets: Los Applets de Java fueron los precursores de Flash, pero debido a prácticas anticompetitivas de Microsoft y de Sun Microsystems estaba más centrada en los servidores de aplicaciones, así que también hace tiempo que se encuentra en desuso.
Microsoft Silverligth: Fué durante tiempo la apuesta de Microsoft para competir con Adobe Flashs, pero el soporte era muy limitado en plataformas diferentes a Windows.
Tecnologías de servidor
Los estándares son muy importantes en los navegadores web (cliente) ya que es importante que la web sea compatible con cualquier dispositivo, sin embargo estos estándares no son necesarios en el servidor, por que cada organización desarrollará su servidor con la tecnología que crean conveniente.
En el servidor se utilizan tecnologías propietarias o abiertas para el desarrollo de aplicaciones web, existen multitud de ellas, entre ellas las más usadas son PHP, Java EE y ASP.NET, y las menos usadas Ruby on Rails, Grails (Groovy), Django (Phyton), Perl, ColdFusion, hay muchas más, pero entre ellas comentamos a continuación las más destacadas.
Java EE: Es una tecnología basada en Java desarrollada por una coalición de empresas lideradas por Oracle, IBM, Red Hat, etc… muy utilizada a nivel empresarial, la mayoría de implementaciones y herramientas para desarrollo son software libre, y existen comunidades de desarrolladores y empresas que realizan complementos.
PHP: Es una tecnología con lenguaje propio, desarrollada por PHP Group y con licencia libre. Es la tecnología de lado de servidor con la que se han implementado más servidores en Internet, es multiplataforma y se integra normalmente con Apache y MySQL en entornos Linux gracias a un paquete llamado LAMP.
ASP.NET: Se trata de una versión evolucionada del ASP clásico, está integrada en la tecnología .NET de Microsoft junto con el lenguaje C#, tiene licencia propietaria y para plataformas Windows y una comunidad de desarrolladores má limitada que otras alternativas.
Bases de datos
Las bases de datos más populares y utilizadas para el desarrollo de aplicaciones web son las bases de datos relacionales. Hay muchas bases de datos relacionales tanto comerciales como de software libre como MySQL, Derby, Oracle, MS SQL Server, PostgreSQL.
Actualmente el sistema gestor de bases de datos más utilizado es MySQL, es multiplataforma y está desarrollado en C, tiene licencia de código abierto GPL y consta de una herramienta interactiva para hacer consultas y crear bases de datos, en su conjunto se ha hecho muy popular en el desarrollo web.
Las aplicaciones web tienen necesidad de escalabilidad y tolerancia a fallos, es por esto que se está haciendo hueco una nueva familia de bases de datos denominadas NoSQL, entre las que se encuentran Cassandra, mongoDB, riak, redis.
Sistemas gestores de contenidos
Desde hace tiempo se imponen los sistemas de gestión de contenidos o CMS (Content Management System), que son de aplicaciones web prediseñadas y configuradas inicialmente para crear y administrar contenidos online.
Los CMS utilizan conjuntamente varias de las tecnologías anteriormente descritas, y han evolucionado para convertirse en un nuevo modelo de desarrollo de sitios web, configurando y adaptando módulos por medio de una interfaz web.
El sistema también permite manejar de manera independiente el diseño y el contenido, modificando su estructura por medio de plantillas o temas.
Existen multitud de CMS con enfoques y objetivos diferentes como Drupal (PHP), Joomla (PHP), WordPress (PHP), Plone (JavaScript), Moodle (PHP), Liferay (Java), PrestaShop (PHP), etc…
Conclusiones
El diseño y desarrollo de sitios web y aplicaciones online conlleva la elección y el conocimiento de las tecnologías que se decidan emplear, con el objetivo de favorecer su implementación y garantizar un mantenimiento.
Los gestores de contenidos son una alternativa ideal para crear sitios web completos evitando el coste de los desarrollos «desde 0» o partiendo de la utilización de un framework, pero la elección depende de la manera de enfocar cada proyecto según sus características o singularidades.
En IngenioVirtual diseñamos y desarrollamos sitios web utilizando diferentes tecnologías, si dudas sobre cuál será la más adecuada para crear el sitio web asociado a tu actividad ponte en contacto, estamos a tu servicio para asesorarte.
