37
MANUAL DE IDENTIDAD VISUAL CORPORATIVA Universidad de La Laguna 165 ANEXO WEB Anexo Web

Anexo web-formato-descarga-web[1]

  • Upload
    nam-jap

  • View
    260

  • Download
    1

Embed Size (px)

DESCRIPTION

Elementos Identidad Corporativa

Citation preview

Page 1: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

165

ANEXO WEB

anexo Web

Page 2: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

166

0 | IntroduccIón

La rápida implantación de los medios digitales en el mundo de la imagen, ha provocado severos cambios en la concepción y estructuración de una marca. la Universidad de La Laguna, empero, no es una excepción, y ha de renovar su identidad corporativa cada vez con mayor celeridad en el tiempo. Esto es debido, en gran medida, a la implantación de la denominada web 2.0 hace pocos años, como estándar de comunicación visual de redes virtuales.

El diseño del sitio web de la Universidad de La Laguna está primeramente condicionado por el carácter institucional de la marca, y por su función como medio de información y comunicación con los usuarios. Debido a esta razón, se ha procedido a la realización del sitio web siguiendo unos estándares en cuanto a accesibilidad y a claridad de contenidos se refiere. La limpieza gráfica y una estructuración clara de contenidos son elementos básicos para cumplir con su cometido.

Al igual que ocurre con nuestro sitio web, éstos han de ser patrones básicos que conformarán su uso en publicaciones web futuras, así como la implementación de la marca en diversos portales web.

El anexo web, que es el apartado que se muestra a continuación, está conformado por una serie de normas de identificación visual de obligado cumplimiento que garanticen la coherencia de los sitios web con el resto de elementos que conforman la imagen institucional de la Universidad de La Laguna.

anexo web: Introducción

Page 3: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

167

1 | usabIlIdad

anexo web: usabilidad

La usabilidad viene definida por el ideal técnico de resolver el problema del diseño de carácter web, y su objetivo principal consiste en facilitar a los usuarios el trabajo de llevar a cabo tareas útiles (búsqueda de contenidos, obtención de la información...)

Un sitio web que utilice, ya sea en su totalidad o en parte, la imagen de la Universidad de La Laguna, ha de seguir estos estándares de usabilidad, con el fin de facilitar la información al usuario de manera rápida e intuitiva. Estos estándares se pueden resumir en los siguientes:

- Navegación intuitiva: El usuario debe reconocer cada uno de los elementos de la web, para una mayor rapidez en la navegación. Asimismo, evitaremos los callejones sin salida que son páginas en las que el usuario se ve obligado a pulsar el botón “atrás” del navegador. Para solventar esto, el logotipo principal de la página será siempre un enlace permanente a la página de inicio.

- Interfaz clara: Se debe evitar la sobrecarga de elementos en la página, con el fin de no confundir al usuario.

- Regla de los tres “clics”: Se debe intentar, en la medida de lo posible, que el usuario acceda a la información deseada en el menor número de enlaces posibles, siendo tres, el número máximo de “clics” que el usuario debe realizar para encontrar lo que busca.

- Buscadores: Se recomienda el uso de buscadores para incrementar resultados de búsqueda en la navegación.

- Contenido: Se evitarán los contenidos excesivamente largos, de tal forma que las páginas no excedan de una página y media. Se ha demostrado que el usuario no invierte demasiado tiempo en buscar información si la página es excesivamente extensa. Por extensa se entiende en términos web a aquella página en la que para visualizarla totalmente, se ha de girar más de dos veces la rueda del ratón. Las páginas del tamaño de una pantalla y media son cómodas de leer y no saturan al lector con demasiada información.

- Comprobación de los enlaces: Los enlaces se deben revisar periódicamente para que estén siempre activos y sin errores. Esto no solo es importante por el hecho de acceder a la información que el usuario precise en ese momento, sino que, además, sirve para una mejor implementación en los principales motores de búsqueda.

- Ortografía y gramática. En la página 196 y siguientes encontrará una guía de estilo en la que podrá consultar las dudas que tenga a la hora de redactar los contenidos.

Page 4: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

168

La página de inicio debe ser lo primero que que ve un usuario al entrar a un sitio. Por esta razón no se debe incluir una “página de bienvenida” o una animación introductoria. Está demostrado que esta práctica ralentiza el acceso a la página web, ya que introduce un paso superfluo para llegar a la información. La página de inicio debe siempre almacenar el contenido inicial del sitio web, incluyendo los puntos más relevantes de la información, así como sus últimas actualizaciones, salvo en algunos casos excepcionales donde la promoción de un determinado evento sea la primera intención de la web, no su información.

Se deberá hacer un especial hincapié en que las páginas creadas bajo el nombre la institución tengan una relación armónica con la página principal. Haciendo uso del color blanco para el fondo, pudiéndose incluir algún caso de degradado, pero siempre partiendo de los colores institucionales hacia el blanco. (Consulte el apartado de colores corporativos: página 170, al igual que el apartado de casos de degradado, página 172).

2 | Estructura

2.1 | Estructura. Página de inicio.

anexo web: estructura

Page 5: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

169

2.1.1 | Estructura. Página de inicio. El logotipo.

Toda página web perteneciente a un miembro de la comunidad universitaria o una entidad perteneciente a ella debe mostrar el logotipo oficial de la ULL de manera visible en la cabecera, preferiblemente en el margen izquierdo de la misma, ofreciendo al pincharlo un vínculo con la página principal de la Universidad de La Laguna.

En caso de que el grupo o evento posea un logotipo propio, éste podrá incluirse en el encabezado, preferiblemente en el margen derecho de la página, pero nunca deberá ir solo o tener un tamaño mayor que el logotipo principal de la ULL, en una escala aproximada 80/100 con respecto a éste (fig 1.).

En caso de que el grupo o evento sea un emisor de la Universidad de La Laguna, deberá utilizarse el logotipo principal acompañado del nombre del subemisor, tal y como se usa en el actual manual de identidad corporativa de la Universidad de La Laguna (fig 1.).

En el caso de que sean varios los subemisores presentes en el grupo organizador, estos deberán situarse a modo de imágenes en el footer o pie de pagina, según orden y/o relevancia, con un tamaño sometido a juicio y escala de la retícula, aunque éstos nunca serán mayores que el logotipo principal, presentando un tamaño maximo de 80/100 con respecto al logotipo principal.

En el caso de que usemos un gestor de contenidos (Wordpress, Joomla, etc.), y éste no nos permita ubicar el logotipo del subemisor de ninguna de las dos formas anteriores, tendremos que dejar el nombre de éstos tal y como se especifica en los dos puntos anteriores, pero sin imagen ni logotipo, con un tamaño de fuente inferior al logotipo principal.

fig 1.

anexo web: estructura

2 | Estructura

Page 6: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

170

Los colores corporativos que se han utilizado en la identidad visual corporativa de la Universidad de La Laguna responden a un carácter formal a la marca, lo que ha permitido que el público los identifique como tales. Sin embargo, hay algunos aspectos que debemos modificar para adecuar los colores corporativos de la marca al entorno web, así como su uso, y la creación de una gama de colores secundarios que refuercen este concepto de marca.

Ante esto, nos encontramos con el problema ya mencionado de la incompatibilidad de color presente en el violeta ( PANTONE® 254 C) en modos RGB. La traducción de este color hacia colores luz nos ofrece una versión bastante más clara y más distorsionada del color original. Por lo tanto se ha diseñado, para entornos web, una variación de color que queda patente en la actual página de la Universidad de La Laguna, así como en su identidad visual corporativa. El objetivo, en este caso, ha sido crear una correspondencia de color real al modelo PANTONE®, utilizando la paleta RGB para tal efecto.

Puesto que los colores web, se refieren exclusivamente al modelo RGB y a hexachrome, obviamos el PANTONE® y la gama CMYK en este caso.

RGB HEXACHROMER: 122 G: 59 B: 122 #7A3B7A

R: 0 G: 88 B: 147 #006699R: 56 G: 61 B: 66 #666666

3 | colorEs corPoratIvos

3.1 | colores corporativos. colores primarios.

anexo web: colores corporativos

Page 7: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

171

3.2 | colores corporativos. colores secundarios.

anexo web: colores corporativos

3 | colorEs corPoratIvos

Los colores secundarios han sido seleccionados partiendo de la base de los colores primarios, para un refuerzo de los mismos. Éstos deberán ser utilizados únicamente como refuerzo: jamás deberán sustituir a los colores primarios.

Su uso queda limitado en términos de web a efectos de color de enlaces, estados de rollover, degradados, y para hacer una separación entre éstos y los colores principales.

Al igual que ocurre con los colores primarios, nos referimos a éstos únicamente en estandares RGB y Hexachrome.

vIoleta

RGB HEXACHROMER: 188 G: 135 B: 188 #BC87BCR: 237 G: 221 B: 237 #EDDDED

azul

RGB HEXACHROMER: 132 G: 153 B: 172 #8499ACR: 235 G: 243 B: 250 #EBF3FA

R: 2 G: 138 B: 206 #028ACE

En este caso, la utilización del tercer color azul será únicamente relativa a los enlaces y a los degradados, como estado de rollover, limitando el uso de los anteriores exclusivamente al fondo.

GrIs

RGB HEXACHROMER: 71 G: 84 B: 91 #47545B

R: 127 G: 139 B: 146 #7F8B92

Page 8: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

172

Los degradados son una de las primeras herramientas de embellecimiento del entorno web. Sin embargo, es imprescindible para una mejor respuesta a nivel visual de marca una limitación en cuanto a su uso. Los casos de degradado son los siguientes.

COLORES PRINCIPALES

- Violeta: El violeta principal puede degradarse con sus homónimos secundarios, con el blanco y con el azul principal. Nunca podrá degradarse con secundarios que no sean variaciones tonales del mismo, ni con el gris primario. Es decir, el violeta principal puede degradarse junto con los violetas secundarios, con el azul primario y con el blanco. En este caso, puede haber una degradación de hasta cuatro colores (violeta principal más los dos secundarios y el blanco) o bien de tres colores, si utilizamos el azul primario (violeta, azul, y blanco).

EJEMPLOS DE DEGRADADOS DEL VIOLETA PRIMARIO (#7A3B7A):

- Azul: El azul principal puede degradarse únicamente con el tercer color secundario de la gama de azules (#028ACE), con el violeta primario y con el blanco. Nunca podrá degradarse con secundarios que no sean variaciones tonales del mismo, ni con otros primarios. En este caso, puede haber una degradación de hasta tres colores (azul, más el tercer color de los secundarios (#028ACE) y el blanco).

EJEMPLOS DE DEGRADADOS DEL AzUL PRIMARIO (#006699):

3.3 | colores corporativos. casos de degradado.

anexo web: colores corporativos

3 | colorEs corPoratIvos

Page 9: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

173

- Gris: El gris principal puede degradarse con sus homónimos secundarios, y con el blanco. Nunca podrá degradarse con secundarios que no sean variaciones tonales del mismo, ni con otros primarios. Es decir, el gris principal puede degradarse junto con los grises secundarios y con el blanco. En este caso, puede haber una degradación de hasta cuatro colores (gris principal más los dos secundarios y el blanco)

EJEMPLOS DE DEGRADADOS DEL GRIS PRIMARIO (#666666):

COLORES SECUNDARIOS

- Violetas: Podrán degradarse junto con su homónimo color principal, entre sí y con el blanco, nunca con otros principales y secundarios.

Ejemplos de degradados de los violetas secundarios:

- Azules: Los dos primeros azules secundarios (#EBF3FA y #8499AC) podrán degradarse entre sí y con el blanco, únicamente. Se utilizarán preferentemente para fondos. Nunca podrán degradarse con ningún color principal, así como con los secundarios y el tercer color azul secundario.

Ejemplos de degradados de los azules secundarios:

3.3 | colores corporativos. casos de degradado.

anexo web: colores corporativos

3 | colorEs corPoratIvos

Page 10: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

174

- Grises: Podrán degradarse junto con su homónimo color principal, entre sí y con el blanco, nunca con otros principales y secundarios.

ejemplos de degradados del grises secundarios:

El uso de los colores neutros queda limitado únicamente al blanco, puesto que en el perfil corporativo el blanco es un color preponderante.

el uso del negro queda limitado exclusivamente a los textos de párrafo y encabezados. el color negro no podrá ser usado como degradado, en ningún caso.

3.3 | colores corporativos. casos de degradado.

3.4 | colores corporativos. colores neutros.

anexo web: colores corporativos

3 | colorEs corPoratIvos

Page 11: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

175

3.5 | colores corporativos. usos incorrectos.

Degradados de colores primarios al negro

Degradados de colores secundarios al negro

Degradado de colores primarios que no sean el violeta con el azul (violeta y/o azul con gris)

Degradados de colores primarios con secundarios no homónimos.(No pertenecientes a la misma gama)

Degradados de colores secundarios no homónimos.(No pertenecientes a la misma gama)

anexo web: colores corporativos

3 | colorEs corPoratIvos

Page 12: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

176

3.5 | colores corporativos. usos incorrectos.

Degradados de colores primarios con colores no corporativos

Degradados de colores secundarios con colores no corporativos

Degradado de colores no corporativos con blanco

Uso de colores no corporativos en general

Degradados de colores no corporativos

anexo web: colores corporativos

3 | colorEs corPoratIvos

Page 13: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

177

El uso correcto de tipografías es uno de los elementos más importantes a la hora de configurar un sitio web. El extenso catálogo provoca miles de variaciones diferentes en estilo y formas, con lo que, si bien podemos dotar a cada sitio web de un estilo único e inconfundible, también podemos confundir al usuario, por lo que deberemos aplicar ciertas reglas de estilo para estas tipografías, así como un conjunto de normas presentes en los sitios web vinculados con la Universidad de La Laguna.

Las principales directrices que debemos considerar a la hora de introducir texto en nuestra web serán:

- Brevedad en los contenidos. No se debe abusar de la paciencia del usuario empleando textos excesivamente largos.

- Empleo de párrafos cortos. El empleo de estos párrafos facilita la lectura y hace que el usuario no tenga que estar buscando la información que desea entre miles de caracteres. Intente condensar la información relevante en párrafos escuetos y concisos. Normalmente, estos párrafos no deberán superar las 5 líneas.

- Uso de enlaces. Cuando hablemos de algún tema que hace referencia a otro presente en este mismo sitio web o en otro se deberá incluir el correspondiente enlace dentro del mismo texto para facilitar la navegación al usuario.

- Tamaño de las fuentes. Se deberá ajustar el texto para que ofrezca un margen de legibilidad lo más alto posible. No se deberá usar un tamaño de fuente inferior a 10px. en texto de párrafo.

- Alineación. Se procurará, en la medida de lo posible, que el texto esté inmerso en una retícula para una mejor comprensión visual del contenido. Se deberá igualmente justificar el texto, preferentemente en el margen izquierdo.

4 | tIPografías

4.1 | tipografías. El texto. consideraciones generales.

anexo web: tipografías

Page 14: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

178

El avance de la web 2.0 ha provocado que el uso de tipografías se extienda más allá de las tipografías que conocemos como seguras gracias a la propiedad font-face, y librerías Javascript, del tipo cufon fonts o typekit. Dado que no todos los equipos informáticos están actualizados en calidad de navegadores, seguiremos optando por este tipo de fuentes para la realización de la web.

Las normas básicas de usabilidad recomiendan utilizar tipografías de palo seco (sin rasgo) para ser utilizados en sopotes digitales (monitores), ya que son más legibles y cansan menos la vista. Debido a esto, se ha optado por la utilización de la familia Arial, en la mayoría de los casos, puesto que forma parte del catálogo de fuentes seguras, y está presente en la inmensa mayoría de equipos informáticos. Para el uso de otras fuentes, consulte los usos restringidos de flash en la sección sobre contenidos de uso multimedia.

En la mayoría de los casos, la cabecera de entrada viene precedida por una imagen. Si tenemos la posibilidad de escribir el título de nuestra web en dicha imagen deberemos usar la familia tipográfica básica Humnst777 BT, tal y como ya se indica en la imagen corporativa actual de la Universidad de La Laguna. Esta tipografía debe reservarse exclusivamente para títulos y texto de encabezado en imagen, ya que el actual conjunto de normas de estilo para web no permite un uso seguro de esta funte para texto de párrafo, ni encabezados.

4.2 | tipografías. fuentes.

4 | tIPografías

4.2.1 | tipografías. fuentes. texto en imagen.

Humnst777 BtabcdefghijkaBCdeFGHIJK1234567890¡!#$%/&*(-)

Humnst777 btabcdefghijkabcdEfgHIJK1234567890¡!#$%/&*(-)

Humnst777 BtabcdefghijkaBCdeFGHIJK1234567890¡!#$%/&*(-)

Humnst777 btabcdefghijkabcdEfgHIJK1234567890¡!#$%/&*(-)

falsa negrita

falsa cursiva

falsanegrita-cursiva

anexo web: tipografías

Page 15: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

179

El uso de película flash, en la actual web 2.0, permite que podamos usar fuentes no seguras, ya que éstas no se considerarán fuentes a efectos de publicación web, sino parte de una película. Esto produce a veces un uso indiscriminado de varios tipos de fuentes en un mismo documento, lo que provoca cierto caos visual y la pérdida de una imagen sólida en cuanto a identidad visual se refiere.

Para evitarlo, la tipografía que debe utilizarse en el ámbito de publicación en flash será la misma que la tipografía principal, es decir, la familia tipográfica básica Humnst777 BT, para títulos y encabezados, reservando la familia tipográfica Arial para texto de párrafo.

Para un uso correcto de la fuente en estándares web, se debe utilizar la familia tipográfica básica ARIAL para encabezados, textos de párrafo y todo lo concerniente a texto en Html.

Como fuente opcional, podrá utilizarse la familia tipográfica básica Verdana, siempre y cuando no pueda utilizarse la familia Arial.

A continuación se definirán una serie de normas de estilos CSS para la correcta utilización del texto en formato HTML.

4.2.2 | tipografías. fuentes. texto en flash.

4 | tIPografías

Ejemplo de banner en flash

4.2.3 | tipografías. fuentes. texto Html.

anexo web: tipografías

Page 16: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

180

La popularización del uso de las hojas de estilo en cascada, o estilos CSS, con la aparación de la web 2.0, ha supuesto que se puedan definir los estilos de un sitio web sin modificar el contenido de cada uno de los archivos Html que lo conforman. Esto dota al entorno web actual de unas posibilidades de ajuste extraordinarias a la hora de configurar visualmente un sitio, para que todos los elementos que lo conforman tengan un alto grado de homogeneidad entre sí.

El entorno web actual de la Universidad de La Laguna está configurado por estos elementos y hojas de estilo.

Los encabezados, definidos en lenguaje CSS como h1, h2, h3 y siguientes, son elementos utilizados para resaltar e incorporar un título a cada sección que conforma nuestra web. Como ya comentamos en el anterior apartado, la tipografía de estos encabezados será la familia tipográfica ARIAL, presente en la mayoría de equipos informáticos. A continuación pasaremos a definir todas las propiedades de cada uno de los encabezados que deben usarse en los sitios web concernientes a la Universidad de La Laguna.

El encabezado 1 o h1, debe tener las siguientes propiedades:

El resultado ha de ser similar a este:

Encabezado 1

4.3 | tipografías. Estilos css.

4.3.1 | tipografías. Estilos css. Encabezados.

4.3.2 | tipografías. Estilos css. Encabezado 1 (H1).

- Tamaño de fuente: 18px.- Familia de fuente: Arial, Verdana, sans-serif.- Color: #006699.- Grosor de la fuente: Bold.

4 | tIPografías

anexo web: tipografías

Page 17: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

181

Opcionalmente, puede incluirse un rectángulo con el color corporativo violeta como imagen de fondo, siempre antes del texto, dejando un margen de sangrado de 15px. Este rectángulo habrá de tener unas medidas de 7px de largo por 15px de alto, y ser de color sólido #7A3B7A.Las propiedades que han de añadirse en la hoja de estilos en este caso serán las siguientes:

Obteniendo este resultado:

Encabezado 1

El encabezado 2, o h2 queda definido por las siguientes propiedades.

Dando como resultado:

Encabezado 2

El encabezado 3, o h3 queda definido por las siguientes propiedades.

Dando como resultado:

Encabezado 3

background: transparent url(../h1imagen.gif) no-repeat left ;text-indent: 15px;

4.3.3 | tipografías. Estilos css. Encabezado 2 (H2).

- Tamaño de fuente: 16px.- Familia de fuente: Arial, Verdana, sans-serif.- Color: #006699.- Grosor de la fuente: Bold.

4.3.4 | tipografías. Estilos css. Encabezado 3 (H3).

- Tamaño de fuente: 14px.- Familia de fuente: Arial, Verdana, sans-serif.- Color: #006699.- Grosor de la fuente: Bold.

4 | tIPografías

anexo web: tipografías

Page 18: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

182

El resto de encabezados que pudiera tener el sitio web (h4, h5, h6...) deberán tener unos valores definidos por el desarrollador/diseñador, y habrán de ajustarse a las siguientes condiciones:

- No podrán tener un tamaño mayor a 14px.- La familia tipográfica a utilizar deberá ser ARIAL.- No podrán utilizarse colores que no sean los corporativos y el negro.

Ejemplos de uso válidos:

Encabezado 4

Encabezado 5

Encabezado 6

Basándonos en las anteriores premisas, podemos establecer y definir claramente los encabezados de nuestro sitio web. No obstante, mostramos un ejemplo de encabezados no permitidos:

Encabezado Encabezado

Encabezado Encabezado

4.3.5 | tipografías. Estilos css. resto de encabezados.

4.3.6 | tipografías. Estilos css. Encabezados no permitidos.

Tamaño superior a 18px Uso de colores no corporativos

Uso de fuentes no corporativas Uso de fuente de la familia básica Verdana, si está

disponible la familia tipográfica ARIAL

4 | tIPografías

anexo web: tipografías

Page 19: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

183

El texto de párrafo es el más utilizado en lenguaje Html para crear contenido, por lo tanto deberemos ser muy exactos en cuanto a su legibilidad y uso. Asimismo, es el texto que sufre más cambios cuando realizamos actualizaciones de nuestro sitio web.

Las hojas de estilo en cascada nos permiten configurar unos valores estandar para la creación de estos textos. En el caso de los sitios web vinculados a la Universidad de La Laguna, estos valores básicos son los siguientes:

Ejemplo:

Esto es un texto de párrafo normal.

Los hipervínculos o links son textos que al ser pulsados enlazan con diferentes partes de nuestro sitio web. Actualmente, y gracias a las CSS, podemos configurar los enlaces del sitio para que estos enlaces tengan una forma, color y tamaño determinados así como crear un estado de rollover. (El estado de rollover provoca que este vínculo se modifique en color o apariencia cuando se sitúa el ratón por encima del mismo).

Para los sitios web vinculados a la Universidad de La Laguna, las propiedades de los hipervínculos serán las siguientes:

Ejemplo:

ejemplo de hipervínculo.

4.3.7 | tipografías. Estilos css. texto de párrafo.

- Tamaño de fuente: 12px.- Familia de fuente: Arial, Verdana, sans-serif.- Color de la fuente: #333333.

4.3.8 | tipografías. Estilos css. Hipervínculos.

- Tamaño de fuente: 12px.- grosor de la fuente: normal- Familia de fuente: Arial, Verdana, sans-serif.- Color de la fuente: #006699.- Decoración del texto: ninguna.

4 | tIPografías

anexo web: tipografías

Page 20: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

184

En estado de rollover (en lenguaje CSS a:hover) el hipervínculo variará únicamente en color, modificando esta propiedad:

Ejemplo:

ejemplo de hipervínculo en estado rollover

Obsérvese que, normalmente y por defecto, los hipervínculos vienen subrayados, o se subrayan al pasar por encima de ellos con el ratón (rollover). Para evitar esto, utilizaremos la propiedad “text-decoration” introduciendo el valor “none”.

Muchas veces en el ámbito web utilizamos tipografías a modo de eslogan para promocionar determinados eventos. Esta promoción suele hacerse por medio de banners ya sea de manera estática (banners de imagen en formato gif o JPG) o dinámica (utilizando tecnología flash). Considerando su posible uso, la utilización de estas tipografías queda restringida a las siguientes:

La tipografía que ha de usarse a la hora de crear esloganes, ha de pertenecer a la familia tipográfica Pristina. En un tamaño nunca inferior a 14px. Partiendo de esta fuente, podremos hacer distintas configuraciones como modificar su inclinación, sus colores, y todas aquellas variaciones que a juicio del diseñador sean correctas.

Ejemplo:

- Color de la fuente: #028ACE.- Decoración del texto: ninguna.

4.4 | tipografías. casos excepcionales.

4.4.1 | tipografías. casos excepcionales. texto de eslogan.

PristinaabcdefghijkABCDEFGHIJK1234567890¡!#$%/&*(-)

Pristina regular

4 | tIPografías

anexo web: tipografías

Page 21: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

185

El uso de imágenes como recurso en la web está a día de hoy totalmente desarrollado. Las imágenes no solo forman parte del contenido estructural de la web, sino que pueden convertirse en elementos informativos de referencia. Por lo tanto, la selección e implementación de estas imágenes no debe tomarse a la ligera.

Por otra parte, y siendo plenamente conscientes de las responsabilidades legales vigentes en cuanto a derechos de autor, el Gabinete de Prensa podrá vetar la publicación de cualquier página de la institución que muestre material que incumpla la legislación vigente en materia de derechos de autor, hasta que se posea documentación acreditada que demuestre que este material se ha adquirido legalmente. Este material incluye archivos de vídeo o audio, imágenes y texto, descargados directamente de Internet u otras fuentes.

Debido a esto, las páginas de la comunidad universitaria solamente podrán utilizar archivos cuyos derechos de autor partenezcan a los propios artífices de la web, que se hayan adquirido legalmente, o se trate de material “royalty free” o exentos de derechos (en ambos casos, se deberá poseer la documentación que certifique estas situaciones). En caso de no ser así, la Universidad de La Laguna declina toda responsabilidad jurídica en los artífices de estas webs.

El uso de imágenes en la web debe ser racional, y no debe primar la cantidad sobre la calidad. Debido a estándares de accesibilidad, el contenido de imágenes de la web no debe pesar demasiado en favor de una buena navegabilidad de la misma. Por este hecho, se establece que toda imagen publicada en cualquier página de la comunidad universitaria de la Universidad de La Laguna debe estar debidamente optimizada para su visualización web y, a la vez, mantener un compromiso de calidad para una correcta visualización. Actualmente, existen diversos programas que nos facilitan esta labor, otorgándonos la posibilidad de guardar las imágenes optimizadas para web. Asimismo, debemos hacer las correcciones de tamaño oportunas para que el tamaño de estas imágenes no sea mayor que el tamaño que ocuparán en una página web.

5 | ImágEnEs

5.1 | Imágenes. sobre el uso de imágenes.

5.2 | Imágenes. calidades.

anexo web: imágenes

Page 22: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

186

Los formatos más extendidos de imagen son GIF, JPG (o JPEG) y PNG:

Las imágenes animadas deben utilizarse con mucho cuidado porque:

- Ocupan bastante más espacio que las imágenes normales.- Distraen la atención del lector de la información útil y acaban cansando.- Dificultan el saber cuándo ha terminado de cargarse una página.- Si se tiene abierta la página web y se cambia a una ventana distinta con otraaplicación, el PC sigue procesando la repetición de la imagen, con lo que ralentizala velocidad de trabajo del ordenador.- Dificultan una impresión adecuada de la página.

5.2.1 | Imágenes. calidades. formatos de optimización.

- El formato GIF (Graphics Interchange Format) utiliza hasta un máximo de 256 colores y permite la posibilidad de definir fondos transparentes y animación de gráficos. Este formato utiliza un sistema de compresión (para reducir el tiempo de descarga) con el que no se pierde calidad. Por ello, es apropiado para imágenes pequeñas y con buena resolución y para dibujos con bordes bien definidos. Igualmente se utiliza para animaciones (gifs animados) pero la inserción del flash dentro del ámbito web ha provocado que este tipo de formatos esté cayendo en desuso.

- El formato JPG (Joint Photographic Experts Group) permite calidades de más de 256 colores, de hecho permite hasta 16 millones. Gracias a la rápida implementación de pantallas de alta resolución, es uno de los formatos más utilizados y extendidos. Tiene un sistema de compresión que hace que su transmisión por la red sea más rápida, por lo que es el formato más adecuado para imágenes grandes y fotografías.

- El formato PNG (Portable Network Graphics) fue desarrollado principalmente para solventar las deficiencias del formato GIF en cuanto a calidad de transparencias y uso de colores. Este formato combina la excelencia del formato JPG (utilización de tres canales, RGB) más la incorporación de un canal alfa (transparente), con lo cual es el de mayor calidad para web. La única desventaja es su peso. Debido a que su calidad es mayor, su formato comprimido es más pesado que el de una imagen en JPG, por lo que debe racionalizarse su uso. Habitualmente, es usado para animación web desarrollada en flash (extensión .swf)

5 | ImágEnEs

anexo web: Imágenes

Page 23: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

187

Otro de los aspectos que nos permite la web 2.0 es la posibilidad de incorporar contenido multimedia a nuestras páginas web. Este contenido abarca no solo a las imágenes, sino a también todo lo referente a vídeos, sonidos, contenido en flash, etc. que nuestra web necesite para una mejor resolución.

Al igual que ocurre con las imágenes, deberemos ser muy cuidadosos a la hora de implementar contenido multimedia a nuestra web, para evitar posibles demandas por violación de los derechos de autor. En este caso, la responsabilidad jurídica de la publicación de todo contenido multimedia presente en cada página web de la comunidad universitaria de la Universidad de La Laguna recae directamente en los diseñadores/desarrolladores. Éstos, deberán poseer la documentación que acredite y permita el uso de estos contenidos, y su publicación en entornos web. Al igual que ocurre con las imágenes, el Gabinete de Prensa podrá vetar la publicación de cualquier página de la institución que muestre material que incumpla la legislación vigente en materia de derechos de autor, hasta que se posea documentación acreditada que demuestre que este material se ha adquirido legalmente.

Gracias a las técnicas de Streaming (vídeo o audio que se visualizan mientras se cargan, lo que minimiza el tiempo de espera de los mismos), el vídeo forma una parte importante de los contenidos para web actuales. Con ellos podemos hacer reseñas de noticias, así como establecer vínculos con redes sociales.

En virtud de las posibilidades de incorporación de estos vídeos, podemos tener vídeo en nuestra web con solo implementar unas pocas líneas de código. Este desarrollo ha de ser realizado por los diseñadores y/o desarrolladores de la página web. Existen muchos canales donde se pueden encontrar estos vídeos (véase youtube, vimeo y otros) que incluso nos proporcionan el código necesario para que su implementación sea más rápida y fiable. Pero como ya hemos mencionado anteriormente, ha de tenerse un especial cuidado con los contenidos que se incluyan en las páginas vinculadas con la institución. Para la inclusión de estos vídeos, habrá de tenerse en cuenta las políticas de privacidad aplicadas por las páginas que los dispensan. En este caso, la Universidad de La Laguna declina toda responsabilidad jurídica sobre los desarrolladores/diseñadores de la página web. En ningún caso, este material podrá ser descargado de ninguna página vinculada con la comunidad universitaria de la Universidad de La Laguna. Solamente se podrán crear vínculos para su visualización y/o audición.

Es bastante común encontrar páginas web que incluyen efectos de sonido al pulsar un botón o accionar un enlace, pero se ha demostrado que la inclusión de efectos de audio ralentizan la carga de las páginas. Para evitar esto, la Universidad de La Laguna desaconseja su uso.

6 | contEnIdo multImEdIa

6.1 | contenido multimedia. vídeo y audio.

6.1.1 | contenido multimedia. vídeo y audio. Efectos de audio.

anexo web: Contenido multimedia

Page 24: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

188

En los últimos tiempos la herramienta flash ha evolucionado de manera considerable, hasta el punto en que a día de hoy se considera una de las más importantes herramientas de desarrollo web. Lo que antiguamente se utilizaba para crear animaciones y dar contenido dinámico a una página, se convierte en una potente herramienta de desarrollo total, donde podemos crear páginas web completas gracias a su lenguaje de programación action script, en una interfaz totalmente dinámica.

Sin embargo, también se ha de tener en cuenta que el uso de esta herramienta conlleva no respetar totalmente los estándares de accesibilidad y usabilidad promovidos por el World Wide web Consortium (W3C). Cuando los sitios web están diseñados pensando en la accesibilidad, todos los usuarios pueden acceder en condiciones de igualdad a los contenidos. Por ejemplo, cuando un sitio tiene un código XHTML semánticamente correcto, se proporciona un texto equivalente alternativo a las imágenes y a los enlaces se les da un nombre significativo. Esto permite a los usuarios ciegos utilizar lectores de pantalla o líneas Braille para acceder a los contenidos. Cuando los vídeos disponen de subtítulos, los usuarios con dificultades auditivas podrán entenderlos plenamente. Si los contenidos están escritos en un lenguaje sencillo e ilustrados con diagramas y animaciones, los usuarios con dislexia o problemas de aprendizaje están en mejores condiciones de entenderlos.

El problema de flash es que en la mayoría de estos casos los lectores de pantalla no pueden interpretar los contenidos en flash, puesto que el texto no se interpreta como tal, sino como parte de una película. Por esta razón, el uso de flash ha de quedar restringido únicamente para la promoción de eventos por medio de imágenes, nunca para la transmisión de información. Igualmente, se podrá utilizar elementos flash como recurso de estilo, para embellecer el contenido de una página web, pero este contenido nunca podrá ser de tipo informativo. En todo caso, los elementos flash insertados dentro de un sitio web que forme parte de la comunidad universitaria deberán tener un enlace a una página XHTML donde se informe debidamente al usuario de estas promociones y eventos. En este caso, se debe utilizar el texto “alt” para crear un enlace a este vínculo.

Con los últimos avances en reproductores de flash o “flash player” el diseñador o desarrollador ha de tener en cuenta que actualmente se puede crear texto html dentro de una película para que pueda ser interpretado por estos lectores de pantalla, pero, considerando que estos sistemas tardan en implementarse, aún no aconsejamos apropiado que se incluya información relevante dentro de una película en flash.

6.2 | contenido multimedia. uso de flash.

6 | contEnIdo multImEdIa

anexo web: Contenido multimedia

Page 25: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

189

Conforme avanza la web 2.0, han ido apareciendo tecnologías que simplifican y dotan de nuevos recursos a nuestra web. Gracias a estas tecnologías podemos establecer vínculos con redes sociales (del tipo Facebook, Twitter, etc) así como informar de últimas noticias por medio de los canales RSS feed, para un mejor seguimiento y divulgación de nuestras páginas web. Haremos a continuación una breve reseña de los recursos más populares.

Dentro de los estándares de la web 2.0, uno de los usos más extendidos es el uso del favicon. Un favicon, del inglés favorites icon (icono de favoritos), también conocido como icono de página, es una pequeña imagen de 16 x 16 pixels asociada con una página o sitio web en particular. Los navegadores gráficos suelen mostrar el favicon de la página visitada, si ésta lo posee, en la barra de direcciones y en el encabezado de la pestaña correspondiente. Asimismo se utilizan para identificar más fácilmente las páginas, presentándolas junto a sus respectivos títulos, en las listas de marcadores o favoritos, en los historiales de páginas visitadas y de navegación reciente.

El código Html para incluir un favicon dentro de nuestra web es el siguiente (dentro de la etiqueta <head>)

<link rel=”shortcut icon” href=”/favicon.png” />

La Universidad de La Laguna, para una mejor adecuación de los sitios web que forman parte de su comunidad universitaria a los recursos propios de la web 2.0, pone a disposición de los desarrolladores este favicon, que se puede encontrar en la página para recursos. Se recomienda su uso, aunque no es obligatorio.

Una fuente web (usualmente canal web o web feed) es un medio de redifusión de contenido web. Se utiliza para suministrar información actualizada frecuentemente a sus suscriptores. En su jerga, cuando una página web “redifunde” su contenido mediante una fuente web, los internautas pueden suscribirse a ella para estar informados de sus novedades. Los interesados pueden usar un programa “agregador” para acceder a sus fuentes suscritas desde un mismo lugar.

Son muy utilizados en los blogs o bitácoras de Internet, así como en prensa electrónica. Cada día hay más medios que utilizan este sistema de redifusión web. La gran difusión de este tipo de servicio web ha estimulado el interés en otros sectores que comienzan a ver en las fuentes web una forma efectiva de difundir y compartir información empresarial.

Las páginas de la comunidad de la Universidad de La Laguna, podrán ofrecer esta tecnología según lo consideren oportuno, utilizando para ello el icono correspondiente, que se puede descargar en la actual página de recursos gráficos de la institución.

7 | otros rEcursos

7.1 | otros recursos. favicon.

7.2 | otros recursos. canales rss.

anexo web: otros recursos

Page 26: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

190

Las redes sociales forman parte de los recursos de la web 2.0. Gracias a ellas, podemos compartir información presente en una página web, y divulgarla a nuestros contactos de una manera rápida y eficiente, con solo pulsar un botón. De esta manera, podemos establecer un vínculo de interacción con otros usuarios y promocionar eventos y demás actividades realizadas dentro de la comunidad universitaria. También que un usuario establezca un vínculo de unión con otros usuarios y la propia universidad.

La Universidad de La Laguna, siendo conocedora de las posibilidades de esta tecnología, ofrece el código en formato .txt para poder implementar este vínculo con las diferentes redes sociales dentro de los sitios web vinculados con la institución. De esta forma, este recurso pasa a formar parte de los elementos y herramientas a los que se pueden optar para un mejor desarrollo de los sitios web de la comunidad universitaria.

Este código .txt puede descargarse gratuitamente de la página de recursos presente en su actual portal web.

7.3 | otros recursos. redes sociales.

7 | otros rEcursos

anexo Web: otros recursos

Page 27: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

191

Un sistema de gestión de contenidos (en inglés content management system, abreviado CMS) es un programa que permite crear una estructura de soporte (framework) para la creación y administración de contenidos, principalmente en páginas web, por parte de los participantes.

Consiste en una interfaz que controla una o varias base de datos en las cuales podemos realizar modificaciones del contenido. El sistema permite manejar de manera independiente el contenido y el diseño. Así, es posible manejar el contenido y darle en cualquier momento un diseño distinto al sitio sin tener que darle formato al contenido de nuevo, además de permitir la fácil y controlada publicación en el sitio a varios editores. Un ejemplo clásico es el de editores que cargan el contenido al sistema y otro de nivel superior (directorio) que permite que estos contenidos sean visibles a todo el público (los aprueba).

Gracias a estos gestores de contenido, podemos tener una página web diseñada en minutos, con todas las aplicaciones web que estos soportes nos permitan sostener.

La Universidad de La Laguna es consciente de la importancia de estos gestores de contenido en el mundo web actual. Estos gestores de contenido como wordpress©, joomla©, etc, nos permiten crear un sitio web sin tener un conocimiento extenso acerca de la creación web.

En muchos casos, surge la idea por parte de algún sector de la universidad de crear un sitio web para promocionar un evento determinado, pero este sitio no se realiza, puesto que los organizadores del evento no suelen tener conocimientos acerca del diseño web. El uso de los gestores de contenido puede, en parte, solventar y aportar soluciones a este tipo de circunstancia.

Al tratarse de programas de código abierto (con lo cual su uso está permitido, sin ningún tipo de licencia comercial) podemos adquirir estos programas por medio de descargas directas en Internet, sin coste alguno para el usuario. Su sencilla instalación convierte estos gestores de contenido en una poderosa herramienta de difusión web.

Los gestores de contenido hacen una división muy efectiva entre contenido (contenidos generados por el usuario que forman parte de una base de datos) y continente (aspecto gráfico del sitio, usándose en plataformas CRM “plantillas” o “temas”). Ello hace que estas aplicaciones tengan una apariencia bien diseñada, en la que solo tenemos que incluir el contenido, puesto que el sitio ya viene prediseñado.

8 | gEstorEs dE contEnIdo

anexo web: Gestores de contenido

Page 28: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

192

Wordpress© es uno de los gestores de contenido más utilizados y alabados por la comunidad de internautas. Gracias a su famosa instalación de cinco minutos, podemos disponer de un sitio completo y funcionando en unos pocos pasos. Su panel de control es sencillo de utilizar y muy intuitivo, incluso para usuarios poco experimentados. Únicamente debemos ir a su dirección web http://www.wordpress.org y descargar allí el paquete de instalación.

Debido a la facilidad de su uso y a las enormes posibilidades que este CRM representa, hemos elegido esta aplicación para crear varias plantillas o temas, con la finalidad de que las páginas de cualquier miembro de la comunidad universitaria de la Universidad de La Laguna que utilicen la plataforma wordpress, puedan utilizar estos recursos gráficos, que a su vez están totalmente integrados con la propia imagen gráfica de la Universidad. Esto supone que el usuario pueda cargar de contenido la página web con el evento que quiera promocionar respetando siempre, los estándares de la identidad visual de la marca.Estas plantillas, así como otros recursos, están disponibles en la página de recursos del portal de la Universidad de La Laguna: http://www.ull.es/imagencorporativa/

La plataforma Jommla, al igual que wordpress, es una plataforma de código abierto basada en linux donde igualmente podemos crear un sitio web completo y administrarlo fácilmente, sin tener que saber programación. La Universidad de La Laguna autoriza su uso siempre y cuando se respeten los estándares en la identidad visual presentes en este anexo.

Al igual que Wordpress y Joomla existen otras plataformas CRM que ofrecen una gran variación de aplicaciones y contenidos. Igualmente, la Universidad de La Laguna autoriza su uso siempre y cuando se respeten las normas de identidad visual presentes en el presente documento. Por su parte, el Gabinete de Prensa podrá vetar la publicación de cualquier página de la institución que incumpla de alguna manera estas normas de identidad, o que vulnere de alguna manera su identidad como marca.

8.1 | gestores de contenido. Plataforma Wordpress©.

8.2 | gestores de contenido. Plataforma Joomla.

8.3 | gestores de contenido. otras Plataformas crm.

8 | gEstorEs dE contEnIdo

anexo web: Gestores de contenido

Page 29: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

193

Como todo documento orientado al público, todas las páginas pertenecientes a la comunidad universitaria están sujetas a las normas de estilo que deben aplicarse a todo documento escrito. Debido esto, conviene revisar los textos que luego vayan a publicarse, para que la información se adecúe al máximo con el organismo que la expone. Para ello, proponemos una serie de normas generales de obligado cumplimiento a la hora de generar contenidos de tipo escrito.

– La información ha de estar siempre orientada al usuario. Lo irrelevante debe desaparecer.

– Es conveniente la identificación de la persona de contacto en cada información, ya que esto pone a disposición del lector la posibilidad de ampliar la información.

– Hay que evitar el lenguaje coloquial, las frases hechas y las formas jergales.

– Es imprescindible la constante actualización de los contenidos.

– Los enlaces deben ser actualizados y revisados periódicamente.

– Hay que prestar especial atención al uso de la propiedad intelectual de los documentos. Es conveniente que los textos sean de nuestra propiedad y, en caso contrario, hay que solicitar los correspondientes permisos a sus autores.

– Si la página no está preparada es mejor no colgarla. Causa un efecto negativo en el usuario el tan extendido ‘en construcción’.

– Es conveniente acompañar los textos con programas de descarga y también con elementos adicionales al propio texto, como enlaces, documentos relacionados, audio, vídeo, gráficos, etc., siempre que se considere de interés.

– Las páginas que cuelguen del servidor de la Universidad de La Laguna deben ser perfectamente identificadas como tales.

– El uso de lenguaje malsonante, sexista, xenófobo o que atente contra la dignidad de las personas está totalmente prohibido, y su uso puede conllevar a la retirada de la página web del sitio de la Universidad de La Laguna.

9 | normas dE EstIlo

9.1 | normas de estilo. normas generales.

anxo web: normas de estilo

Page 30: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

194

tamaño del texto. - Los párrafos no deben superar las cinco líneas, como norma general. Los párrafos excesivamente extensos pueden dificultar su lectura y comprensión. Ante todo, debe prevalecer el blanco, el espacio libre. Además, un texto no puede alargarse indefinidamente, por lo que no es recomendable que la barra de desplazamiento avance más de página y media. Lo recomendable es que no se supere la pantalla.

tiempo presente y verbos en activo. - El lector debe encontrar la información requerida de forma lógica y sencilla. Se interesará por los contenidos si éstos están escritos correctamente. En este punto hay que mencionar que el lenguaje, por tanto, juega una función importantísima a la hora de atraer la atención de los usuarios. Ha de escribirse con claridad y precisión. Como norma general, se recomienda el uso del tiempo presente en los verbos y de su forma activa. El uso de la voz pasiva, de gerundios y de formas compuestas debe limitarse a los casos que así lo exijan.

Frases completas. - Los titulares o cabeceras de una información han de escribirse en toda su extensión, sin omitir preposiciones o artículos que, a nuestro juicio, pueden obviarse pero que, en realidad, dificultan su lectura. Deben responder en cualquier caso al esquema de una oración simple (sujeto-verbo-complemento). Por ejemplo: Se prefiere Ayudas de la ULL en lugar de Ayudas ULL; Calendario de matrícula en vez de Calendario matrícula.

enlaces. - El uso de los enlaces en la web permite no tener que explicarlo todo, facilita el acceso directo a otras páginas y reduce, por tanto, la extensión de los textos propios. En cualquier caso, tampoco deben proporcionarse de forma irracional consiguiendo abrumar al usuario.Los enlaces en la web de la Universidad de La Laguna son fácilmente identificables, ya que al pasar el cursor por encima cambian de color. Por tanto, hay que evitar las fórmulas de aviso ‘pinche aquí’, ‘pulse aquí’ o similares, pues, como se dijo, hemos optado por una solución bastante intuitiva que no precisa mayor explicación. Tampoco es necesario el subrayado.

páginas con error. - Si una página da error o está momentáneamente fuera de servicio, hay que explicarlo y añadir además cuándo estará de nuevo en funcionamiento. Es muy perjudicial para la correcta comunicación intentar entrar en un sitio y no conseguirlo.

9.2 | normas de estilo. Edición de textos.

9 | normas dE EstIlo

anexo web: normas de estilo

Page 31: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

195

Uso de la letra cursiva:

– En las expresiones en otro idioma: “El boom de la literatura hispanoamericana”; “una comisión ad hoc estudiará el problema”.

– Los vocablos de creación reciente y de uso restringido u ocasional: “La isla está llena de guiris.”

– Las palabras propias de una jerga: “El director del periódico ha mandado un fijo al periodista de cierre.”

– Los apodos, sobrenombres y denominaciones familiares: Lola Flores, la Faraona.

– Los nombres de animales: La perra se llama Luna.

– Las denominaciones específicas de las unidades de vehículos, trenes o aviones: El Boeing 747 Palma de Mallorca salió con retraso.

– Las denominaciones genéricas de obras y productos cuando provienen del nombre del creador: Es uno de los coleccionistas que más Velázquez tiene.

– Las palabras de uso corriente empleadas con un significado especial, irónico o crítico.

– Los títulos de libros, obras de teatro, canciones, congresos, documentos, publicaciones, conferencias, películas, espectáculos musicales y programas audiovisuales.

– No deben escribirse en cursiva las citas textuales, que van en comillas si son cortas, o en párrafo aparte con doble sangrado si son largas, ni las denominaciones de planes, operaciones o proyectos, que se escriben con mayúscula inicial.

9.3.1 | normas de estilo. Elementos tipográficos. cursiva.

9 | normas dE EstIlo

anexo web: normas de estilo

9.3 | normas de estilo. Elementos tipográficos.

– Se trata de un elemento tipográfico utilizado para destacar títulos y encabezamientos cuyo uso debe limitarse al máximo. También se emplea en textos con fines didácticos o de carácter divulgativo, con el objeto de resaltar algunas ideas.

– No es conveniente utilizar la negrita en más de dos o tres palabras por párrafo, ya que su exceso haría inútil su uso.

9.3.2 | normas de estilo. Elementos tipográficos. negrita.

Page 32: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

196

– El mal uso de las comas puede cambiar el sentido de una frase. Por ejemplo: El profesor titular de Geografía Humana de la Universidad Complutense de Madrid, Vicente Martínez, dijo ayer que los fenómenos migratorios deben estudiarse desde una perspectiva interdisciplinar. Escrito así, pudiera parecer que Vicente Martínez es el único profesor titular de Geografía Humana que tiene esa universidad. Cuando, efectivamente el cargo es único en la persona que lo ostenta, las comas están plenamente justificadas. Por ejemplo: El rector de la Universidad de La Laguna, Eduardo Doménech, afirmó ayer en el Consejo de Gobierno que está intentando solucionar el pago de los complementos retributivos.

– Existe cierta tendencia a separar el sujeto del verbo en activo mediante comas, lo que es un error. Por ejemplo: La Universidad, contará con un nuevo presupuesto en enero.

Existen diferentes criterios de utilización según la fuente consultada. Como criterio unificador pueden recomendarse las normas de la Real Academia Española. En general, se produce un uso abusivo de la mayúscula, como si con ella se pretendiera dotar a las palabras de mayor relevancia o singularidad, lo que produce una utilización absolutamente arbitraria. Como norma general podría decirse que se escribe con mayúscula:

– La primera palabra de un escrito y las que vayan después de punto, así como la que va después de dos puntos en el encabezamiento de una carta o de una cita textual.

– Los nombres propios.

– Los títulos y nombres de dignidad, los sobrenombres o apodos (el Papa, el Rey, el Duque de Olivares).

– Los tratamientos, especialmente si están en abreviaturas (Sr.D., U., V.S.). Si se escriben con todas sus letras, la tendencia es utilizar la minúscula (señor don, usted).

- Los nombres de instituciones o entidades (Museo del Prado, Universidad de La Laguna). Cuando estos nombres son genéricos se utiliza la minúscula (las universidades, los ministerios, los ayuntamientos). Los nombres de cargos personales suelen escribirse con minúscula (el ministro de Asuntos Exteriores, el rector de la Universidad Complutense, el alcalde de La Orotava).

- Los sustantivos o adjetivos de cualquier obra (Diccionario de Dudas y Dificultadesde la Lengua Española o Diccionario de dudas y dificultades de la lengua española,Historia de la Literatura Española o Historia de la literatura española).

9.4.1 | normas de estilo. recomendaciones. uso de comas.

9.4.2 | normas de estilo. recomendaciones. uso de mayúsculas.

9 | normas dE EstIlo

anexo web: normas de estilo

9.4 | normas de estilo. recomendaciones.

Page 33: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

197

– Se recomienda que los nombres de las estaciones del año, días de la semana y meses del año vayan siempre con minúscula.

– Es obligatorio el uso de la tilde en las mayúsculas cuando lo exijan las reglas generales de acentuación.

Deben evitarse, ya que por lo general solo resultan claras para quien las escribe. Su uso debe restringirse por tanto a textos especializados dirigidos a personas que se desenvuelven en el mismo ámbito. Las abreviaturas solo son aceptables para sustituir a expresiones de uso frecuente, pero no para suplantar automáticamente el término original. No existen reglas fijas que determinen cuáles son las abreviaturas correctas para una u otra palabra, aunque sí hay normas generales para formarlas. Es recomendable, antes que los manuales de estilo, la consulta de la Real Academia Española (Vid. op. cit., Capítulo VI y Apéndice I):

Más información en:

– http://publications.eu.int/code/es/es-4100400es.htm (CU)

– http://www.estudiantes.elpais.es/EPE2002/libroestilo/apartado09_001.htm (El País)

– http://www.estudiantes.elpais.es/EPE2002/libroestilo/apartado09_002.htm (El País)

9.4.3 | normas de estilo. recomendaciones. abreviaturas.

9 | normas dE EstIlo

anexo web: normas de estilo

Page 34: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

198

Los acrónimos se forman por fusión de letras o sílabas extremas, iniciales o finales, de algunas o todas las palabras de una expresión (docudrama, por documento dramático). Se escriben con minúscula, salvo la letra inicial cuando se trata de organismos oficiales (Insalud, por Instituto Nacional de la Salud).

Las siglas son términos creados exclusivamente con la letra inicial de sustantivos, verbos y adjetivos de una denominación (ONU, por Organización de Naciones Unidas). Existen también las formas siglares, que son abreviaciones caracterizadas por tener todas las iniciales (Icona, por Instituto Nacional para la Conservación de la Naturaleza), contienen letras no iniciales (Renfe, por Red Nacional de los Ferrocarriles Españoles) y porque participan en su formación palabras que no son sustantivos, verbos, adjetivos o adverbios (Cepal, por Comisión Económica para América Latina).

más información:

Real Academia de la Lengua:http://publications.eu.int/code/es/es-4100500es.htm (Comisión Europea)

9.4.4 | normas de estilo. recomendaciones. siglas y acrónimos.

9 | normas dE EstIlo

anexo web: normas de estilo

Page 35: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

199

Los treinta primeros números cardinales que constan de una sola palabra se escribirán con letras, excepto si se refieren a fechas. Los siguientes se escribirán con cifras (Las víctimas se elevan a 142) o con palabras y cifras (Se calculan en 182 mil los afectados por el terremoto).

El sistema ordinal, que generalmente se presta a confusiones, es el siguiente: 1º primero, 2º segundo....10º décimo, 11º undécimo, 12º duodécimo, 13º decimotercero....20º vigésimo, 21º vigésimo primero (si lo escibes junto tendrás que quitar la tilde)...30º trigésimo, 31º trigésimo primero (íd.), 40º cuadragésimo, 50º quincuagésimo, 60º sexagésimo, 70º septuagésimo, 80º octogésimo, 90º nonagésimo, 100º centésimo, 200º ducentésimo, 300º tricentésimo, 400º cuadringentésimo, 500º quingentésimo, 600º sexcentésimo, 700º septingentésimo, 800ºoctingentésimo, 900º noningentésimo, 1000º milésimo.

Los cardinales pueden funcionar como ordinales a partir del 10º: capítulo décimo o capítulo diez, el sexagésimo aniversario o el sesenta aniversario.

Se tiende a utilizar los ordinales entre el 1º y el 20º (En la décimotercera etapa ciclista; el duodécimo aniversario) y los cardinales a partir del 21º (La veintiséis edición del libro; La setenta y cinco promoción de alumnos).

Es un grave error utilizar los partitivos en lugar de los ordinales y decir, por ejemplo, la onceava edición de un libro o la dieciochava sanción del equipo.

Más información:

Cardinales:http://www.estudiantes.elpais.es/EPE2002/libroestilo/apartado10_001.htm (El País)http://www.estudiantes.elpais.es/EPE2002/libroestilo/apartado10_003.htm (El País)

Ordinales:http://publications.eu.int/code/es/es-4100302es.htm (CU)http://www.estudiantes.elpais.es/EPE2002/libroestilo/apartado10_005.htm (El País)http://www.estudiantes.elpais.es/EPE2002/libroestilo/apartado10_008.htm (El País)

9.4.5 | normas de estilo. recomendaciones. números cardinales y ordinales.

9 | normas dE EstIlo

anexo web: normas de estilo

Page 36: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

200

FUENTES DOCUMENTALES

Fuentes documentales

Page 37: Anexo web-formato-descarga-web[1]

Manual de IdentIdad vIsual CorporatIva

Universidad de La Laguna

201

• Hodgson Torres, María Luisa. Proyecto de Investigación: Estudio y diseño del

Escudo y Sello de la Universidad de La Laguna (La Laguna, 1991-92).

• Pérez Jiménez, Mauricio. Manual de normas de Identidad Visual Corporativa de

la Universidad de La Laguna. I Edición (Julio de 2005).

Fuentes documentales