SlideShare una empresa de Scribd logo
1 de 23
• Colocar un fondo de color acorde a la imagen o logotipo
• Que se puedan leer bien los textos. Los fondos están para hacer
más vistosa la página, no para molestar en la lectura de los textos
por lo tanto es importante que las combinaciones de color del
texto y del fondo sean agradables, ya que hay ciertos colores que,
aunque contrastan bien, provocan unas combinaciones difíciles de
leer.
• Los fondos de imagen de color homogéneo. Si utilizamos un fondo
de imagen, tenemos que procurar que en la imagen se utilicen
colores de una misma gama. Si el texto es claro no contrastará bien
con las partes del fondo que también son claras. Igual pasará si
colocamos el texto con un color oscuro, que no contrastará bien con
las partes oscuras del fondo.
• Tener cuidado con las distintas definiciones de pantalla. Es
importante saber que un visitante puede acceder a una página con
un tamaño de ventana variable. A veces un fondo se comporta
bien con una definición dada, pero no con otras mayores. Ocurre
muy a menudo que se utiliza un fondo y se ve el resultado en una
ventana de 800x600 ó 1024x768. Luego accede una persona con
una definición de 1280x1024, o superior, y ve la página
incorrectamente porque se realiza un mosaico con el fondo que no
había tenido en cuenta el desarrollador.
•Hacer un fondo suficientemente grande . Es importante que el
tamaño del archivo que vamos a utilizar como fondo tenga un
cierto tamaño. Si utilizamos como fondo una imagen de unos
pocos pixeles, nuestro ordenador trabajará mucho para crear el
mosaico repitiendo cientos o miles de veces esa imagen. Sin
embargo, si el fondo hubiese sido un poco más grande, para
realizar el mosaico hubiera trabajado mucho menos.
• Elemento gráfico que identifica a una
persona, empresa, institución o producto. Un
logo exitoso debe ser:
• LEGIBLE en todo tipo de tamaños
• REPRODUCIBLE: sin importar las condiciones
materiales
• ESCALABLE: al tamaño deseado
• DISTINGUIBLE: no debe dar lugar a
confusiones
• MEMORABLE que impacte y no se olvide.
LOGOTIPOS
• No utiliza una
imagen figurativa se
basa en su tipografía.
Su ventaja: la
capacidad de
comprensión.
ISOTIPOS
• Sólo utiliza una
imagen figurativa o
ícono para transmitir
su mensaje. La
ventaja es muy fácil
de recordar.
ISOLOGOTIPOS
• Combina los dos
anteriores. La
ventaja es que tiene
un increíble poder de
precisión ya que
suma la capacidad
expresiva de ambos
elementos ícono y
tipografía.
• Imagen o animación situado en una página web
que contiene, en la mayoría de los casos,
publicidad. Se crean a partir de imágenes en
formato JPEG, GIF o FLASH y suelen ser muy
llamativos, con colores y animaciones que llaman
la atención del internauta.
• Un encabezado es la sección que está situada en
la parte superior de tu página web. Algunos
encabezados aparecen sobre el menú de
navegación, pero también es común colocarlos
directamente debajo del menú.
• Capturar la atención rápidamente utilizando adecuadamente texto, colores y gráficas
• Enfatizar en el tema del sitio web
• Preferir los banners GIF animados sobre los estáticos
• El uso de frases que impliquen curiosidad, humor, miedo o preguntas. (Ejemplo:
Sabía usted que…)
• Incluir algún logo, dirección web o identificación gráfica de nuestro sitio
• En cuanto a tamaño en píxeles los banners estándares son de 468 x 60 pixeles,
existen también mini banners y banners de otras dimensiones, dependiendo del sitio
que los exponga.
• En Kb no deben tener más de 10 kb de tamaño ya que un banner demasiado grande
tardará mucho en cargarse y no será visualizado por el visitante.
• El uso de colore brillantes es más apropiado que colores oscuros. El negro ha
demostrado ser menos efectivo. Entre los más recomendable está el azul, amarillo,
naranja y verde.
• Se debe aplicar colores que contrasten para que pueda leerse los mensajes o títulos
• Aplicar mucha creatividad.
• Se define con las dimensiones en píxeles de la matriz o
cuadrícula. Si una imagen está formada por una matriz
de 800 columnas por 500 filas, tiene entonces un
tamaño de 800 x 500 píxeles.
• Se suele utilizar el término “megapíxel” para simplificar
las cifras: 1 megapíxel equivale a 1 millón de píxeles. Su
problema es que es una medida que no da información
acerca de sus dimensiones. Una imagen de 1000x400
tiene el mismo número de píxeles (400,000) que una
de 800x500 pero, evidentemente, sus dimensiones son
diferentes.
Esta imagen tiene unas dimensiones de 400x261 píxeles, un total de
104.400 píxeles y 0,104 Megapíxeles.
• El tamaño es la cantidad de información que
contiene, medida en bits, Bytes, Mega, Giga, Tera.
• Es conveniente aclarar que es usual escribir "bit"
con "b" minúscula y "Byte" con mayúscula.
• Si una imagen contiene 50 Bytes, éste es su
tamaño de archivo: 50 Bytes. Si contuviera 50.000
Bytes, se suelen emplear múltiplos para afirmar
su tamaño con más comodidad, que son el
"KiloByte", el "MegaByte", el "GigaByte" o el
"TeraByte". Con la siguiente tabla quedarán más
claras las equivalencias entre ellos:
Tabla de tamaños
Nombre Abreviatura Tamaño Tamaño en Bytes
bit b 1 bit (0 o 1)
Byte B 8 bits 1
KiloByte KB 1.024 Bytes 1.024
MegaByte MB 1.024 KBytes 1.048.576
GigaByte GB 1.024 MBytes 1.073 millones
FORMATO JPEG
DIMENSIÓN 259 X 194
TAMAÑO O PESO 25 KB
FORMATO GIF
DIMENSIÓN 267 X 300
TAMAÑO O PESO 17.4 KB
Estas imágenes tiene las siguientes
dimensiones:
Fantasma preocupado: 1152 x 864
Corazones 1024 x 768
Estrellas 1140 x 1080
Calcula el total de píxeles y
megapixeles que contiene cada
una
WEBGRAFIA
• http://es.wikipedia.org/wiki/Logotipo
• http://es.wix.com/blog/2012/05/tips-html5-como-crear-
encabezados-grandes/
• http://www.google.com.co/search?tbm=isch&hl=es&sourc
e=hp&biw=1366&bih=667&q=fondos+para+web&gbv=2&o
q=fondos+para+we&aq=0&aqi=g10&aql=&gs_l=img.1.0.0l1
0.832.2899.0.5341.14.10.0.4.4.1.270.1269.4j4j2.10.0...0.0.F
EiYk-AoTIw
• http://office.microsoft.com/es-hn/powerpoint-
help/reducir-el-tamano-de-archivo-de-una-imagen-
HA010192200.aspx (Reducir tamaño de imagen)
• http://www.logotipia.com.ar/tipos-de-logotipos-diferentes-
tipos-de-logos.asp

Más contenido relacionado

Destacado

SEM - Search Engine Marketing / Mercadeo en búscadores
SEM - Search Engine Marketing / Mercadeo en búscadoresSEM - Search Engine Marketing / Mercadeo en búscadores
SEM - Search Engine Marketing / Mercadeo en búscadores
Francisco Berrizbeitia
 
Desarrollo de aplicaciones con HTML5
Desarrollo de aplicaciones con HTML5 Desarrollo de aplicaciones con HTML5
Desarrollo de aplicaciones con HTML5
Gonzalo C.
 
Diagramas de Flujo
Diagramas de FlujoDiagramas de Flujo
Diagramas de Flujo
astaroth97
 
Introducción al Diseño Web
Introducción al Diseño WebIntroducción al Diseño Web
Introducción al Diseño Web
Lorena Guerrero
 

Destacado (20)

Html 5 Guia Didactica
Html 5 Guia DidacticaHtml 5 Guia Didactica
Html 5 Guia Didactica
 
SEM - Search Engine Marketing / Mercadeo en búscadores
SEM - Search Engine Marketing / Mercadeo en búscadoresSEM - Search Engine Marketing / Mercadeo en búscadores
SEM - Search Engine Marketing / Mercadeo en búscadores
 
Crear banners en linea
Crear banners en lineaCrear banners en linea
Crear banners en linea
 
Webmaster
WebmasterWebmaster
Webmaster
 
Problemas de mep
Problemas de mepProblemas de mep
Problemas de mep
 
Tips Desarrollar y Gestionar Banners HTML5
Tips Desarrollar y Gestionar Banners HTML5Tips Desarrollar y Gestionar Banners HTML5
Tips Desarrollar y Gestionar Banners HTML5
 
Html5 para móviles, las reglas no escritas
Html5 para móviles, las reglas no escritasHtml5 para móviles, las reglas no escritas
Html5 para móviles, las reglas no escritas
 
(VAN) Valor Actual Neto (El Salvador)
(VAN) Valor Actual Neto (El Salvador)(VAN) Valor Actual Neto (El Salvador)
(VAN) Valor Actual Neto (El Salvador)
 
Curso de HTML5
Curso de HTML5Curso de HTML5
Curso de HTML5
 
Curso HTML 5 - Módulo 1
Curso HTML 5 - Módulo 1Curso HTML 5 - Módulo 1
Curso HTML 5 - Módulo 1
 
Manual de dreamweaver listo
Manual de dreamweaver listoManual de dreamweaver listo
Manual de dreamweaver listo
 
Creación y estilizado de una página en HTML5 - 70-480 certificacion microsoft
Creación y estilizado de una página en HTML5 - 70-480 certificacion microsoftCreación y estilizado de una página en HTML5 - 70-480 certificacion microsoft
Creación y estilizado de una página en HTML5 - 70-480 certificacion microsoft
 
Manual paginas web
Manual paginas webManual paginas web
Manual paginas web
 
Desarrollo de aplicaciones con HTML5
Desarrollo de aplicaciones con HTML5 Desarrollo de aplicaciones con HTML5
Desarrollo de aplicaciones con HTML5
 
Todo sobre HTML5
Todo sobre HTML5Todo sobre HTML5
Todo sobre HTML5
 
Maquetación web con html5
Maquetación web con html5Maquetación web con html5
Maquetación web con html5
 
Algoritmos y diagramas de flujo
Algoritmos y diagramas de flujoAlgoritmos y diagramas de flujo
Algoritmos y diagramas de flujo
 
HTML5: empieza hoy
HTML5: empieza hoyHTML5: empieza hoy
HTML5: empieza hoy
 
Diagramas de Flujo
Diagramas de FlujoDiagramas de Flujo
Diagramas de Flujo
 
Introducción al Diseño Web
Introducción al Diseño WebIntroducción al Diseño Web
Introducción al Diseño Web
 

Similar a Logos, banners y fondos para sitios web

Consejos Para La Optimizacion De Imagenes En Web
Consejos Para La Optimizacion De Imagenes En WebConsejos Para La Optimizacion De Imagenes En Web
Consejos Para La Optimizacion De Imagenes En Web
grupo90
 
Consejos Para La Optimizacion De Imagenes En Web
Consejos Para La Optimizacion De Imagenes En WebConsejos Para La Optimizacion De Imagenes En Web
Consejos Para La Optimizacion De Imagenes En Web
grupo90
 
Capítulo 5. creación de documentos de promoción de los
Capítulo 5. creación de documentos de promoción de losCapítulo 5. creación de documentos de promoción de los
Capítulo 5. creación de documentos de promoción de los
marangelystorres12
 
Contenido web manejo tipografico
Contenido web   manejo tipograficoContenido web   manejo tipografico
Contenido web manejo tipografico
dorianpatricia
 
Clase 5 imágenes
Clase 5   imágenesClase 5   imágenes
Clase 5 imágenes
ICE
 
Presentación de imagen digital
Presentación de imagen digitalPresentación de imagen digital
Presentación de imagen digital
felolopez99
 

Similar a Logos, banners y fondos para sitios web (20)

Curso Diseñando para la Web, parte 2
Curso Diseñando para la Web, parte 2Curso Diseñando para la Web, parte 2
Curso Diseñando para la Web, parte 2
 
G.1.1 arias.arevalo.mariuxi.multimedia
G.1.1 arias.arevalo.mariuxi.multimedia G.1.1 arias.arevalo.mariuxi.multimedia
G.1.1 arias.arevalo.mariuxi.multimedia
 
Formatos de Imagen
Formatos de ImagenFormatos de Imagen
Formatos de Imagen
 
Consejos Para La Optimizacion De Imagenes En Web
Consejos Para La Optimizacion De Imagenes En WebConsejos Para La Optimizacion De Imagenes En Web
Consejos Para La Optimizacion De Imagenes En Web
 
Consejos Para La Optimizacion De Imagenes En Web
Consejos Para La Optimizacion De Imagenes En WebConsejos Para La Optimizacion De Imagenes En Web
Consejos Para La Optimizacion De Imagenes En Web
 
Cómo crear imágenes para el perfil de Twitter
Cómo crear imágenes para el perfil de TwitterCómo crear imágenes para el perfil de Twitter
Cómo crear imágenes para el perfil de Twitter
 
Capítulo 5. creación de documentos de promoción de los
Capítulo 5. creación de documentos de promoción de losCapítulo 5. creación de documentos de promoción de los
Capítulo 5. creación de documentos de promoción de los
 
Introduccion a Photoshop CS4
Introduccion a Photoshop CS4Introduccion a Photoshop CS4
Introduccion a Photoshop CS4
 
Tips de diseño
Tips de diseñoTips de diseño
Tips de diseño
 
Libro diseno
Libro disenoLibro diseno
Libro diseno
 
Curso Básico de Photoshop
Curso Básico de PhotoshopCurso Básico de Photoshop
Curso Básico de Photoshop
 
La Casa De Elena Y Sus Fotolienzos
La Casa De Elena Y Sus Fotolienzos
La Casa De Elena Y Sus Fotolienzos
La Casa De Elena Y Sus Fotolienzos
 
Formatos gráficos
Formatos gráficosFormatos gráficos
Formatos gráficos
 
Contenido web manejo tipografico
Contenido web   manejo tipograficoContenido web   manejo tipografico
Contenido web manejo tipografico
 
Manual curso Edicion. Ikaslan Bizkaia
Manual curso Edicion. Ikaslan BizkaiaManual curso Edicion. Ikaslan Bizkaia
Manual curso Edicion. Ikaslan Bizkaia
 
Clase 5 imágenes
Clase 5   imágenesClase 5   imágenes
Clase 5 imágenes
 
Tema 05 trabajando con imagenes en html
Tema 05 trabajando con imagenes en htmlTema 05 trabajando con imagenes en html
Tema 05 trabajando con imagenes en html
 
Presentación de imagen digital
Presentación de imagen digitalPresentación de imagen digital
Presentación de imagen digital
 
Cuestionario
Cuestionario Cuestionario
Cuestionario
 
Actividad 1 Ps
Actividad 1 PsActividad 1 Ps
Actividad 1 Ps
 

Más de mireyacabreram

Guía nº 4 sistema integral de gestión educativa
Guía nº 4 sistema integral de gestión educativaGuía nº 4 sistema integral de gestión educativa
Guía nº 4 sistema integral de gestión educativa
mireyacabreram
 

Más de mireyacabreram (20)

Publicidad y productividad
Publicidad y productividadPublicidad y productividad
Publicidad y productividad
 
Ejercicios
EjerciciosEjercicios
Ejercicios
 
Aplicaciones
AplicacionesAplicaciones
Aplicaciones
 
Los logotipos final (1)
Los logotipos final (1)Los logotipos final (1)
Los logotipos final (1)
 
Medios publicitarios novenos
Medios publicitarios novenosMedios publicitarios novenos
Medios publicitarios novenos
 
Taller 2 decimos
Taller 2 decimosTaller 2 decimos
Taller 2 decimos
 
Trabajos estudiantes grados novenos
Trabajos estudiantes grados novenosTrabajos estudiantes grados novenos
Trabajos estudiantes grados novenos
 
Taller 6 diseño publicitario
Taller 6 diseño publicitarioTaller 6 diseño publicitario
Taller 6 diseño publicitario
 
Logotipos
LogotiposLogotipos
Logotipos
 
Medios publicitarios
Medios publicitariosMedios publicitarios
Medios publicitarios
 
Prae
PraePrae
Prae
 
Taller de Google docs
Taller de Google docsTaller de Google docs
Taller de Google docs
 
Mi presentación
Mi presentaciónMi presentación
Mi presentación
 
Guía nº 4 sistema integral de gestión educativa
Guía nº 4 sistema integral de gestión educativaGuía nº 4 sistema integral de gestión educativa
Guía nº 4 sistema integral de gestión educativa
 
Preescolar María Goretti Pasto
Preescolar María Goretti PastoPreescolar María Goretti Pasto
Preescolar María Goretti Pasto
 
Preescolar maría goretti (1)
Preescolar maría goretti (1)Preescolar maría goretti (1)
Preescolar maría goretti (1)
 
The fairy and_shadow
The fairy and_shadowThe fairy and_shadow
The fairy and_shadow
 
Vocabulario de la_vida
Vocabulario de la_vidaVocabulario de la_vida
Vocabulario de la_vida
 
Trabajos estudiantes Grados Décimos
Trabajos estudiantes Grados DécimosTrabajos estudiantes Grados Décimos
Trabajos estudiantes Grados Décimos
 
Padre GUILLERMO DE CASTELLANA
Padre GUILLERMO DE CASTELLANAPadre GUILLERMO DE CASTELLANA
Padre GUILLERMO DE CASTELLANA
 

Último

Ediciones Previas Proyecto de Innovacion Pedagogica ORIGAMI 3D Ccesa007.pdf
Ediciones Previas Proyecto de Innovacion Pedagogica ORIGAMI 3D  Ccesa007.pdfEdiciones Previas Proyecto de Innovacion Pedagogica ORIGAMI 3D  Ccesa007.pdf
Ediciones Previas Proyecto de Innovacion Pedagogica ORIGAMI 3D Ccesa007.pdf
Demetrio Ccesa Rayme
 
Pasos para enviar una tarea en SIANET - sólo estudiantes.pdf
Pasos para enviar una tarea en SIANET - sólo estudiantes.pdfPasos para enviar una tarea en SIANET - sólo estudiantes.pdf
Pasos para enviar una tarea en SIANET - sólo estudiantes.pdf
NELLYKATTY
 
ANTOLOGIA COMPLETA ANITA LA ABEJITA PARA LA LECTOESCRITURA EN PRIMER GRADO.pdf
ANTOLOGIA COMPLETA ANITA LA ABEJITA PARA LA LECTOESCRITURA EN PRIMER GRADO.pdfANTOLOGIA COMPLETA ANITA LA ABEJITA PARA LA LECTOESCRITURA EN PRIMER GRADO.pdf
ANTOLOGIA COMPLETA ANITA LA ABEJITA PARA LA LECTOESCRITURA EN PRIMER GRADO.pdf
lvela1316
 

Último (20)

Gran Final Campeonato Nacional Escolar Liga Las Torres 2017.pdf
Gran Final Campeonato Nacional Escolar Liga Las Torres 2017.pdfGran Final Campeonato Nacional Escolar Liga Las Torres 2017.pdf
Gran Final Campeonato Nacional Escolar Liga Las Torres 2017.pdf
 
Época colonial: vestimenta, costumbres y juegos de la época
Época colonial: vestimenta, costumbres y juegos de la épocaÉpoca colonial: vestimenta, costumbres y juegos de la época
Época colonial: vestimenta, costumbres y juegos de la época
 
Nikola Tesla - Biografia - Datos interesantes e inventos
Nikola Tesla - Biografia - Datos interesantes e inventosNikola Tesla - Biografia - Datos interesantes e inventos
Nikola Tesla - Biografia - Datos interesantes e inventos
 
Comunidades Virtuales de Aprendizaje Caracteristicas.pptx
Comunidades Virtuales de Aprendizaje Caracteristicas.pptxComunidades Virtuales de Aprendizaje Caracteristicas.pptx
Comunidades Virtuales de Aprendizaje Caracteristicas.pptx
 
CONCLUSIONES DESCRIPTIVAS TIC que ayudaran a tus registrosdocx
CONCLUSIONES DESCRIPTIVAS TIC que ayudaran a tus registrosdocxCONCLUSIONES DESCRIPTIVAS TIC que ayudaran a tus registrosdocx
CONCLUSIONES DESCRIPTIVAS TIC que ayudaran a tus registrosdocx
 
TÉCNICAS OBSERVACIONALES Y TEXTUALES.pdf
TÉCNICAS OBSERVACIONALES Y TEXTUALES.pdfTÉCNICAS OBSERVACIONALES Y TEXTUALES.pdf
TÉCNICAS OBSERVACIONALES Y TEXTUALES.pdf
 
tema 6 2eso 2024. Ciencias Sociales. El final de la Edad Media en la Penínsul...
tema 6 2eso 2024. Ciencias Sociales. El final de la Edad Media en la Penínsul...tema 6 2eso 2024. Ciencias Sociales. El final de la Edad Media en la Penínsul...
tema 6 2eso 2024. Ciencias Sociales. El final de la Edad Media en la Penínsul...
 
TEMA EGIPTO.pdf. Presentación civilización
TEMA EGIPTO.pdf. Presentación civilizaciónTEMA EGIPTO.pdf. Presentación civilización
TEMA EGIPTO.pdf. Presentación civilización
 
Ediciones Previas Proyecto de Innovacion Pedagogica ORIGAMI 3D Ccesa007.pdf
Ediciones Previas Proyecto de Innovacion Pedagogica ORIGAMI 3D  Ccesa007.pdfEdiciones Previas Proyecto de Innovacion Pedagogica ORIGAMI 3D  Ccesa007.pdf
Ediciones Previas Proyecto de Innovacion Pedagogica ORIGAMI 3D Ccesa007.pdf
 
Pasos para enviar una tarea en SIANET - sólo estudiantes.pdf
Pasos para enviar una tarea en SIANET - sólo estudiantes.pdfPasos para enviar una tarea en SIANET - sólo estudiantes.pdf
Pasos para enviar una tarea en SIANET - sólo estudiantes.pdf
 
Tema 9. Roma. 1º ESO 2014. Ciencias SOciales
Tema 9. Roma. 1º ESO 2014. Ciencias SOcialesTema 9. Roma. 1º ESO 2014. Ciencias SOciales
Tema 9. Roma. 1º ESO 2014. Ciencias SOciales
 
El liderazgo en la empresa sostenible, introducción, definición y ejemplo.
El liderazgo en la empresa sostenible, introducción, definición y ejemplo.El liderazgo en la empresa sostenible, introducción, definición y ejemplo.
El liderazgo en la empresa sostenible, introducción, definición y ejemplo.
 
Estudios Sociales libro 8vo grado Básico
Estudios Sociales libro 8vo grado BásicoEstudios Sociales libro 8vo grado Básico
Estudios Sociales libro 8vo grado Básico
 
Diapositivas unidad de trabajo 7 sobre Coloración temporal y semipermanente
Diapositivas unidad de trabajo 7 sobre Coloración temporal y semipermanenteDiapositivas unidad de trabajo 7 sobre Coloración temporal y semipermanente
Diapositivas unidad de trabajo 7 sobre Coloración temporal y semipermanente
 
ANTOLOGIA COMPLETA ANITA LA ABEJITA PARA LA LECTOESCRITURA EN PRIMER GRADO.pdf
ANTOLOGIA COMPLETA ANITA LA ABEJITA PARA LA LECTOESCRITURA EN PRIMER GRADO.pdfANTOLOGIA COMPLETA ANITA LA ABEJITA PARA LA LECTOESCRITURA EN PRIMER GRADO.pdf
ANTOLOGIA COMPLETA ANITA LA ABEJITA PARA LA LECTOESCRITURA EN PRIMER GRADO.pdf
 
PATRONES DE REFERENCIA, CRITERIOS Y DIAGNOSTICO Angeles.pptx
PATRONES DE REFERENCIA, CRITERIOS Y DIAGNOSTICO Angeles.pptxPATRONES DE REFERENCIA, CRITERIOS Y DIAGNOSTICO Angeles.pptx
PATRONES DE REFERENCIA, CRITERIOS Y DIAGNOSTICO Angeles.pptx
 
LA ORALIDAD, DEFINICIÓN Y CARACTERÍSTICAS.pptx
LA ORALIDAD, DEFINICIÓN Y CARACTERÍSTICAS.pptxLA ORALIDAD, DEFINICIÓN Y CARACTERÍSTICAS.pptx
LA ORALIDAD, DEFINICIÓN Y CARACTERÍSTICAS.pptx
 
ACERTIJO CÁLCULOS MATEMÁGICOS EN LA CARRERA OLÍMPICA. Por JAVIER SOLIS NOYOLA
ACERTIJO CÁLCULOS MATEMÁGICOS EN LA CARRERA OLÍMPICA. Por JAVIER SOLIS NOYOLAACERTIJO CÁLCULOS MATEMÁGICOS EN LA CARRERA OLÍMPICA. Por JAVIER SOLIS NOYOLA
ACERTIJO CÁLCULOS MATEMÁGICOS EN LA CARRERA OLÍMPICA. Por JAVIER SOLIS NOYOLA
 
Seguridad y virus informáticos 12°B 2024
Seguridad y virus informáticos 12°B 2024Seguridad y virus informáticos 12°B 2024
Seguridad y virus informáticos 12°B 2024
 
Análisis de los factores internos en una Organización
Análisis de los factores internos en una OrganizaciónAnálisis de los factores internos en una Organización
Análisis de los factores internos en una Organización
 

Logos, banners y fondos para sitios web

  • 1.
  • 2. • Colocar un fondo de color acorde a la imagen o logotipo • Que se puedan leer bien los textos. Los fondos están para hacer más vistosa la página, no para molestar en la lectura de los textos por lo tanto es importante que las combinaciones de color del texto y del fondo sean agradables, ya que hay ciertos colores que, aunque contrastan bien, provocan unas combinaciones difíciles de leer. • Los fondos de imagen de color homogéneo. Si utilizamos un fondo de imagen, tenemos que procurar que en la imagen se utilicen colores de una misma gama. Si el texto es claro no contrastará bien con las partes del fondo que también son claras. Igual pasará si colocamos el texto con un color oscuro, que no contrastará bien con las partes oscuras del fondo.
  • 3. • Tener cuidado con las distintas definiciones de pantalla. Es importante saber que un visitante puede acceder a una página con un tamaño de ventana variable. A veces un fondo se comporta bien con una definición dada, pero no con otras mayores. Ocurre muy a menudo que se utiliza un fondo y se ve el resultado en una ventana de 800x600 ó 1024x768. Luego accede una persona con una definición de 1280x1024, o superior, y ve la página incorrectamente porque se realiza un mosaico con el fondo que no había tenido en cuenta el desarrollador. •Hacer un fondo suficientemente grande . Es importante que el tamaño del archivo que vamos a utilizar como fondo tenga un cierto tamaño. Si utilizamos como fondo una imagen de unos pocos pixeles, nuestro ordenador trabajará mucho para crear el mosaico repitiendo cientos o miles de veces esa imagen. Sin embargo, si el fondo hubiese sido un poco más grande, para realizar el mosaico hubiera trabajado mucho menos.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8. • Elemento gráfico que identifica a una persona, empresa, institución o producto. Un logo exitoso debe ser: • LEGIBLE en todo tipo de tamaños • REPRODUCIBLE: sin importar las condiciones materiales • ESCALABLE: al tamaño deseado • DISTINGUIBLE: no debe dar lugar a confusiones • MEMORABLE que impacte y no se olvide.
  • 9. LOGOTIPOS • No utiliza una imagen figurativa se basa en su tipografía. Su ventaja: la capacidad de comprensión. ISOTIPOS • Sólo utiliza una imagen figurativa o ícono para transmitir su mensaje. La ventaja es muy fácil de recordar. ISOLOGOTIPOS • Combina los dos anteriores. La ventaja es que tiene un increíble poder de precisión ya que suma la capacidad expresiva de ambos elementos ícono y tipografía.
  • 10.
  • 11. • Imagen o animación situado en una página web que contiene, en la mayoría de los casos, publicidad. Se crean a partir de imágenes en formato JPEG, GIF o FLASH y suelen ser muy llamativos, con colores y animaciones que llaman la atención del internauta. • Un encabezado es la sección que está situada en la parte superior de tu página web. Algunos encabezados aparecen sobre el menú de navegación, pero también es común colocarlos directamente debajo del menú.
  • 12.
  • 13.
  • 14.
  • 15. • Capturar la atención rápidamente utilizando adecuadamente texto, colores y gráficas • Enfatizar en el tema del sitio web • Preferir los banners GIF animados sobre los estáticos • El uso de frases que impliquen curiosidad, humor, miedo o preguntas. (Ejemplo: Sabía usted que…) • Incluir algún logo, dirección web o identificación gráfica de nuestro sitio • En cuanto a tamaño en píxeles los banners estándares son de 468 x 60 pixeles, existen también mini banners y banners de otras dimensiones, dependiendo del sitio que los exponga. • En Kb no deben tener más de 10 kb de tamaño ya que un banner demasiado grande tardará mucho en cargarse y no será visualizado por el visitante. • El uso de colore brillantes es más apropiado que colores oscuros. El negro ha demostrado ser menos efectivo. Entre los más recomendable está el azul, amarillo, naranja y verde. • Se debe aplicar colores que contrasten para que pueda leerse los mensajes o títulos • Aplicar mucha creatividad.
  • 16.
  • 17. • Se define con las dimensiones en píxeles de la matriz o cuadrícula. Si una imagen está formada por una matriz de 800 columnas por 500 filas, tiene entonces un tamaño de 800 x 500 píxeles. • Se suele utilizar el término “megapíxel” para simplificar las cifras: 1 megapíxel equivale a 1 millón de píxeles. Su problema es que es una medida que no da información acerca de sus dimensiones. Una imagen de 1000x400 tiene el mismo número de píxeles (400,000) que una de 800x500 pero, evidentemente, sus dimensiones son diferentes.
  • 18. Esta imagen tiene unas dimensiones de 400x261 píxeles, un total de 104.400 píxeles y 0,104 Megapíxeles.
  • 19. • El tamaño es la cantidad de información que contiene, medida en bits, Bytes, Mega, Giga, Tera. • Es conveniente aclarar que es usual escribir "bit" con "b" minúscula y "Byte" con mayúscula. • Si una imagen contiene 50 Bytes, éste es su tamaño de archivo: 50 Bytes. Si contuviera 50.000 Bytes, se suelen emplear múltiplos para afirmar su tamaño con más comodidad, que son el "KiloByte", el "MegaByte", el "GigaByte" o el "TeraByte". Con la siguiente tabla quedarán más claras las equivalencias entre ellos:
  • 20. Tabla de tamaños Nombre Abreviatura Tamaño Tamaño en Bytes bit b 1 bit (0 o 1) Byte B 8 bits 1 KiloByte KB 1.024 Bytes 1.024 MegaByte MB 1.024 KBytes 1.048.576 GigaByte GB 1.024 MBytes 1.073 millones
  • 21. FORMATO JPEG DIMENSIÓN 259 X 194 TAMAÑO O PESO 25 KB FORMATO GIF DIMENSIÓN 267 X 300 TAMAÑO O PESO 17.4 KB
  • 22. Estas imágenes tiene las siguientes dimensiones: Fantasma preocupado: 1152 x 864 Corazones 1024 x 768 Estrellas 1140 x 1080 Calcula el total de píxeles y megapixeles que contiene cada una
  • 23. WEBGRAFIA • http://es.wikipedia.org/wiki/Logotipo • http://es.wix.com/blog/2012/05/tips-html5-como-crear- encabezados-grandes/ • http://www.google.com.co/search?tbm=isch&hl=es&sourc e=hp&biw=1366&bih=667&q=fondos+para+web&gbv=2&o q=fondos+para+we&aq=0&aqi=g10&aql=&gs_l=img.1.0.0l1 0.832.2899.0.5341.14.10.0.4.4.1.270.1269.4j4j2.10.0...0.0.F EiYk-AoTIw • http://office.microsoft.com/es-hn/powerpoint- help/reducir-el-tamano-de-archivo-de-una-imagen- HA010192200.aspx (Reducir tamaño de imagen) • http://www.logotipia.com.ar/tipos-de-logotipos-diferentes- tipos-de-logos.asp