SlideShare una empresa de Scribd logo
1 de 15
RETICULAS PARA PANTALLAS En diseño, las retículas sirven de guía para el posicionamiento de los módulos y de esta manera, generar nuevas direcciones y consecuentemente un diseño. TIPOS DE RETICULAS Bueno, para empezar ¿qué es una retícula? La retícula en el diseño es una guía que nos sirve para distribuir los elementos y la alineación, todas sin excepción cuentan con las mismas partes básicas sólo que algunas alcanzan cierta complejidad de acuerdo a las necesidades de la información, también estas se pueden combinar.
Manuscrita La más sencilla de todas, se usa para textos largos porque están contenidos en un bloque grande delimitado por un margen y tiene un espacio para los títulos y la numeración. El ejemplo es el más cercano que encontré, pero creo que en si no se siguió una retícula...No muy recomendable para utilizarlo en una web, es difícil seguir la lectura y lo hace tedioso.
Columnas Es muy flexible y se pueden separar distintos tipos de información, es unas de las retículas más utilizadas en revistas y también en el diseño web, porque puede utilizarse varias columnas para texto amplio e imágenes grandes y también pequeñas. En el primer ejemplo utiliza de columnas y también por módulos, es muy agradable por qué se ve más limpio, atractivo y los elementos están claramente diferenciados.
Modular Útil cuando es algo muy complejo, es parecida a la de columnas solo que las divide en filas creando así una matriz de celdas que se denominan módulos, en cada uno de ellos se puede colocar información o en varios agrupados. Son flexibles y precisos pero en exceso puede crear confusión.En esta web utilizaron este tipo de retícula para hacer un menú de los juegos que tienen, con muy buenos resultados.
Jerárquica Esta la he visto que la ocupan en gran medida en el diseño web, la información se organiza de forma intuitiva en proporción a los elementos y no en intervalos regulares y repetidos como sucede con las otras, es por eso que es muy variable.
Jerárquica La retícula que está en voga es la jerárquica porque podemos acomodar la información por orden de importancia, generalmente poniendo lo más importante a manera de resumen o por novedad en un recuadro de forma llamativa que abarque todo el espacio y los menús o palabras clave en otras columnas de menor tamaño y alineación.
El diseño web va más allá del diseño tradicional pues existen muchos limitadores relacionados con el medio donde se presentan las páginas: internet. conocemos las características fundamentales del diseño en la web.
Otro aspecto a tener en cuenta es que las páginas web son visualizadas en unas aplicaciones específicas, los navegadores web, que imponen grandes limitaciones al diseño de las mismas. la ventana de un navegador es eminentemente rectangular, con unas medidas concretas (dadas por la resolución empleada por el usuario en su monitor) y con unas capacidades de interpretación de colores que varían mucho según el ordenador usado, el sistema operativo, el monitor y la tarjeta gráfica.
TIPOGRAFIA La elección y el uso de la tipografía es quizás el elemento más difícil dentro del proceso de diseño. La tipografía asume un doble papel tanto como comunicador visual y como verbal la tipografía nos ayuda a distinguir visualmente grupo de textos y de esta manera ayudan al usuario a predecir qué tipo de información encontraran en ciertas áreas de la pagina. Lo que hacemos al diseñar páginas web es básicamente “pintar” el texto, no solo aplicando color al texto sino al combinarlo con otros bloques de texto y con el fondo de la pagina. El ojo viajara de bloque en bloque a lo largo de la pagina y es  gracia a estos bloques tipográficos que podemos alcanzar una buena jerarquía.
ELECCIÓN DE LA PALETA DE FUENTES
TAMAÑO DE LAS FUENTES El tamaño de la letra debe elegirse teniendo en cuenta la naturaleza de la composición y la distancia a la que se va a leer.
Interlineado
Alineación de los textos
COLOR EN LA WEB
COLOR A la hora de aplicar colores deberemos tener en cuenta una serie de reglas. No hay que olvidar que el medio sobre el que trabajamos será la pantalla, y en éste sentido podemos tener la certeza de que en cada ordenador se verá un poco diferente. A nivel de usabilidad y accesibilidad lo más importante será tener cuidado con el contraste entre el cuerpo de letra y el fondo.

Más contenido relacionado

Destacado (7)

Retículas Para Pantalla
Retículas Para PantallaRetículas Para Pantalla
Retículas Para Pantalla
 
Reticulas para pantalla
Reticulas para pantallaReticulas para pantalla
Reticulas para pantalla
 
Elementos que componen la página viii
Elementos que componen la página viiiElementos que componen la página viii
Elementos que componen la página viii
 
Diseño editorial
Diseño editorialDiseño editorial
Diseño editorial
 
InDesign y el diseño de retículas
InDesign y el diseño de retículasInDesign y el diseño de retículas
InDesign y el diseño de retículas
 
Diseño editorial
Diseño editorialDiseño editorial
Diseño editorial
 
Elementos en el Mensaje Publicitario
Elementos en el Mensaje PublicitarioElementos en el Mensaje Publicitario
Elementos en el Mensaje Publicitario
 

Similar a Presentacion power reticulas para pantallas

Retículas para pantallas
Retículas para pantallasRetículas para pantallas
Retículas para pantallas
Sebastian Mora
 
Principios
PrincipiosPrincipios
Principios
niko a
 
Importancia del diseno_en_web (2)
Importancia del diseno_en_web (2)Importancia del diseno_en_web (2)
Importancia del diseno_en_web (2)
alexpulupa
 
OBJETIVOS DE DREAMWEAVER
OBJETIVOS DE DREAMWEAVEROBJETIVOS DE DREAMWEAVER
OBJETIVOS DE DREAMWEAVER
Antonio Galicia
 

Similar a Presentacion power reticulas para pantallas (20)

Reticulas de diseño
Reticulas de diseñoReticulas de diseño
Reticulas de diseño
 
Importancia del diseno en la web
Importancia del diseno en la webImportancia del diseno en la web
Importancia del diseno en la web
 
DiseñO Web
DiseñO WebDiseñO Web
DiseñO Web
 
Investigaacion
InvestigaacionInvestigaacion
Investigaacion
 
Retículas para pantallas
Retículas para pantallasRetículas para pantallas
Retículas para pantallas
 
Principios elementales de maquetación WEB
Principios elementales de maquetación WEBPrincipios elementales de maquetación WEB
Principios elementales de maquetación WEB
 
Elaboración de documentos web mediante lenguajes de marcas
Elaboración de documentos web mediante lenguajes de marcasElaboración de documentos web mediante lenguajes de marcas
Elaboración de documentos web mediante lenguajes de marcas
 
Principios
PrincipiosPrincipios
Principios
 
Framework de programacion de paginas web
Framework de programacion de paginas webFramework de programacion de paginas web
Framework de programacion de paginas web
 
Trabajo de-investigacion
Trabajo de-investigacionTrabajo de-investigacion
Trabajo de-investigacion
 
Importancia del diseno_en_web (2)
Importancia del diseno_en_web (2)Importancia del diseno_en_web (2)
Importancia del diseno_en_web (2)
 
Alberto
AlbertoAlberto
Alberto
 
Alberto
AlbertoAlberto
Alberto
 
OBJETIVOS DE DREAMWEAVER
OBJETIVOS DE DREAMWEAVEROBJETIVOS DE DREAMWEAVER
OBJETIVOS DE DREAMWEAVER
 
Usabilidad
UsabilidadUsabilidad
Usabilidad
 
Informatica daniela
Informatica danielaInformatica daniela
Informatica daniela
 
Ux Arquitectura de Información
Ux Arquitectura de InformaciónUx Arquitectura de Información
Ux Arquitectura de Información
 
Presentacion de dreamweaver
Presentacion de dreamweaverPresentacion de dreamweaver
Presentacion de dreamweaver
 
Tecnología 7°
Tecnología 7° Tecnología 7°
Tecnología 7°
 
T2 pa3 suntaxijesseniadg
T2 pa3 suntaxijesseniadgT2 pa3 suntaxijesseniadg
T2 pa3 suntaxijesseniadg
 

Más de adrianamontano2 (7)

Periodismo digital
Periodismo digitalPeriodismo digital
Periodismo digital
 
Espacios en el mensaje
Espacios en el mensajeEspacios en el mensaje
Espacios en el mensaje
 
Reticulas para pantallas
Reticulas para pantallasReticulas para pantallas
Reticulas para pantallas
 
Espacios en el mensaje
Espacios en el mensajeEspacios en el mensaje
Espacios en el mensaje
 
Espacios en el mensaje
Espacios en el mensajeEspacios en el mensaje
Espacios en el mensaje
 
Espacios en el Mensaje
Espacios en el MensajeEspacios en el Mensaje
Espacios en el Mensaje
 
Presentacion power reticulas para pantallas
Presentacion power reticulas para pantallasPresentacion power reticulas para pantallas
Presentacion power reticulas para pantallas
 

Último

PROPUESTA COMERCIAL SENA ETAPA 2 ACTIVIDAD 3.pdf
PROPUESTA COMERCIAL SENA ETAPA 2 ACTIVIDAD 3.pdfPROPUESTA COMERCIAL SENA ETAPA 2 ACTIVIDAD 3.pdf
PROPUESTA COMERCIAL SENA ETAPA 2 ACTIVIDAD 3.pdf
EduardoJosVargasCama1
 

Último (20)

Supuestos_prácticos_funciones.docx
Supuestos_prácticos_funciones.docxSupuestos_prácticos_funciones.docx
Supuestos_prácticos_funciones.docx
 
CONCURSO NACIONAL JOSE MARIA ARGUEDAS.pptx
CONCURSO NACIONAL JOSE MARIA ARGUEDAS.pptxCONCURSO NACIONAL JOSE MARIA ARGUEDAS.pptx
CONCURSO NACIONAL JOSE MARIA ARGUEDAS.pptx
 
activ4-bloque4 transversal doctorado.pdf
activ4-bloque4 transversal doctorado.pdfactiv4-bloque4 transversal doctorado.pdf
activ4-bloque4 transversal doctorado.pdf
 
Posición astronómica y geográfica de Europa.pptx
Posición astronómica y geográfica de Europa.pptxPosición astronómica y geográfica de Europa.pptx
Posición astronómica y geográfica de Europa.pptx
 
PROPUESTA COMERCIAL SENA ETAPA 2 ACTIVIDAD 3.pdf
PROPUESTA COMERCIAL SENA ETAPA 2 ACTIVIDAD 3.pdfPROPUESTA COMERCIAL SENA ETAPA 2 ACTIVIDAD 3.pdf
PROPUESTA COMERCIAL SENA ETAPA 2 ACTIVIDAD 3.pdf
 
Tema 17. Biología de los microorganismos 2024
Tema 17. Biología de los microorganismos 2024Tema 17. Biología de los microorganismos 2024
Tema 17. Biología de los microorganismos 2024
 
Plan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdf
Plan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdfPlan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdf
Plan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdf
 
Feliz Día de la Madre - 5 de Mayo, 2024.pdf
Feliz Día de la Madre - 5 de Mayo, 2024.pdfFeliz Día de la Madre - 5 de Mayo, 2024.pdf
Feliz Día de la Madre - 5 de Mayo, 2024.pdf
 
PP_Comunicacion en Salud: Objetivación de signos y síntomas
PP_Comunicacion en Salud: Objetivación de signos y síntomasPP_Comunicacion en Salud: Objetivación de signos y síntomas
PP_Comunicacion en Salud: Objetivación de signos y síntomas
 
Usos y desusos de la inteligencia artificial en revistas científicas
Usos y desusos de la inteligencia artificial en revistas científicasUsos y desusos de la inteligencia artificial en revistas científicas
Usos y desusos de la inteligencia artificial en revistas científicas
 
Procedimientos para la planificación en los Centros Educativos tipo V ( multi...
Procedimientos para la planificación en los Centros Educativos tipo V ( multi...Procedimientos para la planificación en los Centros Educativos tipo V ( multi...
Procedimientos para la planificación en los Centros Educativos tipo V ( multi...
 
Lecciones 06 Esc. Sabática. Los dos testigos
Lecciones 06 Esc. Sabática. Los dos testigosLecciones 06 Esc. Sabática. Los dos testigos
Lecciones 06 Esc. Sabática. Los dos testigos
 
SISTEMA RESPIRATORIO PARA NIÑOS PRIMARIA
SISTEMA RESPIRATORIO PARA NIÑOS PRIMARIASISTEMA RESPIRATORIO PARA NIÑOS PRIMARIA
SISTEMA RESPIRATORIO PARA NIÑOS PRIMARIA
 
Prueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESO
Prueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESOPrueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESO
Prueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESO
 
Tema 11. Dinámica de la hidrosfera 2024
Tema 11.  Dinámica de la hidrosfera 2024Tema 11.  Dinámica de la hidrosfera 2024
Tema 11. Dinámica de la hidrosfera 2024
 
Louis Jean François Lagrenée. Erotismo y sensualidad. El erotismo en la Hist...
Louis Jean François Lagrenée.  Erotismo y sensualidad. El erotismo en la Hist...Louis Jean François Lagrenée.  Erotismo y sensualidad. El erotismo en la Hist...
Louis Jean François Lagrenée. Erotismo y sensualidad. El erotismo en la Hist...
 
Desarrollo y Aplicación de la Administración por Valores
Desarrollo y Aplicación de la Administración por ValoresDesarrollo y Aplicación de la Administración por Valores
Desarrollo y Aplicación de la Administración por Valores
 
LA LITERATURA DEL BARROCO 2023-2024pptx.pptx
LA LITERATURA DEL BARROCO 2023-2024pptx.pptxLA LITERATURA DEL BARROCO 2023-2024pptx.pptx
LA LITERATURA DEL BARROCO 2023-2024pptx.pptx
 
Sesión de clase APC: Los dos testigos.pdf
Sesión de clase APC: Los dos testigos.pdfSesión de clase APC: Los dos testigos.pdf
Sesión de clase APC: Los dos testigos.pdf
 
PLAN DE REFUERZO ESCOLAR MERC 2024-2.docx
PLAN DE REFUERZO ESCOLAR MERC 2024-2.docxPLAN DE REFUERZO ESCOLAR MERC 2024-2.docx
PLAN DE REFUERZO ESCOLAR MERC 2024-2.docx
 

Presentacion power reticulas para pantallas

  • 1. RETICULAS PARA PANTALLAS En diseño, las retículas sirven de guía para el posicionamiento de los módulos y de esta manera, generar nuevas direcciones y consecuentemente un diseño. TIPOS DE RETICULAS Bueno, para empezar ¿qué es una retícula? La retícula en el diseño es una guía que nos sirve para distribuir los elementos y la alineación, todas sin excepción cuentan con las mismas partes básicas sólo que algunas alcanzan cierta complejidad de acuerdo a las necesidades de la información, también estas se pueden combinar.
  • 2. Manuscrita La más sencilla de todas, se usa para textos largos porque están contenidos en un bloque grande delimitado por un margen y tiene un espacio para los títulos y la numeración. El ejemplo es el más cercano que encontré, pero creo que en si no se siguió una retícula...No muy recomendable para utilizarlo en una web, es difícil seguir la lectura y lo hace tedioso.
  • 3. Columnas Es muy flexible y se pueden separar distintos tipos de información, es unas de las retículas más utilizadas en revistas y también en el diseño web, porque puede utilizarse varias columnas para texto amplio e imágenes grandes y también pequeñas. En el primer ejemplo utiliza de columnas y también por módulos, es muy agradable por qué se ve más limpio, atractivo y los elementos están claramente diferenciados.
  • 4. Modular Útil cuando es algo muy complejo, es parecida a la de columnas solo que las divide en filas creando así una matriz de celdas que se denominan módulos, en cada uno de ellos se puede colocar información o en varios agrupados. Son flexibles y precisos pero en exceso puede crear confusión.En esta web utilizaron este tipo de retícula para hacer un menú de los juegos que tienen, con muy buenos resultados.
  • 5. Jerárquica Esta la he visto que la ocupan en gran medida en el diseño web, la información se organiza de forma intuitiva en proporción a los elementos y no en intervalos regulares y repetidos como sucede con las otras, es por eso que es muy variable.
  • 6. Jerárquica La retícula que está en voga es la jerárquica porque podemos acomodar la información por orden de importancia, generalmente poniendo lo más importante a manera de resumen o por novedad en un recuadro de forma llamativa que abarque todo el espacio y los menús o palabras clave en otras columnas de menor tamaño y alineación.
  • 7. El diseño web va más allá del diseño tradicional pues existen muchos limitadores relacionados con el medio donde se presentan las páginas: internet. conocemos las características fundamentales del diseño en la web.
  • 8. Otro aspecto a tener en cuenta es que las páginas web son visualizadas en unas aplicaciones específicas, los navegadores web, que imponen grandes limitaciones al diseño de las mismas. la ventana de un navegador es eminentemente rectangular, con unas medidas concretas (dadas por la resolución empleada por el usuario en su monitor) y con unas capacidades de interpretación de colores que varían mucho según el ordenador usado, el sistema operativo, el monitor y la tarjeta gráfica.
  • 9. TIPOGRAFIA La elección y el uso de la tipografía es quizás el elemento más difícil dentro del proceso de diseño. La tipografía asume un doble papel tanto como comunicador visual y como verbal la tipografía nos ayuda a distinguir visualmente grupo de textos y de esta manera ayudan al usuario a predecir qué tipo de información encontraran en ciertas áreas de la pagina. Lo que hacemos al diseñar páginas web es básicamente “pintar” el texto, no solo aplicando color al texto sino al combinarlo con otros bloques de texto y con el fondo de la pagina. El ojo viajara de bloque en bloque a lo largo de la pagina y es gracia a estos bloques tipográficos que podemos alcanzar una buena jerarquía.
  • 10. ELECCIÓN DE LA PALETA DE FUENTES
  • 11. TAMAÑO DE LAS FUENTES El tamaño de la letra debe elegirse teniendo en cuenta la naturaleza de la composición y la distancia a la que se va a leer.
  • 14. COLOR EN LA WEB
  • 15. COLOR A la hora de aplicar colores deberemos tener en cuenta una serie de reglas. No hay que olvidar que el medio sobre el que trabajamos será la pantalla, y en éste sentido podemos tener la certeza de que en cada ordenador se verá un poco diferente. A nivel de usabilidad y accesibilidad lo más importante será tener cuidado con el contraste entre el cuerpo de letra y el fondo.