Componentes

Función

Son las piezas básicas que permiten dar forma a unidades de contenido.

Tipos

• Destacado

• Bloques de texto

• Bloques de datos

• Imágenes

• Imágenes con enlace

• Tarjetas

• Recursos

• Histórico

• Listado de publicaciones

• Contacto

• Redes sociales

• Iconos

• Logotipos

• Anclas

• Galería de imágenes

• Menú de navegación

Guías de estructura

Función

Los componentes se agrupan dando lugar a diferentes guías de estructura. Estas guías de estructura sirven como base para introducir el contenido.

Tipos

• Subvenciones

• Campañas

• Premios

• Memorias y listados

• Publicaciones científicas

• Servicios

• Empleo público

• Ofertas de empleo

Función

Destacar contenido importante.

Recomendaciones

El destacado amarillo y gris solo pueden usarse una vez por página y deben usarse en su parte superior.

El destacado azul puede usarse tantas veces como sea necesario a lo largo de la página sin abusar de él.

Uso de iconos

Se permite el uso de otros iconos para otras situaciones. Los iconos tendrán 30x30px. Ver “Uso de iconos”.

Función

Describir el contenido.

Variantes

Bloque de texto con y sin imagen.

Recomendaciones

• Solo habrá una imagen acompañando al texto.

• Se recomienda que esta imagen se añade como imagen principal debido a su ajuste automático. Para más información ver “imágenes”.

Función

Presentar información de forma más directa, cubriendo los puntos más relevantes del contenido para el lector.

Variaciones

Bloque de datos cortos para información más concisa. Y Bloque de datos largos para ofrecer un mayor desarrollo de la información, como describir las fases de una campaña.

Recomendaciones

Para la presentación de múltiples organismos se recomienda separar sus enlaces entre barras verticales.

Función

Incluir varias imágenes que complementen el contenido de la página. Principalmente usado en campañas para presentar posters y carteles.

Recomendaciones

• Mantener altura de las imágenes a 350px e intentar que las imágenes no pesen más de 250 Kb.

• Todas las imágenes tendrán siempre el mismo tamaño.

• Alineación a la izquierda.

• No se recomienda introducir más de 4 imágenes y en ese caso se recomienda mantener una  cuadrícula.

• Evitar mezclar las imágenes con el contenido.

• Evitar uso de imágenes de baja calidad.

A tener en cuenta…

Las imágenes tienen que ser introducidas en el editor.

Además, para el ajuste de imágenes puedes hacerlo en https://www.iloveimg.com/

Función

Redirigir a contenidos directamente relacionados con el contenido de la página destacándolos visualmente (pueden internos o externos)

Recomendaciones

• Evitar hacer varios bloques de “Imágenes con enlace”.

A tener en cuenta…

Este componente solo puede ser usado en en la plantilla Contenido final (Agregadora).

No funciona en “Contenido final”.

Función

Redirigir a páginas internas del portal directamente relacionados con el contenido presentado.

Recomendaciones

• En los cuadros, utilizar el texto superior para indicar el título del contenido al que se redirige, el cual incluirá el enlace. El texto inferior se utiliza para indicar el contenido al que se relaciona.

• Utilizar el menú de navegación para contenido directamente relacionado con la página, en caso de no estar directamente relacionado o ser enlaces de soporte, usar “Enlaces relacionados”.

• Hay que tener cuidado con no sobrepasar el límite de caracteres, los textos deben ser cortos ya que si no caben, no serán mostrados.

Función

Aportar recursos relacionados con el contenido que pueden ser de utilidad para el lector.

Recomendaciones

Para evitar la publicación masiva de recursos en columna se limitan los recursos a un Archivo comprimido ZIP que contiene todos los recursos, así como otros archivos extra que no deberán superar los 4 archivos.

• Lista de recursos múltiples formatos: Permite añadir un mismo archivo en diferentes formatos.

• Lista de recursos: Se limita a un único formato por archivo.

Función

Aportar una lista indefinida de archivos similares recurrentes en el tiempo.

Recomendaciones

• Evitar el salto de línea del enlace. Se recomienda reducir la extensión del texto para facilitar su lectura.

• Para la inclusión de archivos diferentes se recomienda crear diferentes históricos.

Nomenclatura

La nomenclatura utilizada es:

Nombre - Fecha - Contenidos a los que pertenece - Organismo al que pertenece (Formato Mb).

Función

Facilitar el contacto y dirección de organismos y empresas.

Recomendaciones

• Para organismos internos, pertenecientes al GA se utiliza una redirección a su página de contacto del portal.

Función

Facilitar las redes sociales del organismo presentado.

Recomendaciones

• El tamaño de los iconos será de 24x24px. Ver “uso de iconos” para más información.

Dónde encontrarlos…

Streamline: Librería Core Line https://www.streamlinehq.com/icons/streamline-mini-line

Función

Reforzar el mensaje de forma más visual en algunos casos, como banners y redes sociales.

Recomendaciones

• Utilizar la librería Core Line de Streamline en negro con los siguientes tamaños:

• Tamaño en banners: 30x30px

• Tamaño en redes sociales: 24x24px

• Programa de ajuste imágenes: www.iloveimg.com

Dónde encontrarlos…

Streamline: Librería Core Line https://www.streamlinehq.com/icons/streamline-mini-line

Función

Representar de manera ordenada múltiples logotipos de entidades y organismos.

Recomendaciones

• Evitar su combinación con otros componentes.

• Se dispondrán en línea.

• En blanco y negro.

• Altura de 50 px máxima con borde blanco de 20px.

• Programa de ajuste imágenes:

• http://www.iloveimg.com

Galería de logotipos del GA

www.aragon.es/-/galeria-de-escudos-y-logotipos-de-la-comunidad-autonoma-gobierno-de-aragon-y-administracion-autonomica

Función

Redirigir a partes del contenido de la página. Solo pueden aparecer 4. Están vinculadas a los títulos de nivel 2.

Recomendaciones

Intentar mantener los títulos entre 65 y 75 caracteres.

Página de ejemplo

https://www.aragon.es/-/becas-y-ayudas

Función

Carrusel de imágenes, documentos o enlaces. Aparece al final del contenido.

Recomendaciones

• La “Descripción” debe transmitir la misma información que la imagen de forma concisa (menos de 150 caracteres). 

• La descripción solo puede dejarse vacía si la imagen es decorativa.

Función

Es un componente que se gestiona independientemente de las páginas. Sirve para redirigir a contenidos directamente relacionados con el contenido de la página.

Recomendaciones

• No hay límite de creación de elementos del menú pero recomendamos que se cuide este aspecto sobre todo para una mejor experiencia del usuario.