Seis prácticas recomendadas para proyectos de páginas web con Adobe Experience Manager

Pero tal y como ocurre con cualquier producto de tal tamaño, también es muy fácil tomar las decisiones equivocadas. AEM es un producto muy flexible al que se pueden hacer muchas personalizaciones. De esta forma, se puede responder a cualquier requisito con diferentes tipos de implementaciones; desde soluciones personalizadas hasta soluciones estrechamente alineadas con los principios básicos del producto.

Gracias a nuestra amplia experiencia en la implementación de AEM y sistemas empresariales de gestión de contenido web en general, conocemos las dificultades que pueden presentarse a la hora de elegir una de las diferentes vías. Además de pensar en la arquitectura de la solución y el grado técnico potencial, también es importante tener en cuenta la rentabilidad y la facilidad de mantenimiento, y asegurarse de que el sistema esté preparado para el futuro.

En este artículo, destacaremos algunos de los factores clave que hay que tener en cuenta al implementar AEM.

1) Diseño y arquitectura

A la hora de diseñar y decidir la estructura de una página web, lo primero que tienes que hacer es evaluar a fondo todos los requisitos y alinearte con las capacidades disponibles lo antes posible. Se pueden crear prototipos para comunicar soluciones alternativas con los usuarios empresariales y para hacer demostraciones de ciertas capacidades listas para usar. En la mayoría de los casos, se puede lograr una cantidad sustancial de eficacia adaptando ligeramente los requisitos iniciales.

Ejemplos:

• Aprovechando el marco de configuración consciente del contexto para que las subpartes del sitio web tengan un aspecto distinto y se comporten de manera diferente;
• Representando listas de documentos provenientes de sistemas externos a través del marco Sling Dynamic Include para que las páginas que las contienen puedan almacenarse en caché;
• Utilizando el Sling Resource Merger para evitar duplicar componentes listos para su uso;
• Eliminando el CSS adaptable y aprovechando las funcionalidades de AEM para el mismo propósito;
• Implementar algunos requisitos fuera de AEM, por ejemplo, integrándose con servicios (micro)externos. Esto es clave para evitar el «uso indebido» de AEM como WCMS.
• Hacer que más del 95 % de las solicitudes se puedan almacenar en caché, lo cual garantiza un rendimiento alto.

2) Componentes principales

Hace unos años, Adobe lanzó la iniciativa de componentes principales de WCM. La idea era alejarse de los antiguos componentes de base, que se habían vuelto obsoletos, y proporcionar una biblioteca sólida de componentes sobre los que cada proyecto podía extenderse.

Esta biblioteca de componentes principales proporciona a los usuarios empresariales un conjunto de bloques de construcción de alta calidad para crear páginas web avanzadas. De forma similar, nosotros nos hemos basado en los mismos principios para desarrollar nuestro propio conjunto de componentes (específicos del proyecto). Esto también significa que contribuimos activamente a los componentes principales para ayudarlos a mejorar con el tiempo.

Al usar estos componentes y aprovechar las ideas que los sostienen, podemos configurar bases de código muy flexibles y tener la posibilidad de actualizar los componentes uno por uno, sin eliminar la compatibilidad con versiones anteriores.

3) Plantillas editables

En el pasado, la tarea de un desarrollador era poner un conjunto de plantillas de páginas a disposición de los usuarios empresariales. Para que un autor de contenido pudiera usar una plantilla concreta, un desarrollador tenía que implementar dicha plantilla y desplegarla en AEM primero. Esto solía alargar los plazos de comercialización.

Sin embargo, en los últimos años, la función «Plantillas editables» ha estado disponible en AEM para reducir la dependencia de TI durante la creación de las páginas. «Plantillas editables» permite que los autores de contenido creen las plantillas ellos mismos, utilizando la interfaz de usuario táctil de AEM.

4) Sistema de estilo y cuadrícula adaptable

Al utilizar las cuadrículas adaptables, los usuarios empresariales pueden gestionar los formatos de las páginas y el comportamiento de los componentes de una forma flexible. Si se combina con el sistema de estilo de AEM, se puede aplicar un estilo predefinido sin sacrificar la coherencia entre las páginas.

El flujo de trabajo tradicional para hacer que el contenido fuera adaptable requería que un diseñador creara maquetas para los diferentes puntos de ruptura, que el desarrollador las implementara para una plantilla específica y que el autor eligiera esa plantilla e introdujera el contenido. Con las cuadrículas adaptables, este flujo de trabajo se simplificó en gran medida: el autor introduce el contenido y puede adaptar el diseño de forma autónoma, sin necesidad de consultar con un desarrollador sobre la adaptabilidad o esperar a las nuevas implementaciones. Esta característica, introducida en AEM 6.3, proporciona flexibilidad a los usuarios empresariales y, al mismo tiempo, no requiere que los desarrolladores se encarguen de estas tareas. Por último, no es necesario hacer ningún trabajo de desarrollo (e implementación) para cambiar una plantilla.

Sin embargo, esta flexibilidad tiene un precio: ahora, los usuarios empresariales tienen que encargarse de gestionar los ajustes de formato de los componentes en las páginas, lo cual puede llevar mucho trabajo. A menudo, lo mejor es encontrar un término medio en el que unos ajustes de diseño sean fijos y otros se dejen flexibles. Podemos ayudarte a encontrar el equilibrio perfecto.

5) Prácticas recomendadas para el desarrollo de páginas web

También hay prácticas recomendadas generales de desarrollo, así como estándares técnicos específicos de AEM que aplicamos en todos los proyectos de AEM. Resumamos algunas:

• Quien rompe la compilación, la corrige;
• Hay que hacer pruebas unitarias y pruebas de integración para cada función nueva;
• Hay que enviar solicitudes de combinación cuando se finaliza una función;
• Un líder técnico tiene que realizar una revisión por pares;
• Se deben utilizar modelos de Sling para el desarrollo de componentes, incluso en los casos de componentes muy simples;
• Utiliza el patrón de componentes Proxy;
• La documentación técnica y de usuario debe estar siempre actualizada;
• El código se debe probar en AEM, así como a través del Dispatcher;
• Las duplicaciones de código no deben estar permitidas, las reglas de SonarQube deben estar configuradas, todas las compilaciones activan un escaneo de SonarQube, etc.

6) Automatización completa

Nos esforzamos por maximizar la automatización para aumentar la calidad de nuestro trabajo. En las instalaciones locales de AEM 6.5, utilizamos la infraestructura como código para automatizar la configuración de los servidores, así como nuestros entornos locales. De esta forma, cualquier desarrollador puede ponerse a trabajar, en unos minutos, en un entorno local lo más cercano posible a la producción. Esta configuración también incluye una instancia local de Dispatcher, para asegurarnos de poder detectar fallos del almacenamiento en caché de forma inmediata.

En las instalaciones de AEM as a Cloud Service, el Cloud Manager de Adobe nos es de gran ayuda, ya que automatiza totalmente las actualizaciones, las correcciones de seguridad y los lanzamientos, combinado con puertas de calidad predefinidas y personalizadas.

Cada vez que se comprueba un cambio de código en el control de versiones, se ejecuta una compilación y, si hay algún problema, se informa inmediatamente a los desarrolladores. Dependiendo de la rama concreta, se hará una implementación en el entorno aplicable, de manera que los cambios parecen de forma inmediata en el sistema correspondiente.

Seguimos estos principios y somos flexibles a la hora de hacer nuestros lanzamientos de una manera totalmente automatizada. La implementación a producción se realiza con solo pulsar un botón.

Conclusión

Es fundamental conocer las prácticas recomendadas más actuales para el desarrollo de páginas web en el WCMS con el que estás trabajando. Pero quizás sea incluso más importante saber que trabajar con un socio que conoce estas prácticas y las implementa dentro del equipo del proyecto es fundamental para garantizar el éxito de tu proyecto de experiencia digital. Estas directrices no solo son valiosas a la hora de desarrollar una nueva página web, sino también al planificar actualizaciones o una expansión de tu plataforma de Adobe actual.