manual imagen 2013-2019 - Intranet...

www.bajacalifornia.gob.mx

Manual de Imagen Portales InstitucionalesGobierno del Estado de Baja California 2013-2019

Este manual de imagen fue elaborado por la Subsecretaría de Innovación y Modernización Gubernamental de la Secretaría de Planeación y Finanzas del Gobierno de Baja California, en base a los lineamientos de imagen establecidos por la Coordinación de Comunicación Social, con el fin de establecer una imagen institucional en los portales de las dependencias que conforman la estructura estatal.

Lo anterior nos permitrá posicionar la imagen de nuestro estado en la red como una sola entidad, ofreciendo un punto único donde se concentre la información y servicios que ofrece el Gobierno, a través de las dependencias que lo conforman, con una navegación amigable, una estructura, lenguaje e imagen homogénea .

En el presente documento se describen las especificaciones técnicas del diseño, imagen (look and feel), estructura y navegación del sitio.

Introducción1.

PANTONE 2935 C PANTONE 320 C PANTONE 109 C PANTONE 158 C PANTONE Cool Gray 9 C

PANTONE Cool Gray 9 C 70% 60% 50% 40% 30% 10%

Es importante el respetar en todo momento los colores que conforman la identidad. Los colores hexadecimales (HTML) serán usados para web.

R G B0 91 187

HTML #005BBB

R G B0 154 166

HTML #009AA6

R G B254 209 0

HTML #FED100

R G B227 114 34

HTML #E37222

R G B116 118 120

HTML #747678

Gama de colores2.

Manual Imagen Portales Institucionales Gobierno del Estado de Baja California 2013-2019

Identidad Dependencias y Entidades


3.

Ab Cd Ef Gh Ij Kl Mn Op Qr St Ux Yz1234567890

Myriad Pro Regular

Frutiger LT Com Ultra Black

Para la homologación de los sitios del Gobierno del Estado te presentamos la familia tipográfica que se debe utilizar para el desarrollo del sitio de internet. El logotipo está conformado por dos familias tipográficas, Frutiger LT Com en su versión Ultra Black como tipografía primaria y Myriad Pro Regular como tipografía secundaria. Ambas tipografías podrán ser utilizadas como imagenes, gráficos y en banners.

Tipografía


Tipografía para imágenes y gráficos

Para los títulos en general se está utilizando la fuente Humanist777.

Para el texto general se recomienda la fuentes Arial, ya que se trata de una tipofrafía segura que pueden leer todos los navegadores web sin ningún problema.

Tipografía para el sitio

Humanist777


Arial



4.

Estructura

En este apartado se determina que elementos integrarán la estructura de los sitios web del Gobierno del Estado, con divisiones o secciones similares con el objetivo de que los ciudadanos encuentren con mayor facilidad los contenidos y naveguen de forma más rápida y eficiente por los portales.

Encabezado: Es el elemento distintivo de cada sitio, debe contener el logotipo del organismo público, fotos relacionadas al área, menu principal, buscador, etc.

Contenido: Es el cuerpo de la página, donde se despliega la información de cada sección.

Pie de Página: En esta parte se desplegará la información más relevante, además de los datos del administrador del portal, enlaces a resaltar y herrramientas entre otros elementos.

Submenú: Este elemento se ubica en la parte izquierda de la estructura, se utiliza en caso que sea necesario enlistar más secciones en las páginas interiores, así mismo se puede utilizar para insertar gráficos o imagenes que se deseen resaltar.

ENCABEZADO

CONTENIDO

PIE DE PAGINA

ENCABEZADO

SUBMENU

CONTENIDO

PIE DE PAGINA


5.

En el encabezado se define la imagen del sitio, el logotipo de la dependencia/entidad debe aparecer al lado izquierdo de la pantalla, del lado contrario se recomienda incluir fotografías sin fondo relacionadas con el tema.

Menú PrincipalEs este espacio se detalla las secciones del portal, la estructura con las opciones principales del sitio, las cuales deben contener la información más importante y de mayor interés para la ciudadanía.

Es fundamental resaltar que este menú debe estar estructurado exclusivamente en función de las necesidades de información del usuario.

ENCABEZADO

Inicio: Regresar a la página principal del sitio

Contáctanos: Liga al directorio o a un correo electrónico de atención

Portal Gobierno: Enlace directo al sitio del Gobierno del Estado

Trámites y Servicios: Enlace a la sección de la dependencia/entidad en el Catálogo de Trámites y Servicios.

Transparencia: Enlace al portal de Transparencia

Búsqueda: Incluir un motor de búsqueda dentro del portal

Se recomienda agregar las siguientes opciones:


5. Estructura

5.1 Encabezado

La parte central de la plantilla esta reservada para el cuerpo de la página web, en este espacio se publicará la información que se desea publicar. Entre los contenidos que se recomiendan incluir estan las noticias de la entidad, mensaje del titular. Es importante que se incluyan imágenes a los contenidos, ya que esto incrementa el atractivo del portal.

Además se recomienda:Actualizar la información periódicamente para mantener la atención del usuario sobre el portal.Utilizar lenguaje amigable y entendible.

CONTENIDO

PIE DE PAGINA

En esta sección se debe incluir el escudo del Gobierno del Estado en escala de grises, seguido por los datos de la dependencia o entidad (ubicación, teléfono, correo de contacto).

Enlaces a Portales: Se incluirán las secciones más importantes de los portales de Gobierno, Trámites y Servicios y Transparencia.

5.2 Contenido

5.3 Pie de Página


5. Estructura

El menú izquierdo se utilizará para los interiores del sitio, para desplegar las opciones que contienen cada sección del portal, esto con el fin de hacer más accesible la información al usuario.

Además, en este espacio se pueden incluir gráficos con programas, eventos o información a resaltar dentro de la pagina web.

Es importante recalcar que los nombres de las opciones del sitio deben estar enfocadas a facilitar la navegación del usuario, es decir, usar un lenguaje simple, claro y directo, que permite a los visitantes ubicar la información que quieren consultar de manera sencilla y rápida.

SUBMENÚ

5.4 Submenú


Acerca denosotros

Nos interesatu opinión

Anuncios

Información sobre la estructurainterna de la dependencia

Espacio para banners sobre anuncios o información a destacar

Liga a forma de contacto o correoelectrónico para opinión sobreel sitio

SeccionesInformación o temas principales decada dependencia/entidad

5. Estructura

Este elemento es de mucha utilidad ya que permite promocionar de manera gráfica un tema en específico ya sean programas, formatos, etc., los banners se pueden colocar en el menú, dependiendo de los requerimientos del mismo (tamaño, imagen, información, etc.).

Los banners deben ser claros y no saturados de texto para que el mensaje o la información que se esta promocionando llegue en forma directa al usuario que esta visitando el sitio.

6. Gráficos e Imágenes


Banner de promoción

Información o enlace a resaltar en el sitio

Este elemento es de mucha utilidad ya que permite promocionar de manera gráfica un tema en específico ya sean programas, formatos, etc., los banners se pueden colocar en el menú, dependiendo de los requerimientos del mismo (tamaño, imagen, información, etc.).

Manual de Imagen para Portales Siete

Es una herramienta que permite agregar efectos y funcionalidades complejas a una pagina, como por ejemplo: galerías de fotos dinámicas, validación de formularios, calendarios, entre otras cosas sin los detalles complejos de la programación.

JQuery

7. Especificaciónes técnicas

Un sitio gubernamental puede contener texto, gráficos, fotos, e inclusive videos. Además de esto, el portal puede incluir contenido dinámico (Ajax), el lenguaje para la maquetación y desarrollo de éstas aplicaciones web debe ser la siguiente:

Archivos JSP con estructura HTML mediante Layout DIV, preferentemente HTML5 CSS 3 JQuery y Javascript

La tecnología aceptada por nuestros servidores es JAVA 4 y 6

Si la aplicación corre en sus propios servidores cualquier versión en Java sera aceptada.

Una recomendación importante es no utilizar animaciones en FLASH ya que cualquier información contenida en un archivo SWF no estará disponible para los buscadores. Otra desventaja es que la mayoría de los teléfonos y dispositivos móviles no tienen soporte para Flash y cada vez se incrementa más los usuarios que accesan la información por estos medios. Se recomienda utilizar JQuery.


Documentos PDF: Se debe verificar que el tamaño de los archivos que se publiquen en el sitio sea el adecuado, no debe exceder de 3MG para que el usuario pueda consultar los documentos rápidamente.3MG

1MG

Para las dependencias que manejen poca información o que no cuenten con presencia en Internet, existe la opción de una plantilla sencilla donde se publique la información básica sobre la entidad, a continuación un ejemplo:

En caso de requerir apoyo por parte de la Subsecretaría de Innovación y Modernización Gubernamental para la elaboración de su sitio, favor de hacer llegar la petición mediante oficio dirigido al titular de esta Subsecretaría, Ricardo Osuna, con las necesidades que tenga la dependencia o entidad.

7. Minisitios


SUBSECRETARÍO DE INNOVACIÓN Y MODERNIZACIÓN GUBERNAMENTALRicardo Osuna

COORDINADORA DE GOBIERNO DIGITALRosa María [email protected]

Contacto y dudas:Claudia Herrera Ará[email protected] (686) 558 1000 ext. 1403

Directorio


manual imagen 2013-2019 - Intranet...

Documents

Transcript of manual imagen 2013-2019 - Intranet...