Guía de buenas prácticas de uso del CMS Govimentum · 2018. 10. 25. · Guía de buenas prácticas de uso del CMS Govimentum La información aquí consignada, busca ampliar el conocimiento

2

Guía de buenas prácticas de uso del CMS Govimentum

3

-- Alcaldía Mayor de Bogotá --

EQUIPO DE TRABAJO

Sergio Martínez Medina Alto Consejero Distrital de TIC

Jenny Bibiana Bonilla OspinaIngeniera Asesora Alta Consejería Distrital de TIC

Fabián Hernández Nieto Líder del proyecto de Distribución Distrital CMS Govimentum Alta Consejería Distrital de TIC

Laura Liliana Escobar GarzónProduct Owner usabilidadUniversidad Nacional de Colombia

Diana Rodríguez Cely Magister (c) en discapacidad e inclusión social Universidad Nacional de Colombia

4


TABLA DE CONTENIDO

Introducción 6

Sobre la Guía 8

¿A quién está dirigido este documento? 9

Etapas del Proceso 10

IMPLEMENTACIÓN 11

Alistamiento 13

Servidor Web 15

PHP 19

Motor de Base de Datos 21

Ambientes de despliegue de Govimentum 23

Ambientes de despliegue bajo demanda 24

Instalación 26

Post - Instalación 29

Gestión de Govimentum a través de la línea 31

de comandos Drush

Control de cambios 32

MIGRACIÓN 33

Definición y asignación de roles de usuario 36

ESTABILIZACIÓN 39

¿Qué es accesibilidad web? 40

¿Porqué es importante la accesibilidad? 40

Marco normativo 41

Principios de accesibilidad 42

Categorías 43

5


Contenido 45

Lenguaje claro 46

Enlaces (contexto) 48

Jerarquías en el contenido 49

Tablas 51

Listas 53

Multimedia 54

Navegación 57

Consistencia 58

Menú y mapas del sitio 60

Evitar bloques 61

Teclado y foco 63

Diseño 65

Color 66

Imágenes 68

Carruseles y animaciones 70

Entrada de datos asistida (Formularios) 72

Referentes 73

6


INTRODUCCIÓN

La Alcaldía Mayor está compuesta por 56 entidades del orden central y 20 alcaldías locales, sin contar con los centros de salud de carácter público y los colegios que hacen parte de la red de Instituciones del Distrito de Bogotá. Muchas de estas instituciones tenían páginas web desactualizadas, que no cumplían con estándares eficientes de calidad y en el peor de los casos, muchas de ellas, ni siquiera contaban con sitio web.

Las páginas web son un canal de comunicación entre las entidades y los ciudadanos, por lo cual, la Alcaldía Mayor de Bogotá, requería contar con una plataforma que estandarizara las funcionalidades de las páginas web, disminuyera tiempos de implementación, optimizara los servicios de cara a los ciudadanos y aportará al cumplimiento de la normatividad vigente.

Esta problemática motivó el desarrollo de Govimentum, una solución mediante la cual se pudiera institucionalizar la imagen de las páginas web de todas las entidades del Distrito, de acuerdo con la estrategia nacional de Gobierno en Línea y la Ley de Transparencia y del derecho de acceso a la información pública (1712 de 2014) y de esta forma optimizar los servicios que se prestan en estas páginas, a través de una red colaborativa de gestores de contenido o web master incorporando procesos de innovación pública digital.

Esta guía de buenas prácticas y recomendaciones de la Distribución Distrital CMS: Govimentum, es un documento que busca dar apoyo al proceso de implementación de esta plataforma facilitando su apropiación como herramienta, que les permite a las entidades distritales desarrollar sus sitios Web de forma estandarizada y bajo una estrategia colaborativa.

A partir de un previo diagnóstico y las conclusiones arrojadas por el mismo, este documento fue estructurado en tres grandes

7


fases, correspondientes a tres momentos hito del proceso: la implementación, la migración y la estabilización.

Así, en la primera fase de implementación, este documento provee

a los webmasters tanto información y pautas técnicas para aplicar

al proceso de despliegue e instalación de la plataforma, como

recomendaciones para reducir los posibles factores que impidan

la correcta ejecución del paquete de instalación de Govimentum.

En la segunda fase de migración, se describen brevemente

las características funcionales de Govimentum, las cuales

implementan el Estándar de Publicación y Divulgación de la

Información Pública1, en cumplimiento de lo establecido en la Ley

de Transparencia y Acceso a la Información Pública2, permitiendo a

los webmasters migrar o cargar manualmente la información de la

entidad relacionada con las siguientes categorías de información:

Mecanismos de Contacto, Información de Interés, Estructura

Orgánica, Talento Humano, Normatividad, Presupuesto, Control,

Contratación, Trámites y Servicios e Instrumentos de Gestión de

la Información.

Por lo anterior, esta arquitectura de información permitirá la

definición y asignación de roles de usuario en la plataforma,

con el fin de involucrar a todos los responsables de las áreas

administrativas y oficinas de comunicaciones en el proceso de

cargue de esta información.

En la tercera fase de estabilización, se proporcionan pautas para la

gestión y correcta carga de los contenidos, brindando un contexto

ampliado y descriptivo sobre accesibilidad web, la importancia de

ésta en Colombia, y las pautas a tener en cuenta para generar

contenidos web accesibles en Govimentum.

1 “Resolución 3564 de 2015 Ministerio de Tecnologías de la Información ....” 31 Dec. 2015, http://www.alcaldiabogota.gov.co/sisjur/normas/Norma1.jsp?i=66249. Revisado 10 Jul. 2018.

2 “Ley 1712 de 2014 Nivel Nacional - Secretaría Jurídica Distrital.” 6 Mar. 2014, http://www.alcaldiabogota.gov.co/sisjur/normas/Norma1.jsp?i=56882. Revisado 10 Jul. 2018.

8


La información aquí consignada, busca ampliar el conocimiento que tienen los equipos responsables de la carga de contenidos en las entidades, con relación a tres ejes: contenido, navegación y diseño. Más allá de presentar los criterios basados en la Norma Técnica Colombiana 5854, se pretende realizar una descripción del problema, mostrar un referente grafico de la solución, los beneficios, y las características de la implementación, esto, suministra a los ciudadanos con y sin discapacidad, información accesible capaz de ser comprendida, percibida y operada satisfactoriamente.

SOBRE LA GUÍA

La Alta Consejería Distrital de TIC por medio del Vivelab Bogotá, realizó un proceso de diagnóstico en usabilidad con el objetivo de optimizar la Distribución Distrital CMS: Govimentum. Este proyecto fue desarrollado con el fin de aportar a la estandarización de las páginas web del Distrito Capital, impulsando una estrategia de desarrollo colaborativa que invita a las entidades distritales a participar en la construcción de esta plataforma de Software Libre. Esta estrategia de desarrollo colaborativo está compuesta por cinco ejes transversales: normatividad, tecnología, metodología, accesibilidad y comunidad.

Durante las pruebas de usabilidad con webmasters se identificaron malas prácticas no sólo en la implementación y en el proceso de migración de la información a Govimentum, sino también en la gestión del contenido mismo, siendo el principal problema, la falta de diligenciamiento o el diligenciamiento errado de los campos predefinidos por Govimentum, lo que limita el acceso a la información del sitio web institucional.

Un ejemplo de lo anterior se evidencia al momento de no digitar correctamente o no diligenciar los campos de Título y Texto alternativo en las imágenes, o el campo de Descripción en los videos, restringiendo así el derecho de acceso a una información

9


completa, clara y efectiva para cualquier tipo de usuario, con o sin discapacidad.

Sumado a lo anterior, un equipo del Vivelab Bogotá navegó diferentes portales que han implementado Govimentum, encontrando obstáculos de comprensión, operatividad y percepción de los contenidos, para diferentes tipos de discapacidad (personas ciegas, con baja visión y sordas).

Por lo anterior y teniendo en cuenta los hallazgos y sugerencias generadas en el proceso de validación a Govimentum, la Alta Consejería Distrital de TIC con el apoyo del Laboratorio Digital de Bogotá, genera este material de apoyo como insumo para optimizar el proceso de implementación, migración de contenidos y específicamente el manejo de pautas de accesibilidad web para que los webmasters o personas encargadas de la gestión de contenidos en las diferentes entidades distritales, logren administrar de forma sencilla su portal, en concordancia con los lineamientos de la Norma Técnica Colombiana (NTC) 5854.

¿A QUIÉN ESTÁ DIRIGIDO ESTE DOCUMENTO?

Entendiendo que en el proceso de implementación y desarrollo con el CMS: Govimentum intervienen múltiples perfiles, y que cada uno de ellos está claramente definido en su objetivo, sus tareas y alcances con esta plataforma; a lo largo de este documento se identifican los diferentes roles que participan en el proceso, de forma tal, que previo a introducir las temáticas, se especifica a quién va dirigida la información.

En este sentido se han clasificado los siguientes perfiles:

Administrador de infraestructura: Profesional o técnico con experiencia en la administración de sistemas operativos

10


encargado de configurar e implementar los ambientes de despliegue de Govimentum.

Webmaster: Profesional o técnico en las áreas de ingeniería de software con experiencia en desarrollo en el lenguaje PHP y administración del Sistema de Gestión de Contenidos Drupal encargado de la configuración, mantenimiento y soporte del Sitio web Institucional.

Diseñador: Profesional o técnico en las áreas de diseño gráfico con experiencia en diseño para la web encargado de producir las piezas gráficas, insumos para la web y publicaciones, generalmente del área de comunicaciones.

Gestor de Contenido: Profesional en comunicación social y periodismo o funcionarios delegados por la entidad encargados de producir y publicar la información en el sitio web de acuerdo con la misión del área a la que pertenece.

ETAPAS DEL PROCESO

De acuerdo con el documento diagnóstico de Govimentum en torno a la experiencia de usuario para el proyecto, el cual se enfoca en la optimización del servicio y manejo eficiente de esta Distribución de Drupal por parte de las entidades del Distrito Capital, se analizaron las siguientes etapas del proceso: solicitud, implementación, migración y estabilización de la plataforma.

Para este documento en específico, se abordarán las tres últimas, teniendo en cuenta que fueron los momentos que evidenciaron problemas durante el diagnóstico y de las cuales se sugieren acciones de mejora a lo largo de esta guía.

12


La fase de implementación corresponde al proceso de despliegue e instalación del gestor de contenido y verificación de su correcto funcionamiento. Por tanto, una vez la entidad obtiene el código fuente de Govimentum, puede proceder a su instalación en los ambientes de despliegue configurados para alojar la página web institucional, los cuales pueden ser suministrados por un proveedor de infraestructura en la nube o gestionados por la Oficina de TI en la infraestructura de cómputo local de la entidad.

Esta etapa de implementación tiene un alto nivel técnico, por lo que se recomienda contar con el acompañamiento permanente de la Oficina de TI que asegure la configuración de los servicios y los requerimientos mínimos de la Distribución. Asimismo, es necesario contar con el apoyo de un webmaster con experiencia en desarrollo de sistemas de gestión de contenidos basados en el lenguaje de programación PHP3.

Teniendo en cuenta que actualmente no todas las entidades cuentan con los perfiles técnicos o profesionales para el desarrollo, mantenimiento y soporte de los sitios web institucionales, a continuación se presentarán una serie de recomendaciones y mejores prácticas, con el ánimo de facilitar a los webmasters y responsables web de las entidades del Distrito Capital, la ejecución de operaciones, toma de decisiones y resolución de problemas durante la etapa de implementación de Govimentum, que incluye actividades de alistamiento, configuración de servicios y herramientas, gestión de los ambientes de despliegue, instalación y post-instalación.

3 Circular 23 de 2018: Recomendaciones generales para el perfil del webmaster de las entidades distritales, oficina Alta Consejería Distrital de TIC.

13

Implementación EstabilizaciónMigración

ALISTAMIENTO

El alistamiento de la infraestructura consiste en la asignación de determinada cantidad de recursos de cómputo, almacenamiento y conectividad a través de servidores físicos o virtuales que proveen, a parir del Sistema Operativo, la configuración de los servicios y herramientas de los ambientes de despliegue de Govimentum, asegurando su disponibilidad, seguridad, resiliencia y correcto funcionamiento del sitio web institucional.

Requerimientos mínimos del sistema:

» Memoria Ram >= 2GB: El core de Drupal requiere mínimo 32

MB y este valor aumenta de acuerdo con la cantidad de módulos

instalados (la Distribución CMS actualmente cuenta un total de

188 módulos: 49 pertenecen al Core de Drupal, 23 corresponden

a las características funcionales de Govimentum y el resto, 116

son módulos contribuidos). También se debe tener en cuenta la

carga estimada que recibirá el sitio web y los demás servicios

o procesos activos del sistema, como por ejemplo el servicio

de base de datos, el cual tiene sus propios requerimientos de

memoria.

» Espacio en disco >= 50GB: Una instalación de Drupal Mínima,

requiere 15 MB de espacio en disco, sin embargo, se debe tener

presente el espacio que usa la base de datos y los activos fijos

gestionados por los usuarios como: documentos, imágenes,

videos, audios, etc. En este sentido, una instalación fresca de

Govimentum utiliza 137 MB de espacio en Disco, pero puede

incrementar significativamente de acuerdo con el volumen,

frecuencia y demanda de contenidos que se cargan al sitio web.

14


Recomendaciones:

» Utilizar un Sistema Operativo GNU/Linux con arquitectura de

seguridad SELinux4

» Aplicar configuraciones de endurecimiento del sistema operativo

como: definir reglas de seguridad de la red y cortafuegos,

configurar el acceso remoto vía ssh, configurar la detección

de intrusos e integridad del sistema, asegurar el acceso a los

directorios y archivos, etc. En este sentido, la Oficina de Seguridad

de la Universidad de Austin propone una lista de chequeo5

con pasos críticos para alcanzar una configuración efectiva de

aseguramiento de servidores.

» Utilizar un servidor dedicado para la aplicación y otro dedicado

para la base de datos que permita la distribución de los recursos

de memoria y almacenamiento de Govimentum.

» Separar el manejo de la caché de la base de datos de Govimentum a

través de un backend de almacenamiento llave-valor que optimiza

el uso de la memoria RAM y reduce la carga de operaciones en la

base de datos6

4 “49.2. Introduction to SELinux - Red Hat Customer Portal.” https://access.redhat.com/documentation/en-us/red_hat_enterprise_linux/5/html/deployment_guide/ch-selinux. Revisado 3 Jul. 2018.

5 “Red Hat Enterprise Linux 7 Hardening Checklist | UT Austin ISO.” https://security.utexas.edu/os-hardening-checklist/linux-7. Revisado 3 Jul. 2018.

6 “Installing and Configuring Redis for Drupal 7, and other Memcached ....” https://2bits.com/articles/installing-configuring-redis-drupal-7-other-memcached-alternatives.html. Revisado 5 Jul. 2018.

15


SERVIDOR WEB

De acuerdo con la documentación oficial, Drupal funciona en cualquier servidor web que brinde soporte para el lenguaje PHP7. En este sentido, existen varias opciones de código abierto siendo Apache y nGinx las más populares, por lo tanto, la elección entre una u otra tecnología, depende de las consideraciones de diseño y arquitectura de despliegue que favorezcan el performance y la seguridad del sitio web.

Por lo anterior, ambos proyectos tienen características y opciones de configuración que pueden significar notables diferencias en el manejo de recursos de computo, tiempo de implementación, capacidad de procesamiento y la calidad de servicio web8; por lo tanto, es necesario analizar los escenarios en los cuales estará expuesto el sitio web. Por ejemplo: cantidad de peticiones de usuarios concurrentes, procesamiento de transacciones, demanda de recursos y tiempos de respuesta.

Sin embargo, aunque Apache permite una implementación relativamente rápida del servicio web, puesto que está diseñado para manejar nativamente el procesamiento de PHP; nGinx y el manejador de procesos para PHP: FastCGI, optimizan el consumo de la memoria RAM (Ver Figura 1), favorecen la concurrencia (Ver Figura 2) y manejan eficientemente contenido estático como imágenes, documentos, hojas de estilo y scripts, convirtiéndolo en la opción recomendada para el despliegue de Govimentum.

7 “Web server | Drupal 7 guide on Drupal.org.” 26 Apr. 2017, https://www.drupal.org/docs/7/system-requirements/web-server. Revisado 5 Jul. 2018.

8 “Apache vs Nginx: Discover Which One is Better - Logical IDEA.” 8 Oct. 2017, http://www.logicalidea.xyz/apache-vs-nginx/. Revisado 5 Jul. 2018.

16


Comparación performance Servidor Web9:

Figura 1. Manejo de memoria Apache vs Nginx

Figura 2. Manejo de peticiones concurrentes Apache vs Nginx

9 “Web server performance comparison – DreamHost.” 17 Apr. 2018, https://help.dreamhost.com/hc/en-us/articles/215945987-Web-server-performance-comparison. Revisado 5 Jul. 2018.

17


Recomendaciones:

» Utilizar la configuración recomendada por nGinx para Drupal 710,

la cual implementa reglas de seguridad que restringen el acceso a

archivos no autorizados, ejecución de scripts dentro del directorio

contenedor de archivos gestionados por usuarios, reescritura de

urls y expiración del caché del contenido estático.

» Configurar un nombre de servidor que será utilizado para acceder

a Govimentum desde el navegador web.

# Ejemplo de nombre de servidor para el ambiente de desarrollo local server { server_name dev.govimentum.local ... }

» En los casos que sea requerido cargar archivos muy pesados a

través del sitio web, se debe configurar la regla client_max_body_

size11 en concordancia con la configuración de PHP para el manejo

del tamaño archivos para evitar el error 413 Entity too large.

» Configurar el tiempo de ejecución de acuerdo con los límites

establecidos por la configuración de tiempo de ejecución de PHP.

(Solamente durante el proceso de instalación de Govimentum,

asignar valores altos que permitan completar las peticiones que

exceden el tiempo de procesamiento)

proxy_connect_timeout 300; proxy_send_timeout 300; proxy_read_timeout 300; send_timeout 300;

10 “Drupal | NGINX.” https://www.nginx.com/resources/wiki/start/topics/recipes/drupal/. Revisado 5 Jul. 2018.

11 “Module ngx_http_core_module - Nginx.org.” http://nginx.org/en/docs/http/ngx_http_core_module.html. Revisado 5 Jul. 2018.

18


» Restringir el acceso al archivo CHANGELOG.txt con el fin evitar

la exposición de la última versión aplicada sobre la instalación de

Drupal, el cual puede ser utilizado por atacantes para explotar

posibles vulnerabilidades.

location = /CHANGELOG.txt { return 403; }

19


PHP

Govimentum ha sido desplegado de manera satisfactoria en versiones de PHP 5.3, 5.4, 5.5, 5.6,7.0,7.1 y 7.2, ya que estas son las versiones recomendadas para Drupal 7. Al elegir entre estas versiones es importante utilizar la versión más reciente de la rama 7.x de PHP, es decir la versión 7.1.21 (Versión liberada el 17 de agosto de 2018).

A continuación se relacionan las extensiones requeridas:

php7-mcrypt php7-soap php7-openssl php7-gmp php7-json php7-pdo php7-pdo_mysql php7-pdo_dblib php7-dom php7-zip php7-mysqli php7-bcmath php7-gd php7-gettext php7-xmlreader php7-xmlrpc php7-bz2 php7-tokenizer php7-iconv php7-curl php7-ctype php7-zlib php7-phar php7-xml

php7-sessionphp7 - simplexmlphp7 - mbstring

20


Recomendaciones:

» Existen algunos paquetes preconfigurados con el stack de

aplicaciones para Drupal (Apache, MySQL, PHP) como xampp

para linux, wamp para windows y mamp para OSX. Sin embargo,

aunque estos servicios pueden ser reconfigurados para alcanzar

los criterios de calidad del servicio web de la entidad, no se

recomienda su implementación en servidores de producción, ya

que la configuración con la que se distribuyen, pueden incluir

vulnerabilidades de seguridad.12

» Si se instala PHP en un entorno GNU/Linux se recomienda hacerlo

a través del gestor de paquetes del sistema operativo. En caso que

la última versión de PHP 7.x no esté disponible desde el repositorio

oficial, es necesario configurar un repositorio remoto contribuido

que contenga esta versión. Lo anterior con el fin de tener una

mejor integración de este software con el Sistema Operativo,

permitiendo su mantenimiento y futuras actualizaciones.

Configuración de PHP para el proceso de instalación de Govimentum:

Debido a la alta carga entregada al servidor web durante el proceso de instalación, es muy frecuente encontrar duraciones excesivas en el procesamiento de las peticiones que ocasionan el error 504 “Tiempo de espera de gateway superado”, la aparición de este error puede ser controlada ampliando el valor a las directivas max_execution_time y max_input_time, es decir, dependiendo la configuración del servidor web y la configuración de los límites, puede disminuir la frecuencia con la que se presenta el error.

max_input_time -1 max_execution_time 0

12 “XAMPP FAQs for Windows - Apache Friends.” https://www.apachefriends.org/es/faq_windows.html. Revisado 9 Jul. 2018.

Nota: Este escenario se presenta con la configuración nGinx + php - fpm + php. La instalación de Govimentum con el servidor web Apache no presenta este error, sin embargo, el proceso de instalación tiende a durar más tiempo.

21


Por lo anterior, la configuración del tiempo de ejecución también puede ser definida en el servidor web, asignando valores altos (entre los 5 y 10 minutos) que aseguren el procesamiento completo de las peticiones al servicio. Sin embargo, si no se desea cambiar esta configuración, la ejecución de la petición que ha excedido el tiempo puede ser retomada recargando el navegador web sin afectar el proceso de instalación.

Nota: Las versiones 5.3, 5.4 y 5.5 ya no cuentan con soporte, por lo tanto, no se recomienda su implementación. La versión 5.6 terminará su ciclo de vida el 31 de diciembre de 2018, en este sentido, se recomienda utilizar la última versión disponible de PHP de la rama 7, la cual tiene soporte de seguridad hasta finales del año 2020. Ver: http://php.net/supported-versions.

Asimismo, si la entidad ha realizado modificaciones de Govimentum que incluyen módulos contribuidos, será necesario verificar su compatibilidad con PHP 7.x a fin de realizar las optimizaciones (manuales o contribuidas a través de parches) que aseguren su correcto funcionamiento.

MOTOR DE BASE DE DATOS

El motor de base de datos es indispensable para almacenar contenidos, configuraciones, registros del sistema, la cache de Drupal y esquemas de algunos módulos contribuidos.

Drupal soporta nativamente varios motores como PostgresQL, SQLite y MySQL, por tanto, este último es el servidor de base de datos recomendado por Drupal CMS, y ha sido ampliamente probado a través del fork MariaDB.

22


De acuerdo con la documentación Oficial de Drupal para el motor de base de datos13, las versiones recomendadas son:

» MySQL 5.0.15/MySQL 5.1.30

» MariaDB 5.1.44

» Percona Server 5.1.70 or higher

Recomendaciones:

» Utilizar un servidor dedicado para proveer el servicio de base de

datos, ya que optimiza el uso de memoria RAM en el servidor de

aplicación.

» Crear un usuario de base de datos dedicado para Govimentum

y asignar los privilegios para las operaciones SELECT, INSERT,

UPDATE, DELETE, CREATE, DROP, INDEX, ALTER.

» No es buena práctica utilizar el usuario root para manejar

las operaciones antes mencionadas en la base de datos de

Govimentum.

13 “Database server | Drupal 7 guide on Drupal.org.” 4 Aug. 2016, https://www.drupal.org/docs/7/system-requirements/database-server. Revisado 10 Jul. 2018.

23


AMBIENTES DE DESPLIEGUE DE GOVIMENTUM

Es indispensable contar con múltiples ambientes de despliegue

funcionales de Govimentum en las etapas del proceso de construcción o mantenimiento de software. (Ver post - instalación P.29). Estos ambientes pueden ser: desarrollo, pruebas y producción (Ver Figura 3). Sin embargo, la cantidad de ambientes puede variar dependiendo de los procesos y procedimientos internos de cada entidad, el nivel de control entre cada una de las etapas o los estándares de calidad del proyecto.

Esta arquitectura de despliegue básica puede ser optimizada a través de la automatización de los procesos de integración de la

trabajo ágil que aporte continuamente valor al negocio en forma de nuevas funcionalidades y mejoras en la calidad del sitio web institucional.

Figura 3. Ejemplo de ambientes de despliegue de Govimentum

El ambiente de desarrollo se utiliza para realizar cambios en Govimentum a través de la ejecución de ciclos o iteraciones de trabajo, en las cuales se construyen nuevas funcionalidades o se asegura la calidad de otras. Los desarrolladores deben contar con un ambiente local de desarrollo que les suministre las herramientas necesarias para sus actividades de construcción de software. Asimismo, el ambiente de desarrollo remoto permite

LAN O Cloud Servidor web

24


verificar la integración de los cambios aportados por el equipo de desarrolladores.

El ambiente de pruebas permite la integración y despliegue de las funcionalidades que ya han completado la etapa de desarrollo y requieren ser validadas por un Gestor de Calidad con el fin de asegurar la calidad de Govimentum, detectar defectos en etapas tempranas del proceso y disminuir los errores en producción. Estas pruebas se pueden ejecutar teniendo en cuenta varios enfoques como por ejemplo: pruebas funcionales, pruebas de usabilidad, accesibilidad, pruebas de aceptación, etc.

Finalmente, una vez se han aceptado las funcionalidades y se ha asegurado que cumplen con los criterios de calidad establecidos por el proceso de construcción de software de la entidad, se procede a desplegar los cambios en el ambiente de producción.

Nota: Realizar cambios en la estructura y funcionalidad de Govimentum en el ambiente de producción, aumenta el riesgo de afectar la disponibilidad del sitio web.

AMBIENTES DE DESPLIEGUE BAJO DEMANDA

Al inicio de esta sección se mencionó que el proceso de construcción de software puede tener varias etapas por tanto puede requerir de varios ambientes de despliegue. Este escenario implica tener un control riguroso y detallado de la configuración, asegurando que ésta se replique en todos lo ambientes del proyecto, por lo tanto, estas operaciones repetitivas pueden ser dispendiosas y propensas a errores, limitando la capacidad de la entidad para disponer de ambientes de despliegue bajo demanda, en el menor tiempo posible.

Existen varias soluciones que permiten automatizar la configuración de la infraestructura y de los ambientes de despliegue como: Capistrano, Terraform, Ansible, Docker, entre otras. En este sentido, Docker es un motor de contenedores, que no requiere de la capa de virtualización de las máquinas virtuales

25


(Ver Figura 4), que facilita la creación de múltiples ambientes con los requerimientos mínimos de Govimentum y Drupal a partir de la descripción de la configuración en un archivo de texto.

Diferencias entre contenedores y máquinas virtuales14

Figura 4. Comparación virtualización vs containterización

Docker cuenta con un amplio repositorio15 que permite la descarga y composición de las aplicaciones y servicios de los proyectos oficiales como: nGinx (o Apache), PHP y MySQL (o MariaDB) e imágenes contribuidas por la comunidad de usuarios para la ejecución de aplicaciones de Drupal16 o Govimentum17. Sobre este último, el equipo base del proyecto ha contribuido una herramienta llamada govi_boxes18, que se encuentra en estado beta de

14 “Docker: Containers for the Masses - patg.net.” 5 Jun. 2014, http://patg.net/containers,virtualization,docker/2014/06/05/docker-intro/. Revisado 10 Jul. 2018.

15 “Docker Hub.” https://hub.docker.com/. Revisado 10 Jul. 2018.

16 “library/drupal - Docker Hub.” https://hub.docker.com/_/drupal/. Revisado 10 Jul. 2018.

17 “govi_docker/Dockerfile at master · snaphuman/govi_docker · GitHub.” https://github.com/snaphuman/govi_docker/blob/master/Dockerfile. Revisado 10 Jul. 2018.

18 “GitHub - snaphuman/govi_boxes.” https://github.com/snaphuman/govi_boxes. Revisado 10 Jul. 2018.

26


desarrollo, que provee el ambiente despliegue conformado por los servicios de base de datos, proxy reverso y DNS facilitando la creación de múltiples instancias de Govimentum a través de la línea de comandos. (Ver Figura 5).

Figura 5. Esquema de contenedores para ambientes de despliegue de Govimentum

INSTALACIÓN

Actualmente Govimentum cuenta con dos repositorios en la plataforma de desarrollo colaborativo https://gitlab.com, en donde se aloja el código fuente del proyecto: En primer lugar, govimentum_semilla19 es un repositorio orientado a desarrolladores, el cual tiene la estructura de submódulos de Git con referencia a los repositorios de las características funcionales que conforman la Distribución. En segundo lugar, govimentum_releases20 es un

19 https://gitlab.com/DDCMS_Govimentum/govimentum_semilla

20 https://gitlab.com/DDCMS_Govimentum/govimentum_releases

27


repositorio orientado a usuarios finales, el cual consolida todas las características funcionales y versiones estables del proyecto.

Una vez se cuenta con el ambiente de despliegue de Govimentum, (Ver P.13) este debe ser descargado o clonado con Git en el directorio raíz configurado en el servidor web para procesar archivos PHP; lugares comunes de este directorio son: www, public_html, htdocs, etc; pero puede ser cualquier directorio definido por el administrador de infraestructura.

Luego de que los archivos de la Distribución estén en su lugar, se iniciará el proceso de instalación ingresando la dirección configurada como “nombre de servidor” o “nombre de dominio” a través del navegador web. ej: dev.govimentum.gov.co. (Ver P.17)

El perfil de instalación de Govimentum es un proceso que cuenta con 6 pasos en los cuales se suministra información general del sitio web institucional y se ejecutan tareas automatizadas que configuran las características funcionales de esta Distribución, como se enumera a continuación:

» Paso 1. Configuración de la base de datos.

» Paso 2. Instalación del core de Drupal y módulos del perfil Standard.

» Paso 3. Configuración del sitio.

» Paso 4. Información del sitio web institucional.

» Paso 5. Instalación de dependencias adicionales.

» Paso 6. Instalación de características funcionales de la

Distribución.

Una vez finalizado el proceso de instalación, el webmaster contará con un sitio web listo para usar, dotado de características funcionales que permiten la gestión de banners destacados, noticias, eventos, enlaces de interés, videos y los contenidos del Estándar de Publicación y Divulgación de Información Pública de la Ley de Transparencia y Acceso a la Información Pública.

28


Recomendaciones:

» Tener en cuenta las configuraciones de PHP y del servidor web

para controlar las peticiones que exceden el tiempo de ejecución.

Error 504. (Ver P.20)

» El error 504 se presenta generalmente durante la Instalación de

características funcionales de la Distribución en el Paso 6. En caso

de presentarse no es necesario reiniciar el proceso de instalación,

si no, recargar el navegador web será suficiente para retomar el

proceso desde la anterior petición satisfactoria registrada.

» En el Paso 3. se puede seleccionar la opción para “Instalar

Contenido de Ejemplo de Govimentum”. Si bien este contenido

permite al webmaster navegar por las secciones del sitio web

y explorar sus funcionalidades, no se recomienda utilizar este

contenido de ejemplo como base para la implementación del sitio

web institucional ya que podría afectar el posicionamiento y la

calidad de los contenidos.

» Instalar el “Contenido de Ejemplo” puede generar peticiones que

exceden el tiempo de ejecución y requieren ampliar los límites

en la configuración del ambiente de despliegue, por lo tanto se

recomienda habilitar esta opción en ambientes de desarrollo o de

pruebas y no en producción.

29


POST - INSTALACIÓN

Durante esta etapa el webmaster ya cuenta con un sitio web institucional listo para ser utilizado e iniciar el proceso de migración o carga de contenidos en la secciones predeterminadas de Govimentum, sin embargo, regularmente las entidades tienen otros requerimientos específicos que deben ser implementados antes de realizar la migración.

Por lo tanto, el proceso de implementación de Govimentum debe ser considerado por la entidad, como un proceso de ingeniería de software21 que debe cumplir con varios criterios técnicos y metodológicos que aseguren operatividad, calidad y la sostenibilidad de la plataforma en el tiempo, con el fin de brindar un servicio web de calidad a la ciudadanía.

Govimentum, al ser un proyecto de código abierto permite a los webmasters modificar y escalar su funcionalidad de diversas maneras, por tanto, con el fin de realizar modificaciones o nuevas funcionalidades que generen productos de alta calidad que aportan valor al negocio, es indispensable adoptar un proceso de construcción de software o metodología de trabajo, cuyo enfoque sea alcanzar los objetivos de gestión de la información de la entidad de una manera organizada, involucrando a todas las dependencias e interesados del proyecto.

Por lo anterior, existen varios marcos de trabajo o metodologías para la gestión de proyectos de software que se han desarrollado a partir de la experiencia de cientos de miles de proyectos, unos exitosos y otros grandes fracasos, a partir de los cuales se ha conformado una base de conocimiento con recomendaciones y mejores prácticas, las cuales han sido apropiadas, consolidadas y documentadas por organizaciones, empresas, grupos de trabajo, universidades y gobiernos como son, por ejemplo: Project Management Institute (PMI), Rational Unified Process (RUP), Scrum, Extreme Programming (XP), Team Software Process (TSP) entre otros.

21 “Ingeniería de software - Wikipedia, la enciclopedia libre.” https://es.wikipedia.org/wiki/Ingenier%C3%ADa_de_software. Revisado 11 Jul. 2018.

30


Este documento no pretende recomendar una metodología o marco de trabajo, ya que todos los proyectos son diferentes y buscan alcanzar objetivos particulares para cada entidad. Las metodologías deben adaptarse al contexto22 23 de la organización y a las restricciones del proyecto. Un ejemplo de esta adaptación es dinamizar actividades ágiles para el mapeo de historias de usuario y consolidar el backlog del producto del marco de trabajo Scrum como parte de las actividades de recopilación de requisitos del Grupo de Procesos de Planificación del área de conocimiento “Gestión del Alcance del Proyecto” del PMI.

En resumen, la entidad debe disponer de los recursos, el talento humano y base de conocimiento necesarios para que la implementación del sitio web institucional con Govimentum se realice siguiendo un proceso sistemático, disciplinado, y organizado que asegure la calidad del producto, genere valor agregado y logre la satisfacción del ciudadano.

22 Un ejemplo es el contexto normativo que obliga a las Entidades del Distrito a cumplir con la Ley de Transparencia y Acceso a la Información Pública, por lo tanto, deben implementar, entre otras reglamentaciones, el Estándar de Publicación y Divulgación de Información Pública.

23 Algunas Entidades han documentado procedimientos internos para la construcción y mantenimiento de aplicaciones de software, por lo tanto, el proyecto debe gestionarse en el marco de esta pauta metodológica.

31


GESTIÓN DE GOVIMENTUM A TRAVÉS DE LA LÍNEA DE COMANDOS DRUSH

Drush (Drupal Shell)24 es una herramienta de código abierto que permite la gestión del sitio web a través de la línea de comandos, por lo tanto hace de este proceso un trabajo ágil y eficiente altamente recomendado para los webmasters del Distrito Capital.

A continuación se presentan algunos comandos de uso frecuente:

# lista completa de los módulos del sitio drush pm-list # descarga el módulo contribuido module_filter drush dl module_filter # descargar el módulo (si no existe en el sistema de archi-vos de Drupal) y habilita el módulo contribuido path_brea-dcrumb drush en path_breadcrumb # limpiar todas las caches del sitio drush cc all # realizar un respaldo de los arcvhivos y base de datos del sitio web drush archive-backup --destination=/home/respaldos/respaldo1.tar.gz # restaurar un respaldo drush archive-restore /home/respaldos/respaldo1.tar.gz --destination /public_html/www# eliminar las tablas de la base de datos del sitio drush sql-drop

La lista con todos los comandos y su modo de empleo puede ser consultada en: https://drushcommands.com/

24 “Drush.” https://www.drush.org/. Revisado 11 Jul. 2018.

32


CONTROL DE CAMBIOS

Como se ha mencionado anteriormente, Govimentum cuenta con dos repositorios de Git principales y múltiples repositorios de las características funcionales de la Distribución gestionados a través de la herramienta de control de cambios Git.25 Todos los repositorios están alojados en el grupo de la Distribución Distrital CMS en Gitlab.com en https://gitlab.com/DDCMS_Govimentum (Ver p.26)

Realizar control de cambios al código fuente es indispensable durante el proceso de construcción de software, ya que este permite mantener un historial de los cambios realizados al proyecto, recuperar o revertir versiones anteriores, y publicar los cambios en un repositorio remoto en el cual otros desarrolladores pueden contribuir al proyecto, entre otras funcionalidades26.

Esta sección no va a profundizar sobre el uso de esta herramienta, pero si quiere invitar a los webmasters distritales a gestionar el código fuente de Govimentum con Git, a apropiar las operaciones básicas de esta forma contribuir a este proyecto.

25 “Git.” https://git-scm.com/. Revisado 11 Jul. 2018.

26 “Git - Reference.” https://git-scm.com/docs. Revisado 11 Jul. 2018.

34


Una vez se ha finalizado la implementación de nuevas funcionalidades y se han alcanzado los criterios de calidad establecidos por la gestión del proyecto, es viable iniciar la etapa de migración que consiste en cargar automática o manualmente los contenidos de la entidad en las diferentes secciones del sitio web institucional.

Este documento se enfocará principalmente en la estructura de la sección de transparencia de Govimentum, ya que esta es la de mayor preponderancia en el sitio web institucional, puesto que está sujeta a la verificación por parte de auditores externos frente a su cumplimiento con respecto a la norma.

Técnicamente las características funcionales de Govimentum (ver Tabla 1) implementan la configuración de los componentes estructurales de Drupal como: tipos de contenidos, vistas, campos, menús, taxonomías, etc., las cuales se empaquetan y distribuyen como módulos de la Distribución, es decir, pueden ser instaladas, desinstaladas, deshabilitadas, actualizadas, sobreescritas y revertidas.

La lista de características funcionales de la sección de transparencia de Govientum es la siguiente:

35


Nombre URL Repositorio

govi_control https://gitlab.com/DDCMS_

Govimentum/govi_control

govi_contratacion https://gitlab.com/DDCMS_

Govimentum/govi_contratacion

govi_presupuesto https://gitlab.com/DDCMS_

Govimentum/govi_presupuesto

govi_planeacion https://gitlab.com/DDCMS_

Govimentum/govi_planeacion

govi_normatividad https://gitlab.com/DDCMS_

Govimentum/govi_normatividad

govi_informacion_interes https://gitlab.com/DDCMS_

Govimentum/govi_informacion_interes

govi_informacion_institucional

https://gitlab.com/DDCMS_

Govimentum/govi_informacion_

institucional

govi_instrumentos_gestion_info


Govimentum/govi_instrumentos_

gestion_info

govi_mecanismos_contacto


Govimentum/govi_mecanismos_

contacto

govi_tramites_servicios https://gitlab.com/DDCMS_

Govimentum/tramites_servicios

Tabla 1. lista de características funcionales de la sección de transparencia de Govientum

36


La principal recomendación sobre el manejo de las características funcionales de transparencia de Govimentum, es optar por mantenerlas en su estado predeterminado y no sobreescritas (cambios en los componentes de la característica funcional realizados despuès de la instalación del sitio web) ya que las actualizaciones que contribuye el equipo base a través del sistema de actualizaciones de Drupal, pueden afectar los cambios realizados por el webmaster. Por esta razón, las actualizaciones deben realizarse en un ambiente alterno al ambiente de producción para no afectar la funcionalidad del sitio web institucional y en lo posible verificar los cambios que se están aplicando a través de la herramienta de control de cambios.

Otro aspecto a tener en cuenta una vez se haya cargado contenido al sitio web institucional, es no eliminar campos de la estructura de tipos de contenidos existente ya que pueden ocasionar pérdida de información, por lo tanto, es conveniente manejar esta situación agregando un nuevo campo que cumpla con el requerimiento, al cual posteriormente se le pueden aplicar operaciones por lotes que migren la información de un campo al otro.

DEFINICIÓN Y ASIGNACIÓN DE ROLES DE USUARIO

Drupal cuenta con una sección que permite la configuración de roles, permisos y usuarios27 del sitio web institucional. Por lo tanto, la estructura de tipos de contenido que actualmente tiene Govimentum permite la asignación de permisos a las operaciones de creación, actualización y eliminación de contenidos en determinados nodos.

En términos generales cada bloque temático de transparencia puede tener un rol de usuario que pertenece a alguna de las dependencias de la entidad. Como se presenta en la siguiente tabla:

27 “User Roles | Drupal 7 guide on Drupal.org.” 14 Mar. 2018, https://www.drupal.org/docs/7/managing-users/user-roles. Revisado 11 Jul. 2018.

37


Roles Permisos Nodos

webmaster » Crear nuevo contenido

» Editar contenido propio

» Editar cualquier contenido

» Eliminar contenido propio

» Eliminar cualquier

contenido

Todos

gestor de

contratación

» Crear nuevo contenido



Contratación,

Directorio de

Funcionarios

gestor de

presupuesto




Presupuesto

gestor de control

interno




Control interno

gestor de talento

humano




Directorio de

Funcionarios

gestor de

planeación




Planeación,

Instrumentos

de gestión de la

información,

Normatividad,

Trámites y servicios,

Información de

interés

gestor de trámites

y servicios




Trámites y servicios

38


gestor de gestión

documental




Instrumentos

de gestión de

la información,

Normatividad,

Información

de interés

gestor jurídico » Crear nuevo contenido



Normatividad,

gestor de atención

al ciudadano




Mecanismos de

contacto, Trámites

y servicios

De esta forma el webmaster podrá distribuir la carga de la gestión de contenidos de los bloques temáticos de la sección de Transparencia y Acceso a la Información Pública a cada una de las dependencia de la entidad, responsables del manejo de la información de presupuesto, control, planeación, mecanismos de contacto, normatividad, etc. Por tanto, el sitio web institucional tendrá la capacidad de responder ágilmente a las necesidades de publicación de información de interés para la ciudadanía.

Por lo anterior se recomienda realizar actividades de capacitación o actualización que permitan a los responsables web de la entidad cargar contenidos al sitio web institucional. En este sentido, es indispensable que la entidad cuenta además, con un protocolo para la publicación de información que defina responsables, relaciones entre fuentes de información, alcances, niveles de acceso, mejores prácticas y forma del lenguaje, asegurando la calidad en esta materia.

40


La fase de estabilización corresponde a la adaptación completa de la plantilla o tema base a la entidad, con su consecuente modo de apropiación, carga constante de contenidos y administración general del sitio Web. En este sentido en esta etapa, el flujo de publicación se ha estandarizado y se realizan cargas constantes sobre la base ya construida, por lo que se hace necesario empezar a implementar lineamientos de usabilidad y accesibilidad para que los ciudadanos encuentren un portal comprensible, perceptible y operable que les permita acceder a la información que requieren.

¿QUÉ ES ACCESIBILIDAD WEB?

La accesibilidad se define según Convención sobre los derechos de las personas con discapacidad como un factor transversal que permite a las personas con discapacidad, vivir de forma independiente y participar plenamente en todos los aspectos de la vida. Para el caso de accesibilidad web, ésta implica hablar de un acceso universal a la Web, en donde se deben poder utilizar los sitios con la misma efectividad, seguridad y protección, independientemente del tipo de hardware, software, idioma, cultura o capacidades de los usuarios.

¿POR QUÉ ES IMPORTANTE?

El Estado Colombiano, tiene como objetivo ser garante tanto del goce efectivo de los derechos de los ciudadanos así como de los deberes de los mismos. Esto implica que en este marco, como parte de un articulado de derechos, el derecho a la información y al acceso al conocimiento constituye una de las vías de entrada para que las personas puedan vivir en forma independiente y participar en la vida ciudadana.

Por lo anterior, trabajar en la garantía para que el contenido de la web sea accesible, beneficia a todas las personas no sólo aquellas consideradas con discapacidad. Así, un sitio web accesible, posiciona al usuario en el centro de la experiencia, proporcionando textos más comprensibles, contenidos bien organizados con un diseño claro y

41


simple, permitiendo que toda la población pueda percibir, entender, navegar, interactuar y contribuir con los sitios web.

Construir un sitio web con estos principios implica que el Estado pueda transmitir de forma clara y efectiva la información sobre programas, trámites y servicios a todos los ciudadanos. Se espera que para que los ciudadanos puedan ejercer con efectividad sus derechos y deberes, deban entender la información que el Estado les proporciona, de lo contrario cuando no hay acceso, se impide más allá́ de la consecución de un trámite o servicio, el ejercicio de un derecho.

MARCO NORMATIVO

Es importante recalcar que la garantía del derecho a la información y al acceso al conocimiento está delimitado también por un marco legal normativo que establece las disposiciones para garantizar el pleno ejercicio de los derechos de las personas con discapacidad, así como define los lineamientos institucionales para llevar a cabo esta tarea.

Ley 1346 de 2009 - Por medio de la cual se aprueba la Convención sobre los Derechos de las Personas con Discapacidad y en el que en su Artículo 9 - Accesibilidad, habla de que los servicios de información, comunicaciones y de otro tipo, incluidos los servicios electrónicos y de emergencia deberán ser accesibles.

Ley Estatutaria 1618 de 2013 - Por medio de la cual se establecen las disposiciones para garantizar el pleno ejercicio de los derechos de las personas con discapacidad en el que en su Artículo 16 - habla sobre el derecho a la información y comunicaciones.

Ley 1680 de 2013 - Por la cual se garantiza a las personas ciegas y con baja visión, el acceso a la información, a las comunicaciones, al conocimiento y a las tecnologías de la información y de las comunicaciones.

Decreto 2573 de 2014 - Por el cual se establecen los lineamientos generales de la Estrategia de Gobierno en línea.

42


Ley 1712 de 2014 - Por medio de la cual se crea la Ley de Transparencia y del Derecho de Acceso a la Información Pública Nacional – Reglamentación: Decreto 103 de 2015 y Res. 3564 de 2015.

Ahora, para responder a estas disposiciones legales también se establece en Colombia la Norma Técnica Colombiana (NTC) 5854, basada en las WCAG 2.0 - Pautas de Accesibilidad para el Contenido Web (Web Content Accessibility Guidelines) qué son las directrices desarrolladas por la W3C (World Wide Web Consortium), organismo internacional que tiene como objetivo el diseño y el desarrollo de soluciones accesibles de sitios Web.

La NTC 5854 tiene como objeto, promover que el contenido de la web sea accesible a personas con discapacidades visuales, auditivas, físicas, de habla, cognitivas, de lenguaje, de aprendizaje o neurológicas estableciendo cada una de las pautas y criterios a aplicar para lograr que los contenidos publicados en la Web sean accesibles.

PRINCIPIOS

Las directrices y criterios por los cuales se determina la accesibilidad de un sitio web, están organizados en torno a cuatro principios que sientan las bases necesarias para que cualquiera pueda acceder y usar el contenido web. En este sentido, los usuarios que quieran hacer uso de un sitio web deben tener acceso a un contenido que sea:

Perceptible: La información y los componentes de la interfaz de usuario deben ser presentados a los usuarios de modo que ellos puedan percibirlos. Esto significa que los usuarios deben ser capaces de percibir la información que se presenta y que no puede ser invisible para todos sus sentidos.

Operable: Los componentes de la interfaz de usuario y la navegación deben ser operables. Esto significa que los usuarios deben poder operar la interfaz y que esta no puede requerir interacción que un usuario no puede realizar.

43


Comprensible: La información y el manejo de la interfaz del usuario, deben ser comprensibles. Esto significa que los usuarios deben ser capaces de entender la información y el funcionamiento de la interfaz de usuario, a través de un contenido u operación que no puede estar más allá de su comprensión.

Robusto: El contenido debe ser suficientemente robusto como para ser interpretado de forma fiable por una amplia variedad de aplicaciones de usuario, incluyendo las ayudas técnicas. Esto significa que los usuarios deben poder acceder al contenido a medida que las tecnologías avanzan y los agentes de usuario evolucionan.

CATEGORÍAS

A fin de poner a disposición del público la información contenida en los portales distritales a través del uso de Govimentum y respondiendo al marco legal y normativo, esta guía de buenas prácticas de manejo de contenido en la estabilización, plantea tres principales ejes de trabajo alineadas con las directrices establecidas para crear sitios web accesibles: el contenido, la navegación y el diseño.

El eje de contenido propone pautas para garantizar que el objetivo y las tareas dentro del sitio sean comprendidas, es decir, que se tenga una idea clara de lo que se está comunicando o lo que se está requiriendo por parte de la página. Por esto, esta categoría se aborda en términos de legibilidad tanto en textos como en enlaces, jerarquías y presentación del contenido (tablas, listas y elementos multimedia).

El eje de navegación plantea pautas específicamente para garantizar que el sitio web sea operable, lo que supone que las acciones requeridas al usuario por el sitio Web puedan ser llevadas a cabo. Esta categoría proyecta por un lado la estructuración del sitio de manera consistente, con menú o mapa del sitio y evitando bloques de contenido, y por otra parte, una navegación por teclado con retroalimentación a través de un foco.

44


Por último el eje de diseño propone pautas para que el desarrollo del sitio Web provea múltiples vías de comunicación de la información para que éstas sean percibidas a través de diferentes sentidos, capacidades o funcionamientos. Por ello se plantean parámetros para el color, para el uso de medios alternativos de comunicación, control para los elementos no textuales (imágenes, animaciones) y para los elementos que requieren entrada de datos asistida (formularios).

46


LENGUAJE CLARO

Nivel AAA - 3.3.1.3 Palabras inusualesNivel AAA - 3.3.1.4 Abreviaturas

Algunos usuarios de sitios web presentan dificultad para comprender e interpretar textos altamente técnicos. Si el lenguaje es complejo, contiene palabras o frases poco usuales, o presenta abreviaturas, los lectores eventualmente terminan desistiendo de continuar navegando en el sitio al encontrar dificultades para entender la información.

47


Contenido

Al escribir de manera organizada, simple y clara, con palabras que sean entendidas por la mayor audiencia posible, con un lenguaje menos formal que los normalmente utilizados dentro de los documentos institucionales, se garantiza que el mensaje a comunicar llegue a una mayor cantidad de personas. Adicionalmente si debido al contexto del texto, es necesario hacer uso de palabras inusuales, se deben brindar herramientas como los tooltips o botones de ayuda, para dar una descripción ampliada de los términos, garantizando que el mensaje comunicado tenga más posibilidades de ser entendido correctamente sin lugar a errores de interpretación.

Por último, cuando se utilicen abreviaturas, es útil proporcionar un mecanismo para identificarlas de forma expandida, o el significado de la misma debería ser definido cuando es presentado por primera vez. Así, se puede evitar que las abreviaturas sean malinterpretadas debido a su contexto o a que algunos acrónimos pueden sonar como palabras comunes. (Ej. SMIL y “smile”)

En general este tipo de estrategias, mantener oraciones y párrafos cortos, favorecer la voz activa y evitar el uso de jerga o frases idiomáticas, le dará a las palabras contexto y significado más claro para que el mensaje sea entendido y asimilado de una manera más eficaz.

APLICACIÓN EN GOVIMENTUM:

De ser necesario proporcionar mecanismos para identificar el significado de abreviaturas o palabras inusuales, los tooltips pueden ser implementados al agregar un vínculo a la palabra. Las propiedades de este vínculo serían:

» Información de vínculo> Tipo de vínculo > Referencia

en este página

» Avanzado>Título o Advisory Title

48


ENLACES (CONTEXTO)

Nivel A - 3.2.4.4 Propósito de los enlaces (en contexto)

Los usuarios de lectores de pantalla28 a menudo revisan la lista de enlaces en una página antes de tomarse el tiempo para escuchar todo el contenido. Esto equivale a escanear visualmente una página para obtener una visión general de su contenido y las opciones disponibles. Sin embargo, es frecuente encontrar vínculos con textos tipo “clic aquí” o “descargue aquí” o con nombres altamente genéricos como “formulario” que pueden ser confusos para los usuarios que encontrarán dos enlaces nombrados iguales con diferentes destinos. Por ello es importante proporcionar títulos a los enlace que no requieran que el usuario lea la información circundante para entender el objetivo del mismo.

28 Los lectores de pantalla son software que permiten a las personas con baja visión o completamente ciegas, el uso del sistema operativo y de las distintas aplicaciones mediante el empleo de un sintetizador de voz que lee y describe según el código, lo que se visualiza en la pantalla.

49


Contenido

El propósito de cada enlace debe ser especificado solo con el texto del enlace o a través del texto del enlace sumado al contexto en el que se describe. Ser claros en el titulado de los vínculos --incluyendo datos de formato, tamaño y lenguaje-- garantiza que las personas podrán deducir con facilidad la utilidad del vínculo y por tanto utilizar el sitio de mejor manera.


Cuando en el cuerpo o copete de la publicación se va a enlazar una URL tanto interna como externa, es importante que el texto al cual se le va a insertar el vínculo sea lo suficientemente descriptivo para dar claridad sobre el propósito del mismo. Adicional cuando se vaya adjuntar un archivo a cualquier tipo de contenido, es importante nombrar el mismo con la mayor cantidad posible de información y utilizar los campos de descripción en la caja de información del archivo, para especificar el objetivo del documento. Se debe recordar además que este campo se usa como etiqueta del enlace al archivo.

JERARQUÍAS EN EL CONTENIDO

Nivel AA - 3.2.4.2 Titulado de páginasNivel AA - 3.2.4.6 Encabezados y etiquetasNivel AAA - 3.2.4.10 Encabezados de sección

Categorizar la información de forma adecuada facilita el escaneo visual de la información. Los grandes bloques de información no dan una lectura amigable al usuario, por lo que idealmente deben dividirse en secciones más pequeñas. Por ello, se deben definir todos los títulos y subtítulos, y la jerarquía entre las etiquetas del encabezado, debe ser consistente con la jerarquía del contenido.

Además esta jerarquización, debe estar alineada con la presentación alternativa del contenido --que es estructurada por código para ser utilizada por el lector de pantalla-- de forma tal que preserve

50


al mismo tiempo el orden de lectura necesario para comprender el significado. Es importante que sea posible determinar mediante programación, al menos una secuencia del contenido que tenga sentido cuando es usada a través de un lector de pantalla.

Cuando se segmenta la información en secciones y subsecciones, los usuarios de lectores de pantalla escanean la página de forma más eficaz, pues pueden hacer un barrido entre títulos y subtítulos, que les permite hojear la información rápidamente. Esta estrategia le comunica a los usuarios la estructura del sitio (tanto a los usuarios de lectores de pantalla como los usuarios regulares), por lo que es fundamental usar los elementos de encabezado para transmitir la estructura de la página. Por esto, es importante dividir los grandes bloques de información en grupos más manejables y apropiados.

51


Contenido


Tanto en el inicio como en los cuerpos de las publicaciones es necesario definir, a través del la opción Fuente HTML, los niveles de encabezado a través de las etiquetas <h1> <h2> <h3>..., de forma tal que se estructure la información de una forma coherente. Para que esta segmentación sea reconocida por los software lectores de pantalla, es necesario activar la opción <<full HTML>> para que lea correctamente la jerarquía.

TABLAS

Nivel A - 3.1.3.1 Información y relacionesNivel A - 3.1.3.2 Secuencia significativaNivel AA - 3.2.4.6 Encabezados y etiquetas

Las tablas de datos sirven para mostrar información relacionada entre los elementos que la componen estando estos estructurados en filas y columnas. Dicha relación es fácilmente comprensible en forma visual, pero no es el mismo caso para aquellos usuarios de lectores de pantalla, por esto las tablas constituyen un entorno complejo para usuarios ciegos o con discapacidad visual porque no pueden visualizarlo globalmente, lo que les permitiría comprender su estructura más fácilmente. De ahí que a la hora de construir una tabla de datos se deben identificar adecuadamente las celdas de cada fila y columna, así como sus encabezados.

52


Agregar un marcado que guiará a los usuarios del lector de pantalla en la navegación de la tabla es necesario, pues así es posible identificar los encabezados de fila y columna para ofrecer un flujo lógico de navegación. Las etiquetas permiten que un lector de pantalla lea la información en un orden coherente. Para las tablas de datos que tienen varios niveles de encabezados de fila o columna, la marcación se debe usar para asociar celdas de datos y celdas de encabezado. Igualmente, es importante escribir un párrafo introductorio para la tabla, que comunique el propósito y las variables presentadas dentro de la misma.


En los cuerpos de las publicaciones en donde se haga uso de tablas a través de la opción Fuente HTML, es necesario definir estas celdas como encabezados a través del etiquetado <th> de forma tal que el usuario de lector de pantalla los pueda reconocer como los títulos de cada columna.

53


Contenido

LISTAS

Nivel A - 3.1.3.2 Secuencia significativa

Las listas constituyen agrupaciones de elementos relacionados entre sí que facilitan la comprensión del contenido. Las listas son importantes para hacer que los sitios web sean accesibles, ya que dan un orden lógico al contenido. El principal problema de las listas es que los usuarios de lectores de pantalla pueden encontrarse perdidos en su estructura, especialmente cuando en listas anidadas no se especifica el nivel de anidamiento para cada ítem de la lista.

Proporcionar una etiqueta de texto antes o después de la frase del ítem de la lista, asegura que los usuarios comprenden las diferencias entre los ítems de la lista indicados visualmente. Hacer uso de numeración también proporciona un marco de referencia para entender la secuencia significativa del sitio, por lo que utilizar

54


listas numeradas con números compuestos es informativo (1, 1.1, 1.2, 1.2.1, 1.3, 2, 2.1, …) pues proporciona más contexto que la misma lista con números simples.


En los cuerpos de las publicaciones en donde se haga uso de listas para transmitir la información, es necesario a través de la opción Fuente HTML definir este atributo con el etiquetado <ul> (lista no ordenada) o <ol> (lista ordenada) seguido por <li> para cada elemento.

MULTIMEDIA

Nivel A - 3.1.2.1 Solo audio y solo vídeo (grabado)Nivel A - 3.1.2.2 Subtítulos (grabados)

Para la mayoría de los visitantes de un sitio web, el video y el audio brindan una experiencia inmediata de información a través de imágenes, movimiento y sonido. No obstante, esta experiencia es limitada para otro tipo de poblaciones con discapacidad visual y auditiva que requieren medios alternativos para acceder a la misma información. Entonces, para hacer que el contenido multimedia sea accesible, se debe proporcionar una transcripción de texto simple o una descripción en audio.

55


Contenido

Proveer una descripción auditiva del contenido del video cuando éste carece de sonido o el audio no proporciona una información detallada de lo que se está presentando, garantiza el acceso de la información para personas con discapacidad visual . Esta descripción buscar suplir o aumentar la porción de audio al mostrar diálogos, acciones, personajes, cambios de escena y texto en pantalla que son importantes, pero que no son detallados o hablados en la pista principal.

Ahora, otra estrategia para los medios audiovisuales es proveer toda la información en dos tipos de texto: como un subtitulado o como una transcripción. Para el caso del subtitulado de videos se garantiza el acceso a la información a las personas con discapacidad auditiva con capacidad bilingüe (Lengua de Señas Colombiana LSC y español), mientras que las transcripciones se articulan con el uso de software de lectura de pantalla en donde las descripciones proveen la información visual o diálogos presentes. Además estas transcripciones no solo permiten la accesibilidad, sino que también aumentan la capacidad de búsqueda, de los motores de búsqueda.

56



Cuando se publique contenidos en video, se debe diligenciar tanto la descripción --que da un contexto general del video-- como la transcripción con toda la información que se muestra tanto visualmente como oralmente.

58


CONSISTENCIA

Nivel AA - 3.3.2.3 Navegación coherente Nivel AA - 3.3.2.4 Identificación coherente

Nivel AAA - 3.2.4.8 Ubicación Los mecanismos de navegación deben presentarse en un orden uniforme, ordenado, lógico y consistente, tanto visual como estructuralmente para evitar confusión o desorientación al usuario. Estos mecanismos tienen como función dirigir al usuario a las secciones clave y/o páginas del sitio, por lo que éstos deberían estar diseñados para indicar claramente sus destinos e indicar la posición actual del usuario.

59


Navegación

Establecer una presentación visual consistente página a página, donde se mantenga un orden secuencial constante y que la ubicación de los controles de navegación mantenga la misma posición relativa, garantiza que los usuarios puedan familiarizarse con la navegación, pues los ayuda a predecir dónde pueden encontrar los elementos en cada página y les proporciona una transición fluida permitiéndoles navegar de manera fácil y rápida.

Los sitios con arquitectura compleja, pueden beneficiarse de la miga de pan(breadcrumb), qué es el elemento que aparece horizontalmente en la parte superior de una página web, generalmente debajo de las barras de título o encabezados. Éste le proporciona un enlace a cada página anterior que el usuario navegó para acceder a la página actual, lo que funciona como una ruta de navegación que muestra un recorrido para que el usuario regrese al punto de inicio / entrada de un sitio web y le da en paralelo una indicación de dónde se encuentran en el sitio. Este tipo de elemento además de proveer una ubicación al usuario, es el mecanismo por el cual los usuarios de lectores de pantalla pueden rápidamente navegar entre un sitio y que les permite explorar páginas a profundidad.


Si bien todos los componentes del sitio pueden ser modificados --específicamente en términos de diseño-- se recomienda mantener la posición relativa en todas páginas de los elementos como el encabezado, el pie de página, el buscador y en general todos los elementos que corresponden a los estándares de imagen predefinidos por la Alcaldía Mayor de Bogotá. Esto, especialmente para ceñirse tanto a la política institucional como para garantizar consistencia en la navegación por el sitio Web.

60


MENÚ Y MAPAS DEL SITIO

Nivel AA - 3.2.4.5 Vías múltiples

La estructura de un sitio web debe ser lógica y simple, y debe proveer una forma de navegar entre las secciones clave y las páginas del mismo a través de un menú o mapa del sitio. De no existir este tipo de elementos, la navegación sólo puede hacerse de forma lineal e implica que a medida que se profundiza en el sitio se invisibiliza las otras secciones posibles dentro de la navegación.

Proveer un menú perceptible y operable tanto visual como en teclado, y compatible con los software lectores de pantalla, garantiza una mejor navegación y una comprensión global del sitio al proporcionar una descripción general de la estructura y el contenido. Así, proporcionar un menú o mapa del sitio le permite al usuario hacer un barrido a través de las secciones clave del sitio sin tener que navegar a través de cada página individual.

61


Navegación

Específicamente los usuarios lectores de pantalla pueden escanear el mapa del sitio, dando al usuario una idea general de los contenidos para que puedan determinar rápidamente la ubicación de la información deseada e ir directamente a esa página.


Govimentum brinda tres niveles de navegación que en lo posible no deben ser modificados puesto que permiten navegar de lo general a lo particular dentro del sitio Web, garantizando a su vez cumplir con los lineamientos de publicación y divulgación de información pública.

El contenido adicional que cada institución requiera, debe procurar tener una claridad en la forma que estructura la información y por ende la navegación del usuario. Por ello se recomienda una arquitectura de la información clara e intuitiva, por ejemplo, un esquema general sería: Animales>Mamíferos>Perros, que para el caso de las instituciones podría aplicarse como Gestión Institucional> Planeación> Plan de gasto público

EVITAR BLOQUES

Nivel A - 3.2.4.1 Evitar bloques

En los sitios web se suelen encontrar bloques de contenido que se repiten en diferentes páginas, como puede ser una sección de enlaces, tablas de contenidos o una imagen común a todas las páginas. Esto alarga o dilata los tiempos de consulta puesto que los usuarios de lectores de pantalla tienen que escuchar esto una y otra vez en cada página, para llegar a acceder al contenido principal del sitio web de forma rápida y sencilla.

62


Si se brinda un mecanismo para evitar que los bloques de contenido se repitan en múltiples páginas web, se permite a los usuarios acceder al contenido de forma más rápida y sencilla. Por ello, es importante crear enlaces invisibles (es decir, solo utilizados con un lector de pantalla) al comienzo de la página que salten al contenido principal, definir teclas de acceso rápido o estructurar la información de forma tal, que no permanezcan bloques contenido en la parte izquierda o superior al contenido principal que pueda impedir el acceso directo a la información principal, teniendo en cuenta que los lectores de pantalla tienen una secuencia de lectura de izquierda a derecha y de arriba a abajo.

63


Navegación

TECLADO Y FOCO

Nivel A - 3.2.1.1 TecladoNivel A - 3.2.1.2 Sin trampas para el foco del tecladoNivel A - 3.2.4.3 Orden del focoNivel AA - 3.2.4.7 Foco visible

Como un principio de operabilidad se establece la pauta de que toda funcionalidad dentro del sitio debe estar disponible a través de una interfaz de teclado, pues proporciona una alternativa para que los usuarios con o sin discapacidad puedan navegar, localizar contenido y determinar dónde se encuentran. Además esta interfaz debe estar acompañada de una retroalimentación constante, en donde el indicador del foco del teclado resulte visible para el usuario o de lo contrario su ausencia puede convertirse en un obstáculo para la correcta navegación del sitio.

64


Proveer un indicador del foco visible, que además funcione secuencialmente con un orden lógico con el propósito del sitio, permite a los usuarios operar y dar un seguimiento a la navegación por el teclado, pues les deja determinar visualmente el componente en el que las operaciones del teclado están interactuando en cualquier punto en el tiempo.

66


COLOR

Nivel A - 3.1.4.1 Uso del colorNivel AA - 3.1.4.3 Contraste (mínimo)

En relación con el uso del color y la forma en cómo es percibido se encuentran dos principales pautas en términos de accesibilidad: el contraste y la transmisión de la información. Esto, porque muchas personas carecen de sensibilidad al contraste o no perciben colores de forma adecuada, lo que les impide diferenciar entre lo elementos que se le presentan y los enfrentaría a una posible pérdida de información o dificultaría su navegación.

67


Diseño

Proporcionar diversas combinaciones de colores con una relación de contraste de luminancia entre el texto y el fondo superior a 4.5:129 (Nivel de conformidad AA), puede hacer que el texto sea más legible, incluso si la persona no ve toda la gama de colores.

Por otra parte es importante no usar el color como único medio visual para transmitir la información, indicar una acción, solicitar una respuesta o distinguir un elemento visual, puesto que algunos usuarios no pueden diferenciar entre los elementos que se distinguen entre sí por el color

En este sentido es importante dar información clave que complemente el color. Por ejemplo:

1. Complementar la instrucción de acción-color con texto “De clic en

el botón verde para continuar y clic en el botón rojo para cancelar

el proceso de registro”.

CANCELAR CONTINUAR

2. Evitar instrucciones de campos exclusivamente con información

de color “Todos los campos marcados en rojo son obligatorios”. En

cambio, usar otras pistas visuales: “Todos los campos marcados

con * son obligatorios”.

3. No confíe solo en el color para resaltar los enlaces. La mejor forma

es utilizar enlaces subrayados con negrilla.

29 Estos números expresan una relación que calcula el contraste entre las luminosidades relativas (o intensidad de luz emitida)de dos colores, el del fondo y el del texto. La relación de contraste de 4.5:1 fue elegido para el nivel AA ya que compensa la pérdida de sensibilidad al contraste que por lo general experimentan los usuarios con pérdida de visión equivalente a aproximadamente una visión de 20/40.

68



Para revisar la relación de contraste de luminancia entre el texto y el fondo, se sugiere el uso de validadores de color como:

» 6https://webaim.org/resources/contrastchecker/

» http://codexexempla.org/recursos/analizador_

contraste.php#muestra

IMÁGENES

Nivel A - 3.1.1.1 Contenido no textual

La accesibilidad de las imágenes de un sitio web resulta fundamental para la correcta percepción global del sitio. Las imágenes hacen parte fundamental del diseño de los sitios web, cumpliendo desde una función estética hasta un complemento que le añade significado al contenido. Sin embargo, para los usuarios con discapacidad visual que no pueden percibirlas, se plantean como una exclusión en la información, si no se provee un texto alternativo descriptivo que pueda comunicarles el mismo mensaje.

69


Diseño

Proveer una modalidad alternativa como un texto que pueda brindar al usuario una descripción auditiva a través de un lector de pantalla, garantiza el acceso a la información al comunicar la información que es mostrada en la imagen.

En este sentido, los textos alternativos deben usar términos que proporcionen información importante para transmitir el significado de la imagen al usuario y deben evitar el uso de palabras como “imagen”, “gráfico” y “foto” en su texto alternativo por ser palabras que no describe el propósito de la misma.

Adicional, es importante evitar el uso de imágenes de texto pues los usuarios pueden tener más dificultades para leer texto en una imagen porque no se puede modificar para que se ajuste a las preferencias del usuario, es decir, no se puede aumentar el tamaño de la fuente ni cambiar el contraste. Además, una imagen no transmite información estructural, pues si se usa una imagen como título, un usuario ciego no sabrá que esta imagen en particular se debe considerar como un título porque no estará etiquetada como tal.

70



Cuando se haga uso de imágenes es importante diligenciar el campo de título de forma descriptiva pues éste se utiliza como etiqueta emergente de ayuda cuando el usuario pasa el cursor por encima de la imagen. Adicionalmente, es importante diligenciar el campo de texto alternativo con la información detallada de la imagen (diferente del título), pues este campo es utilizado como descripción para los usuarios de lectores de pantalla, por los motores de búsqueda o cuando no se pueda cargar la imagen.

CARRUSELES Y ANIMACIONES

Nivel A - 3.2.2.2 Poner en pausa, detener y ocultarNivel A - 3.2.3.1 Umbral de tres destellos o menos

Los carruseles son una forma sencilla de animar una página estática y crear movimiento e interés en un sitio web. Sin embargo, al crear carruseles, es importante recordar que para que la presentación de diapositivas sea accesible, el usuario debe tener control sobre ella. Por ello los usuarios deben poder detener la presentación de diapositivas y avanzar a la siguiente a su propio ritmo a través de controles que les permitan experimentar el contenido a una velocidad adecuada para ellos. También es importante que este tipo de contenidos no contengan nada que destelle más de tres veces en un segundo, pues esto podría desatar convulsiones para algunos usuarios.

71


Diseño

Brindar mecanismos de control que permitan pausar, detener u ocultar los contenidos que se mueven, parpadean o se desplazan, ayuda a los usuarios a tomarse el tiempo necesario para dar lectura y comprender el contenido presentado de manera ajustada a sus capacidades. Por otra parte este tipo de mecanismos permite focalizar la atención, pues los textos o imágenes parpadeantes o en movimiento con frecuencia distraen a los usuarios de lo que es importante en el sitio.


Cuando se haga uso de carruseles, como es el caso del Slideshow principal, los mecanismos de controles pueden ser implementados por la siguiente ruta: Estructura> Views> Slideshow principal; en esta sección se da editar y se va a Formato> Configuración> Acción> Pause on click.

72


ENTRADA DE DATOS ASISTIDA (FORMULARIOS)

Nivel A - 3.3.3.1 Identificación de erroresNivel A - 3.3.3.2 Etiquetas o instrucciones

Uno de los elementos en un sitio web en el que podemos encontrar más problemas en términos de accesibilidad son los formularios. Esto porque son campos que requieren que el usuario introduzca diferentes tipos de información que pueden ser confusos o en el que se aumenta la probabilidad de ingresar datos erróneamente.

En este sentido, todas las personas cometen errores en este tipo de elementos, sin embargo, para el caso de las personas con discapacidad, esto puede ser más frecuente y además podrían presentar más dificultad para detectar que han cometido un error. Por ello es necesario implementar tanto mecanismos que provean al usuario instrucciones claras, como una identificación precisa de errores.

73


Diseño

Proveer instrucciones o etiquetas claras en los campos de los formularios, permite a los usuarios saber qué datos de entrada se esperan. Así, este tipo de instrucciones o etiquetas también pueden especificar formatos de datos para campos, especialmente si están fuera de los formatos habituales o si existen reglas específicas para la entrada, por ejemplo, formatos especiales de fechas. El objetivo con este criterio es proporcionar claves e instrucciones importantes que beneficiarán a las personas de tal manera que los mismos puedan realizar las tareas sin confusión o navegación excesiva.

Ahora, brindar un mecanismo que avise al usuario que se ha presentado un error en el ingreso de información, permite que los usuarios identifiquen y además determinen cuál es el error. Por ello el mensaje que avisa a los usuarios del error debe ser lo más específico posible, no solo para un ingreso errado, sino en el caso de que los campos del formulario no se hayan completado apropiadamente. Esta información no puede reducirse solo a una indicación de color, sino que debe proveer una identificación y descripción del error para que esta información pueda ser descrita a través de los lectores de pantalla.


Cuando se agreguen componentes a un Webform en Govimentum, en la edición del componente, se puede diligenciar una descripción del mismo, de ser necesaria información más detallada sobre la solicitud de datos para el usuario. Asimismo, puede hacerse uso del placeholder como una breve sugerencia que describe el valor esperado en ése campo de entrada.

74


REFERENTES

» http://www.un.org/en/webaccessibility/index.shtml

» https://ntc5854.accesibilidadweb.co/index.php

» https://www.w3.org/TR/2016/NOTE-UNDERSTANDING-

WCAG20-20161007/Overview.html#contents

» Hilera, J y Campo, E (Eds.). (2015). Guía para crear contenidos

digitales accesibles: Documentos, presentaciones, vídeos, audios

y páginas web (1ª ed.). Alcalá de Henares, España: Universidad de

Alcalá.

Documents

Guía de buenas prácticas de uso del CMS Govimentum · 2018. 10. 25. · Guía de buenas prácticas de uso del CMS Govimentum La información aquí consignada, busca ampliar el conocimiento