Maqueta Estandarización

El header de arriba tiene un padding más grande, 15vh a cada lado, para que las imágenes se vean mejor. Sugiero luego poner un menú específico bajo el header en secciones tales como Acerca de, Fondos, etc. para que sea más fácil navegar. Bajo el menú puede ir un parráfo explicativo de la sección.

Tipografía

Títulos y sub-titulos

En los sub-títulos de página, para ordenar, poner la línea bajo los títulos en cada sección, como se muestra en esta página. 

Al final de cada sección, usar divisor para ordenar mejor los contenidos (línea gris). 

Título h1

Título h2

Título h3

Título h4

Título h5
Título h6

Parráfos

Sugiero no hacer parráfos demasiado anchos (no full width).

Font: Dm Sans
Size: 15px
Espaciado: 1.2px
Interlineado: 1.7 em

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Citas

Font: Dm Sans Italic
Size: 15px
Espaciado: 1.2px
Interlineado: 1.7 em
Estilo: Italic

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure.”

Destacados

El texto destacado entro de una página deberá ir en bold.

El texto interactivo deberá ir en bold y subrayado. 

“Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure.”

Componentes

Botones

Los botones pueden usarse para mostrar al usuario opciones de acciones y asignarle a estas acciones una jerarquía clara.

La acción o la página enlazada se muestra a través del texto del botón, por un ícono o la combinación de ambas cosas.

Todos los botones deben tener un pequeño efecto visual al ser accionados.

El tamaño de los botones depende del font de base.

No deben usarse botones con palabras como muy cortas, como”ir”, sino más bien descripciones más específicas como “Ver más” o “Acerca de”.

Los botones son ya sea negros o blancos y pueden ser agrupados.

Small 14 px

Medium 15px
Large 16px

Botones Secundarios

 

Botones de Texto

 

*** Nota, en edición veo el ícono, en live no. El rollover se ve mal y no sé porqué.

Acordiones

Los acordiones y toggles se usarán para ordenar contenido que es muy extenso, haciendo más fácil la lectura y navegación para el usuario. Ideal para preguntas frecuentes, bases, denuncias y sanciones, entre otros. 

¿Cómo realizar una denuncia?

> Su denuncia debe ser realizada dentro de un plazo máximo de 10 días a contar de la fecha de emisión del programa de TV.

> Tanto para realizar una denuncia como para obtener información sobre el estado de tramitación de su denuncia, usted debe registrarse como usuario.

> Si la denuncia reúne los requisitos mínimos para acogerla a tramitación, los equipos profesionales del CNTV realizan un informe técnico del programa que luego es conocido por los miembros del Consejo, quienes resuelven, en definitiva, si la denuncia amerita o no la formulación de un cargo.

> En caso de que se decida formular cargos, el concesionario (canal de televisión) o permisionario (Tv Pago) tiene el plazo de 5 días para presentar sus descargos. Vencido este plazo, con o sin descargos, el Consejo resuelve si aplica una sanción o si acepta los descargos del canal. La sanción puede consistir en una amonestación, una multa (no inferior a 20 ni superior a 1.000 UTM), suspensión de las transmisiones o caducidad de la concesión.

> La resolución que imponga una sanción a un concesionario o permisionario es apelable ante la Corte de Apelaciones de Santiago y la que declare la caducidad de una concesión es apelable ante la Corte Suprema.

* En caso de que usted no cuente con medios para ingresar su denuncia a través de nuestro sitio web, puede enviarla a través de correo normal, o acercarse a nuestras oficinas y realizarla por escrito en persona. En ambos casos, debe tener toda la información de programa: día y hora de emisión, razones, todo en el mismo plazo máximo de 10 días a contar de la fecha de emisión del programa.

Para ello, es necesario que nos deje o adjunte los antecedentes necesarios para poder contactarlo de vuelta.

Usted debe acceder al formulario de denuncias. Luego de registrar sus datos personales, debe especificar el nombre del programa, canal, día y horario de emisión identificando- los contenidos que usted señala que vulnerarían la normativa de televisión.

¿Cómo realizar una denuncia?

> Su denuncia debe ser realizada dentro de un plazo máximo de 10 días a contar de la fecha de emisión del programa de TV.

> Tanto para realizar una denuncia como para obtener información sobre el estado de tramitación de su denuncia, usted debe registrarse como usuario.

> Si la denuncia reúne los requisitos mínimos para acogerla a tramitación, los equipos profesionales del CNTV realizan un informe técnico del programa que luego es conocido por los miembros del Consejo, quienes resuelven, en definitiva, si la denuncia amerita o no la formulación de un cargo.

> En caso de que se decida formular cargos, el concesionario (canal de televisión) o permisionario (Tv Pago) tiene el plazo de 5 días para presentar sus descargos. Vencido este plazo, con o sin descargos, el Consejo resuelve si aplica una sanción o si acepta los descargos del canal. La sanción puede consistir en una amonestación, una multa (no inferior a 20 ni superior a 1.000 UTM), suspensión de las transmisiones o caducidad de la concesión.

> La resolución que imponga una sanción a un concesionario o permisionario es apelable ante la Corte de Apelaciones de Santiago y la que declare la caducidad de una concesión es apelable ante la Corte Suprema.

* En caso de que usted no cuente con medios para ingresar su denuncia a través de nuestro sitio web, puede enviarla a través de correo normal, o acercarse a nuestras oficinas y realizarla por escrito en persona. En ambos casos, debe tener toda la información de programa: día y hora de emisión, razones, todo en el mismo plazo máximo de 10 días a contar de la fecha de emisión del programa.

Para ello, es necesario que nos deje o adjunte los antecedentes necesarios para poder contactarlo de vuelta.

Usted debe acceder al formulario de denuncias. Luego de registrar sus datos personales, debe especificar el nombre del programa, canal, día y horario de emisión identificando- los contenidos que usted señala que vulnerarían la normativa de televisión.

Iconos

Los iconos indican información e interacciones de una forma simple y directa. Su estilo se deriva de dibujos simplificados y técnicos.

Los iconos deben tener la menos cantidad de elementos posible. Son creados a través de una linea constante de contorno que tiene un degradé, sin relleno. Se alternar ángulos rector con esquinas redondeadas.

Cada ícono tiene un significado asignado que se usa sólo en ese contexto.

Los iconos de contenido representan cosas y hechos, como TV Digital, Estudios, Fondos.
Los iconos de archivos representan tipos de archivos, tales como PDF, excel, word, zip.
icono excelicono word

Los iconos de sistema representan interacciones y comandos, por ejemplo, salvar, bajar (download), play, etc. Estos iconos debieran tener una linea periférica circular.

Los iconos de los medios sociales difieren del resto. Los logos e iconos de las plataformas son imágenes rellenas y pueden usarse de de colores diferentes., según lo que corresponda a cada plataforma.

Contadores

Si hay más de un contador, éstos estarán uno al lado del otro, sin borde ni destacado.

Si es un solo contador, éste tendrá una caja alrededor para destacarlo.

Total de denuncias tramitadas este año

Total de denuncias tramitadas este año

Total de sanciones tramitadas este año

Tablas

Las tablas sirven como proveer un despliegue estructurado de la información.

Pueden contener texto e imágenes así como acciones y otros componentes.

La cabecera de las tablas estará destacada por una línea naranja más gruesa. Las palabras de la cabecera estarán escritas en mayúscula.

Canal / Cable Operador Programa Nº Denuncias Contenidos Denunciados Denunciantes Afirman
Mega Mucho Gusto 02/09 316 Denunciantes afirman que “el programa aborda el supuesto desabastecimiento que se estaría ocasionando en el sur del país por el paro de camioneros, donde utilizan y muestran imágenes de supermercados con góndolas vacías, las que serían de Inglaterra, ya que se aprecia que los precios están en libras esterlinas y hay carteles en inglés”. “Se emite información falsa. El programa infunde terror a través del sensacionalismo. Esto genera desinformación y desconfianza”.
Todos los servicios Vamos Chilenos 18, 19 Y 20/09 141 Televidentes denuncian que “durante la transmisión del evento para juntar dinero para los ancianos se mostró propaganda política de un solo sector, estando aún fuera de los plazos establecidos en la ley, lo que atenta contra la democracia. Aseguran que se “realizó proselitismo político por la opción Apruebo. Varios artistas mostraron camisetas con la opción del Apruebo, aprovechándose de la masividad de un evento benéfico”.
TVN Mírame,lo que nunca dije 03/09 65 A ocho años del asesinato de Daniel Zamudio, se realiza un encuentro entre el padre de Daniel Zamudio, Ivan Zamudio y uno de los asesinos, Fabián Mora. Con respecto a lo anterior, denunciantes afirman que: • “Se revictimiza a la familia de Daniel”. • “Sensacionalismo, morbo, exacerbación de prejuicios hacia la comunidad LGBTI mediante declaraciones homofóbicas que se contextualizan”. • “Se muestran imágenes crudas del cuerpo de Daniel Zamudio y se detalla cómo fue asesinado”. • “Se hacen ‘revelaciones’ que dañan la imagen de Daniel Zamudio Vera, al aseverar que ‘le habría corrido mano en varias oportunidades’, así como hacer comentarios peyorativos sobre su orientación sexual; reconoce haber alterado su declaración, creando un enorme riesgo que el juicio pueda ser anulado, y quedar libres de toda culpa sus homicidas. • “Utilización morbosa de personas psicológicamente dañadas”.
La Red Mentiras Verdaderas 08/09 21 Televidentes denuncian lo siguiente sobre entrevista a Héctor Maturana y a César Bunster, miembros del FPMR, en el contexto del cumplimiento de los 34 años del atentado en contra Augusto Pinochet: • “Apología a la violencia entrevistando a 2 participantes directos en el ataque terrorista donde mataron a 5 personas de su escolta”. • “Es una falta de respeto hacia las familias afectadas”. • “Entrevistan a dos asesinos tratandolos como héroes e incitan al odio y promueven la violencia”.

Navegación

Listados

 

Listas en párrafos

  • item 1
  • item 2
  • item 3
  • item 4
  • item 5

Título divisor

El título divisor se usará para facilitar el orden y la navegación de una página que presenta mucha información, para ordenar años, categorías o similares.

Consiste de una barra negra con el título en blanco y centrado.

Título sección aqui

Destacados para áreas

En el caso de que un área del sitio sea extensa, se recomienda, además del sub-menú de navegación, poner al final de la página (pre-pie de página), una sección de destacados para seguir la navegación.

Título sección

Descripción corta
de la sección

Título Sección

Descripción corta
de la sección

s

Título Sección

Descripción corta
de la sección

CTA

Los “CTA” , Call to Action, (llamado a la acción), ayudan al usuario a distinguir las acciones que debe tomar dentro de la página.

Un buen uso es para la invitación a acciones tales como denunciar.

Aprende qué y cómo denunciar

Qué hacer si consideras que algún programa presenta contenidos inapropiados u ofensivos con relación a las normas sobre contenidos de televisión.

Organización de Contenidos

Para áreas de la web con mucho texto y contenido extenso, se aconseja ordenar este contenido visualmente. Se recomienda el apoyo de imágenes, columnas y textos introductivos.

Secciones áreas

Secciones para ordenar el contenidos de áreas extensas, tales como:

1. Texto introductorio general e introducciones específicas a contenidos posteriores. Ideal para áreas tales como ‘Qué es CNTV’, ‘Fondos’, etc.

2. Dentro de la sección, destacados con imágenes y textos para facilitar la navegación y entendimiento del contenido.

Subtitulo

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur tincidunt mollis ante non volutpat.
g

Subtitulo

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur tincidunt mollis ante non volutpat.
1

Subtitulo

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur tincidunt mollis ante non volutpat.

Título Sección

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur tincidunt mollis ante non volutpat. Nam consequat diam nec leo rutrum tempus. Nulla accumsan eros nec sem tempus scelerisque. Morbi tincidunt risus magna, posuere lobortis felis. Donec at vehicula risus. Cras vel sollicitudin ipsum. Etiam tincidunt placerat enim, a rhoncus eros sodales ut.

Nam consequat diam nec leo rutrum tempus. Nulla accumsan eros nec sem tempus scelerisque. Morbi tincidunt risus magna, posuere lobortis felis. Donec at vehicula risus. Cras vel sollicitudin ipsum. Etiam tincidunt placerat enim, a rhoncus eros sodales ut.

Título Sección

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur tincidunt mollis ante non volutpat. Nam consequat diam nec leo rutrum tempus. Nulla accumsan eros nec sem tempus scelerisque. Morbi tincidunt risus magna, posuere lobortis felis.

Título Sección

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur tincidunt mollis ante non volutpat. Nam consequat diam nec leo rutrum tempus. Nulla accumsan eros nec sem tempus scelerisque.

Fotografías, Ilustraciones y vídeos

El uso de elementos gráficos ayuda a poner la atención donde queremos que esté, a hacer más fácil la lectura del contenido y el entendimiento de éste.

Fotografías

Las fotografías son poderosas. Expresan el contenido y dan autenticidad.

En lo posible, usar imágenes grandes, adecuadas al contenidos. Si las fotografías están muy pixeleadas, buscar otra equivalente o usar una ilustración.

En el caso de no tener una fotografías específica de la situación del contenido, buscar una que lo represente contextualmente. Por ejemplo, en ganadores de Fondos, no están las fotos específicas de los ganadores de cada año. En este caso, en los años que no se tiene la fotografía de los ganadores, se debiera usar una imagen conceptual.

Ilustraciones

El uso de ilustraciones consigue dar un aspecto más personal al sitio, y, por lo tanto, crea una conexión con usuario, al incluir detalles y simplificar conceptos.

Implantan un elemento humano lúdico y sirven de apoyo para sintetizar ideas complejas.

Las ilustraciones deben tener la paleta de colores del Manual de Marca.

Denuncia

Videos

Los vídeos mantienen al usuario más tiempo en la web, y los involucran con el contenido. Mantienen a la audiencia interesada, son rápidos y convenientes para explicar conceptos.