Componentes de la interfaz de usuario: aplicación web del Geoportal
La interfaz de usuario del Geoportal usa el marco de JavaServer Faces (JSF). Faces procesa las solicitudes de las páginas del sitio Web y las enruta al controlador del Geoportal correspondiente para la ejecución. Luego de la ejecución, Faces navega a la página adecuada para presentar la respuesta. Los controladores y las reglas de navegación se configuran en \\geoportal\WEB-INF\gpt-faces-config.xml.
El diseño para las páginas del sitio Web se basa en el marco de teselas de Apache Struts. Teselas define la plantilla de la página, permitiendo que haya consistencia en todas las páginas. Las definiciones de las teselas se configuran en \\geoportal\WEB-INF\tiles-defs.xml y se implementan en \\geoportal\catalog\skins\centeredLayout.jsp. Para obtener más información sobre los marcos de teselas, consulte Teselas y diseño del Geoportal.
El estilo de las páginas web (colores, fuentes, etc.) se basa en una hoja de estilo en cascada (CSS) y en su conjunto de gráficos correspondiente (predeterminados: \\geoportal\catalog\skins\red\main.css y \\geoportal\catalog\skins\red\images).
Los componentes de la interfaz de usuario principal asociados con la operación, aspecto y contenido localizable para la aplicación Web del Geoportal se muestran en la figura a continuación.
Las cadenas de la interfaz de usuario se pueden localizar. Todas las cadenas de caracteres (con excepción de los mensajes de errores del nivel bajo y el contenido suministrado por el usuario) se recuperan de un paquete de recursos Java. El paquete se puede traducir a otro idioma y se le puede asignar un nombre: \\geoportal\WEB-INF\classes\Geoportall_[código de idioma]_[código de país]_[variante].properties. Para obtener más información sobre cómo localizar el Geoportal, consulte el apartado sobre localización en la sección de personalización de la ayuda web.
El sitio Web usa el JavaScript para cualquier programación del lado del cliente (es decir, lado del navegador). El kit de herramientas de Dojo (un marco de JavaScript) se usa para interacciones más complejas (p. ej., las llamadas de AJAX). El sitio Web usa el API de JavaScript de ArcGIS al implementar la funcionalidad relacionada con SIG en una página de la aplicación Web del Geoportal. Entre algunos de los ejemplos se incluyen la visualización de mapas interactivos, la interacción con servicios de ubicación geográfica, la interacción con el servicio de descarga de datos del Geoportal y la proyección de la representación primitiva.
Teselas y diseño de la aplicación Web del Geoportal
La interfaz del Geoportal se construye usando teselas Apache. Teselas Apache es un marco de plantillas para el desarrollo de la interfaz de usuario para la aplicación Web. Los autores pueden definir una página de aplicación Web en fragmentos, los que se ensamblan para formar la página completa durante el tiempo de ejecución. Para obtener más información, consulte http://tiles.apache.org.
Las teselas se ensamblan juntas en un diseño. La mayoría de las páginas de la interfaz del Geoportal se trazan usando el "diseño centrado". Este diseño se define en el archivo \\geoportal\catalog\skins\centeredLayout.jsp. Hay otros dos diseños que se definen en una instalación del Geoportal lista para usar: un diseño emergente y un diseño con centrado mínimo. Éstos se usan en algunas instancias de ciertas páginas en donde no es necesario el diseño completo y la navegación.
Las teselas que componen cada uno de los diseños se definen en el archivo \\geoportal\WEB-INF\tiles-defs.xml.
El gráfico a continuación muestra la estructura del diseño centrado y la organización de las teselas en el mismo. En el gráfico, las secciones del cuerpo y del encabezado hacen referencia a las etiquetas de cuerpo y encabezado HTML estándar. Las secciones div hacen referencia a las etiquetas div HTML estándar y los cuadros verdes (en la mayoría de los casos, situados a la derecha) representan una tesela. 
- Head (encabezado): importa las bibliotecas JavaScript globales y establece las etiquetas meta HTML.
- Banner (título): espacio en el que se inserta la imagen del título o encabezado, así como los vínculos de navegación terciaria.
- Tertiary Navigation (navegación terciaria): espacio en el que se aloja la navegación relacionada con el usuario. Esto incluye vínculos para:
- Inicio/cierre de sesión:
- Registro/Mi perfil
- Ayuda
- Acerca de
- Comentarios
- Primary Navigation (navegación principal): espacio para las pestañas de navegación principales de las diferentes secciones del Geoportal. Esto incluye:
- Inicio
- Buscar
- Examinar
- Administración (para administradores)
- Iniciar el Visor de mapas (si se implementa un visor de mapas opcional)
- Secondary Navigation (navegación secundaria):espacio para los vínculos que dirigen a funciones secundarias dentro de una sección principal. Algunos de ellos son:
- Manejar y agregar la pestaña de Administración
- Body (cuerpo): incluye el contenido principal de las páginas.
- Footer (pie de página): suele ser un marcador para los vínculos a renuncias de responsabilidad, declaraciones de privacidad o cualquier otra información que deba aparecer de manera discreta en todas las páginas de la aplicación.