+ Optimización de imágenes para la Web Dirección General de Tecnología de Información.

Slides:



Advertisements
Presentaciones similares
Desarrollo de sitios Web como innovación tecnológica para el investigador. RAÚL MANUEL ARANO CHÁVEZ.
Advertisements

Soporte computacional y de software Temas relacionados con el acceso y uso de recursos electrónicos.
LOS SECRETOS PARA CREAR PÁGINAS QUE CARGAN RÁPIDO Y FÁCIL DE NAVEGAR Preparado Por Prof. Edgar Lopategui.
LOS PRINCIPIOS DE UN DISEÑO EFECTIVO DE PÁGINAS WWW
Conociendo el sitio privado del estudiante. Al ingresar por primera vez al sitio privado, está será la pantalla que encontrarán.
Haga clic para modificar el Nombre del autor Puesto del autor Haga clic para modificar el Nombre del autor Puesto del autor Haga clic para modificar el.
Arquitectura de la información en sitios web y Usabilidad
MERCADEO ELECTRÓNICO – Posicionamiento SEM y SEO SEM: Search Engine Marketing SEO: Search Engine Optimization.
Del web al WAP: presente y futuro de la aplicación de Internet Móvil en la docencia Jesús M. Álvarez Llorente Dpto. Informática. Universidad de Extremadura.
Diplomado de diseño Web Nivel I Ingeniero: Alexander Henao M. Cel.:
Analisis de Heatmaps Cliente: Diario Hoy. Objetivos Análisis de los sectores más populares Tendencias de navegación Respuesta detectada de sectores claves.
David Escudero Mancebo Alfonso Pedriza Rebollo
Aplicaciones en línea:aquellas aplicaciones que los usuarios pueden utilizar accediendo a un servidor web a través de Internet o de una intranet mediante.
CLASE 4: SLICES Y DISEÑO Tutorial de práctica. Ejercicio – Clase 4  Puntos importantes: 1. Evaluar el contenido 2. La navegación (menú) 3. Elementos.
IMPORTANCIA DE LA TIPOGRAFIA
+ Capacitación: Portal Universitario 2012 Dirección de Desarrollo Informático de Apoyo Académico.
CREACIÓN DE SITIOS WEB REINALDO DUQUE S. Profesor de tecnología COLEGIO CLERMONT Febrero de 2008.
Manual de Ayuda para el usuario del ing Explorer.
Herramientas de Diseño
Preparación de textos HTML, PDF y MSWord Julio Takayama Silvia de Medeiros Cabral Oficina de Comunicación y Marketing BIREME - OPAS - OMS Julio Takayama.
Presentado por: Denisse Saltos Tiziana Herrera.
TALLER GENERAL Nº 1 El Blog Docente Adrián Villegas Dianta.
Windows XP Prof. Martín Eduardo Moreyra Navarrete
Usabilidad y accesibilidad en el diseño de sitios Web.
Capacitación de Herramientas para el Desarrollo WEB Modulo III- Compresión y Formato de Imágenes Sesión #1 María Paz Coloma M.
Definición de requerimientos
Aplicación y uso de la herramienta
 Un método para guardar y almacenar las páginas web en un solo lugar en línea para su uso futuro o para compartir con otros usuarios de Internet. Marcadores.
LOGO e-Learning Desktop Integración de RIA’s a objetos de Aprendizaje Alvaro Rodríguez, Darvin Orozco, Rocael Hernández Universidad Galileo {alvrodriguez,
Análisis de Usabilidad de página web : cartoonnetwork. com
Editor de fotografías Programa: GIMP (y 2). MUY IMPORTANTE El formato JPG está basado en filtros y algoritmos de compresión que provocan una pérdida.
“Uso de internet seguro” Diego Morales Krause Estudiante en práctica Universidad de los Lagos.
Piktochart M.I.S.T. Miguel Ángel Romero Ochoa Hermosillo, Sonora, México. Octubre 2014 Espacio educativo: Nuevas Tecnologías de la Información y la Comunicación.
CONCEPTOS. Una página web es un documento creado en formato HTML (Hypertext Markup Language) que es parte de un grupo de documentos hipertexto o recursos.
1.Qué debemos pensar primeroQué debemos pensar primero 2.Presentaciones exitosasPresentaciones exitosas 3.Pautas a cumplir antes de iniciar el armado en.
Son aplicaciones cuya principal función es poder buscar cualquier cosa que exista en el mundo como un monumento nacional en EE.UU, la calle donde vive.
FACULTAD DE CIENCIAS ECONÓMICAS Y EMPRESARIALES PASOS PARA INSTALAR JOOMLA MIGUEL OTERO R. PROFESOR: JONATHAN VEGA GESTIÓN DE INFORMACIÓN WEB.
ELABORACIÓN DE PÁGINAS WEB
LOS GIFS ANIMADOS.
Antivirus Proxy Ana karen, xochitl, galena, Dennis!
UNIVERSIDAD TECNOLÓGICA ECOTEC. ISO 9001:2008 Taller Utilice Power Point para elaborar una presentación y responder las siguientes preguntas: 1) ¿Qué es.
 Una página web es el nombre de un documento o información electrónica adaptada para la World Wide Web y que puede ser accedida mediante un navegador.
UDLA COMUNICACIÓN CORPORATIVA Ing. Boris Gómez.  Flash CS4 es una potente herramienta desarrollada por Adobe  Flash fue creado con el objeto de realizar.
Cristian Fonnegra Marin. DISEÑO WEB.
I NSTITUTO T ECNOLÓGICO S UPERIOR “D ANIEL Á LVAREZ BURNEO ” OPTIMIZACION DE IMAGNES Ing. María Cristina Carrillo Integrantes:  Anita Carrión  Gabriela.
Anatomía de un sitio web
Obtención de la imagen digital  Existen dos maneras de obtener una imagen digital: ◦ Capturando una escena real con una cámara fotográfica digital. ◦
Término que surgió un poco después de la expansión de Internet a finales de los años 90
Juan Pablo Piedrahita(9C) Santiago tamayo (9C) CARLOS FERNANDEZ DOCENTE DE TECNOLOGIA E INFORMATICA GRADO 9ºC INSTITUCION EDUCATIVA LA SALLE DE CAMPOAMOR.
Diseño Multimedia Photoshop. ¿Qué es? Es una aplicación informática que trabaja sobre fotografías y permite realizar tareas de edición y retoque de imagen.
Navegador avant browser, equipo 7, grupo 602.
Derechos de autor La propiedad intelectual consiste en cualquier cosa que un individuo haya escrito o creado. Puede ser música, texto, pinturas, fotografías,
Diseño de Interfaces Humanas David Cuerva Trujillo.
Cándida Gallardo Tutorial de Wikispaces Comenzar a escribir 1. Entra en la Wiki del curso:
 El término WikiWiki es de origen hawaiano que significa: rápido.  Es un sitio web cuyas páginas pueden ser editadas por múltiples voluntarios a través.
Por: Mayela Mascorro Aplicación de las Tecnologías de la Información, Grupo 003. UNIVERSIDAD AUTÓNOMA DE NUEVO LEÓN FACULTAD DE ARQUITECTURA.
Bitmap.
Creación y publicación de sitios web R e d d e P r o f e s o r e s I n n o v a d o r e s Módulo: Creación y publicación de sitios web.
RECURSOS Sala de Audiovisuales: Tablero, marcadores, Videobeam, computador. Sala de Audiovisuales: Tablero, marcadores, Videobeam, computador. Sala de.
Antes tomar una fotografía no era algo tan común como ahora, ya que Era mucho mas costoso y además tenias que ir a una tienda especializada para La revelación.
 OFIMATICA  PRESENTACIONES  BLOGS  WIKIS  MARCADORES SOCIALES  AGREGADORES  VIDEOS  IMÁGENES  AUDIO/PODCAST  NOTICIAS  MICROBLOGGING  GEOLOCACION.
Aula de Tecnologías La imagen digital Aula de Tecnologías
Ricardo Ovalle Navarro Isi Suriel Ponce Misael Arvizu Monserrate Contreras.
Macromedia Dreamweaver es un editor profesional de páginas Web. Permite crear sitios tanto escribiendo directamente el código en HTML, como diseñando de.
AGENCIA LATINOAMERICANA DE NOTICIAS DE LA JUVENTUD PROCEDIMIENTO BÁSICO PARA INSERTAR NOTAS, IMÁGENES Y VIDEOS.
Capitulo 3 Diseño de rótulos. Creación de una jerarquía visual clara Uno de nuestros mejores métodos para que nuestra pagina retenga atención es asegurándonos.
Una de las características de un sitio Web eficaz es mostrar sus contenidos de manera accesible y vincular de manera fácil a documentos de diferentes.
Diseño de un Sitio Web Estrategias y pautas a tener en cuenta.
Web 1.0 VS web 2.0 cuadro comparativo.
EJEMPLOS DE IMÁGENES EN PHOTOSHOP por SISTEMAS.
Transcripción de la presentación:

+ Optimización de imágenes para la Web Dirección General de Tecnología de Información

+ Introducción

+ Creación de una jerarquía visual clara “Lo más importante es lo más prominente” División en zonas claramente delimitadas Se aprovechan las convenciones de lectura La Web es visual, 40% de las personas que navegan en Internet, responden mejor a la información visual que al texto aspx aspx

+ ¿Por qué optimizar mis imágenes?

+ ¿Cuánto tiempo espera el usuario a que cargue la página antes de abandonarla? = 2 segundos html html users-flee-slow-loading-sites.html users-flee-slow-loading-sites.html Se contribuye a la usabilidad del sitio y se maximiza la experiencia de uso de las personas Se apoya el ahorro de ancho de banda

+ ¿Qué impacto tiene en mis usuarios la optimización de imágenes de mi sitio?

+ Sitios Web lentos generan una percepción de credibilidad baja en los usuarios Aplicaciones lentas generan frustración en las personas Sitios Web rápidos tienen una tasa alta de conversión por parte de usuarios Sitios Web rápidos generan una percepción de calidad, despiertan mayor interés y atracción por parte de los usuarios

+ ¿Cómo puedo optimizar mis imágenes?

+ Utilizando programas como Adobe Photoshop o GIMP Utilizando herramientas en línea como Configuración de imágenes recomendada 72 dpi, óptimo para Web Calidad a 60% (revisar la pérdida de calidad) Utilizar formatos adecuados de imagen lossless vs lossy(.jpg,.png,.gif) Se recomienda el guardado progresivo de imágenes para la Web

+ Portal UV

+ Proceso de optimización Photoshop

+ Proceso de optimización Gimp

+ Medidas y peso de imágenes Photoshop 925 x 320 px 233x320 px 52.9kb 26.3Kb Gimp 925 x 320 px 233x320 px 26.5kb 14.3Kb

+ Recomendaciones No bajar imágenes o fotografías de Internet Tomar fotografías con cámaras de buena resolución Observar que la foto o imagen este enfocada, con buena luz y a cuadro Verificar que la imagen no tenga alguna marca registrada Que la imagen logre el objetivo deseado cuidando la composición

+ Optimización de imágenes para la Web Dirección General de Tecnología de Información