LOS SECRETOS PARA CREAR PÁGINAS QUE CARGAN RÁPIDO Y FÁCIL DE NAVEGAR Preparado Por Prof. Edgar Lopategui.

Slides:



Advertisements
Presentaciones similares
Dreamweaver Primeros Pasos.
Advertisements

Departamento de Comunicación Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México Instituto Tecnológico y de Estudios.
Capa 6 Capa de Presentación
Nau Gran dHivern Intr. a la creación y gestión de páginas web Introducción a la web.
Una página web es una fuente de información adaptada para la World Wide Web(WWW) y accesible mediante un navegador de Internet. Un sitio web es un conjunto.
DIEZ PASOS PARA LA PUBLICACIÓN DE UN SITIO WEB EXITOSO
LOS PRINCIPIOS DE UN DISEÑO EFECTIVO DE PÁGINAS WWW
Introducción al Uso y Manejo de la Computadora
La red Internet 1er tarea corta: Entregar dos páginas a doble espacio con Arial 12 de la historia de Internet (presente, pasado y futuro). internet =
La sede Web Sede de un sitio Web En todos los proyectos en los que el diseño es parte fundamental, es importante tener las ideas claras desde el principio.
ELEMENTOS DEFINICIÓN HIPERTEXTO DIMENSIONES ESTRUCTURA.
Internet ¿Qué es Internet? ¿Quiénes están en Internet?
Introduccion a los Sistemas de Grabacion Digital de Video
INTRODUCCION A LA COMPUTACION
                                              ADR1600E VIDEOGRABADORA DIGITAL.
INSTITUTO TECNOLOGICO DE VERACRUZ
Yinette Domínguez Olivieri COSC A. A través de esta presentación se pretende informar sobre dos servicios que existen llamados Dropbox y Skydrive.
Mapa de Bit Unidad de medida: DPI, PPI o PPP (píxeles por pulgada) RESOLUCIÓN La resolución seleccionada dependerá del medio en el cual se concluirá el.
MENU ARCHIVO.
DISEÑO DE PAGINAS WEB Las páginas Web son documentos de hipertexto y multimedia. Son documentos multimedia que incorporan imágenes, videos, animaciones,
PRESENTACIONES EFECTIVAS Licda. Maura de Magaña Sábado de 7:00 a 12:00
Diseño Web y Multimedia 1 Clase 1 Docente: Josué Fortis.
Clase 2 Tecnología de la Comunicación II Lic. en Com. Social, Lic. en Periodismo, Locutor Nacional y Periodismo Universitario F AC. DE C S. H UMANAS. UNSL.
Paginas WEB Creación, actualización y manipulación de paginas web.
Diseño de Páginas Web Unidad 7. 5 puntos imprescindibles 11. Conocer los grupos de trabajo que sobre la red tratan la accesibilidad y el intercambio de.
FORMATO DE ARCHIVOS.
Tipos de imágenes Bitmap (rasterizada, matricial) Vectoriales
Clase 1 Creación y edición de imágenes digitales
FICHEROS DE IMAGEN FUENTES WEB: Gráficos GIF & JPEG, Ramón Montero, 1998 Formatos para la Wb, Luciano Moreno, 2005.
DESARROLLO DE PÁGINAS EN EL WEB Preparado por Prof. Edgar Lopategui Corsino.
Unidad didáctica 6 Diseño de páginas Web.
Escuela: Colegio de bachilleres 20 del valle Materia: tecnología de la información y comunicación.
Formatos de imagen. 800 Pixeles 600 Pixeles PIXEL (Picture Elementary )
Desarrollo y Características de Documentos Electrónicos
L A W EB Integrantes: Felipe Salinas Francisco Sepúlveda Javier Silva Renzo Ubilla Manuel Videla.
Edición de Páginas Web CFIE DE SEGOVIA Enero-Febrero 2006.
Introducción al Lenguaje. ¿Qué es PHP? O Es un lenguaje de programación que es interpretado por un servidor web. O El lenguaje es genérico. PHP está orientado.
Formato de archivo informático Un formato de archivo informático ( o formato de fichero informático) es una manera particular de codificar información.
Navegadores Web y Etiquetas HTML Dra. Leticia Flores Pulido Introducción a la Ingeniería en Computación.
I M A G E N E S. muestra la imagen "IMAGEN.JPG" que se encuentra en la URL
CONFECCIÓN DE PÁGINAS WEB CON MS FRONT PAGE - TICEQ Prof: Dr. Carlos A. Núñez Dpto. Química Física, U.H
FUNDAMENTOS TECNOLÓGICOS DE INFORMACIÓN Internet y World Wide Web.
Tipos de archivos de audio John sebastian cruz miranda Sebastian bustamante palacio 8a.
Clase 2 Tecnología de la Comunicación II Lics. en Com. Social y Periodismo F AC. DE C S. H UMANAS. UNSL. Creación y edición de imágenes digitales.
Formatos de imagen Las imágenes digitales se pueden guardar en distintos formatos. Cada uno se corresponde con una extensión específica del archivo que.
 Este protocolo opera a través de solicitudes y respuestas, entre un "cliente" y un "servidor". El cliente para los usuarios es el navegador web, usado.
INTERNET Y WEB. ORÍGENES DE INTERNET Internet se remonta al temprano desarrollo de las redes de comunicación. La idea de una red de ordenadores diseñada.
HTML Prof. Oscar Marroquin Mollinedo. Desarrollo web Desarrollo web es un título algo arbitrario para el conjunto de tecnologías de software del lado.
Características de una imagen digital
Imágenes Las imágenes que se utilizan para trabajar normalmente se encuentran en formato TIFF o alguno de los formatos propios de las aplicaciones (por.
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. ◦
Pablo Javier Marchorro Trabajo de Tics. Cookies Es un fragmento de información que se almacena en el disco duro del visitante de una página web a través.
 Buscador es una página web en la que se ofrece consultar una base de datos en la cual se relacionan direcciones de páginas web con su contenidopágina.
T AREA DE C OMPU.. I NDICE Qué son Cookies. Qué son Gifts. Qué es un Banner.
LAURA MARTÍNEZ SASTRE. ¿QUÉ ES UN SISTEMA OPERATIVO? Un Sistema Operativo es el software básico de un ordenador que provee una interfaz entre el resto.
TEMARIO DE COMPUTACIÓN. WINDOWS ESCRITORIO ACCESOS DIRECTOS CARPETAS ALMACENADAS EN ESCRITORIO WINDOWS 7 (VENTANAS EN MOSAICO)
Incompetencia de verano Primera fase: preguntas. A) El administrador de archivos del Sistema Operativo Microsoft Windows recibe el nombre de? 8)
Internet y Navegadores Unidad 5. Fecha: 1 de agosto de 2011 Periodo# : 2 Objetivo: identificar el contenido de una dirección web Tema: Elementos de una.
Naime Cecilia del Toro Alvarez
Bitmap.
Formato de sitios Requisitos y Recomendaciones Técnicas.
AUDIO Y VIDEO DIGITAL. DEFINICIÓN -AUDIO DIGITAL: Es la codificación digital de una señal eléctrica que representa una onda sonora. -VIDEO DIGITAL: Es.
R EPÚBLICA B OLIVARIANA D E V ENEZUELA M INISTERIO D EL P ODER P OPULAR P ARA L A D EFENSA U NIVERSIDAD N ACIONAL E XPERIMENTAL D E L A F UERZA A RMADA.
ELEMENTOS DE LA WED. Una página web es una fuente de información adaptada para la World Wide Web (WWW) y accesible mediante un navegador de Internet.
Creación y tratamiento de imágenes digitales
CONCEPTOS BÁSICOS DE COMPUTACIÓN
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.
FORMATOS DE VIDEO.AVI Se adapta para ser interpretado por unos códecs. No es uno de los mejores contenedores pero sí uno de los más utilizados por su antigüedad.
GESTIÓN Y ADMINISTRACIÓN WEB. INTRODUCCIÓN A INTERNET Internet constituye una vía de comunicación y una fuente de recursos de información a escala mundial.
Integración de objetos y de multimedia en páginas HTML5.
Transcripción de la presentación:

LOS SECRETOS PARA CREAR PÁGINAS QUE CARGAN RÁPIDO Y FÁCIL DE NAVEGAR Preparado Por Prof. Edgar Lopategui

Gráficas Texto Tecnología que se emplea en las páginas WWW Servidor * Contenido * PÁGINAS QUE CARGAN RÁPIDO

GIF: –Comprime los archivos –Se pueden abrir de nuevo sin el temor de perder información JPEG: –Se especifica el grado de compresión: »Bajo, Mediano o Alta (Se recomienda el mediano) –Si se abren de nuevo se puede perder información * Gráficas - Formatos * PÁGINAS QUE CARGAN RÁPIDO

GIF (Archivos Comprimidos): –Animación –Trabajos de arte Lineal –Texto de gráficas –256 colores (emplear la menor cantidad de colores posibles) * Gráficas - Formatos * PÁGINAS QUE CARGAN RÁPIDO JPEG (Se Puede Especificar la Compresión : –Fotografía –Trabajo de arte, 3D, Mezclas, Sombras –16 millones de colores –Anti-aliasing: Recargado (para texto es malo)

Cualquier gráfica solamente emplea 216 colores (colores seguros para navegadores): –Cualquier computadora PC o Mac reconoce un máximo de 256 colores, solo 216 de estos colores son comunes en los navegadores y sistema operativos –No se deben mezclar (dithering), solamente contrastar los colores. –Emplear no más de 35 colores PÁGINAS QUE CARGAN RÁPIDO * Gráficas - Recomendaciones *

La gráfica no debe ser mayor de 30 K: –Comunmente, si la gráfica no subre entre 5 y 10 segundos, el visitante se aburre y pasa a otra dirección en el Web –Reusar la imágenes: Evitar transferir imágenes de 30k o 10k para cada página Al reusar imágenes, la transferencia puede ser de 5k a 10k por página PÁGINAS QUE CARGAN RÁPIDO * Gráficas - Recomendaciones *

Reducir la imagen a una profundidad o resolución de 8 bits (256 colores): –Paleta de 256 –No mezclan efectivamente (dithering) Convertir la imagen en un índice de color: –Paleta que selecciona un límite específico de colores de la imagen hasta un máximo de 256: »Esto reduce el tamaño del archivo sin sacrificar su resolución »Como resultado, la imagen carga más rápido en la página WWW PÁGINAS QUE CARGAN RÁPIDO * Gráficas - Recomendaciones *

Recomendaciones en cuanto a la configuración de la gráfica: dot per inch (dpi): –72 dpi (monitores exhiben de 72 a 96 dpi) Resolución: 640 X 480 GIF Transparentes (Eliminan lo Blanco): –Evitarlas, puesto que toman tiempo en cargar GIF Interlaced: Evitarlas, JPEG Progresivo: Evitarlas PÁGINAS QUE CARGAN RÁPIDO * Gráficas - Recomendaciones *

Almacenar las gráficas dentro de una carpeta/archivó común para todas las páginas creadas: –Reusar las gráficas Colocar en el cache (área de almacenaje en la memoria o disco duro) del navegador de el usuario: –Reusar las gráficas - cargan rápido Eliminar todo lo que esté en exceso de la imagen PÁGINAS QUE CARGAN RÁPIDO * Gráficas - Recomendaciones *

Programa de Compresión: PÁGINAS QUE CARGAN RÁPIDO * Gráficas - Direcciones/URL *

WIDTH =512 HEIGHT=100> PÁGINAS QUE CARGAN RÁPIDO * Gráficas - Baja Resolución * Pegar este último código al final del documento

PÁGINAS QUE CARGAN RÁPIDO * Texto - Recomendaciones * Eliminar cualquier basura que no se necesite: –Limpiar el Texto (HTML) - Un programa bueno para esto es DrumBeat. También se puede utilizar Note Pad. Cotege su programa de diseño de páginas WWW, puede producir inflación de los visualizado (navegadores del Web): –Pueden añadir texto innecesario (e.g., )

PÁGINAS QUE CARGAN RÁPIDO * Texto - Recomendaciones * Tipografía: –Emplear tipos de letras comunes para todas las computadoras (e.g., Times Roman, Arial, Helvetica, entre otras)

PÁGINAS QUE CARGAN RÁPIDO * Servidores * Colocar nuestros archivos en servidores que son geográficamente cerca a los usuario, no a nosotros, es pro a ellos Considerar el sistema operativo que emplea el servidor: –El más rápido es UNIX Considerar la versión del protoloco de hipertexto: –El más rápido es HTTP 1.1

PÁGINAS QUE CARGAN RÁPIDO * Servidores * Considerar la velocidad del CPU del Servidor (Debe aser Rápido): –Recomendado: » Pentium Pro »Power PC Considerar la memoria del servidor (mucha): –Recomendado: » De 256 K a 512 K

PÁGINAS QUE CARGAN RÁPIDO * Servidores * El servidor hace un cache de tus páginas: –Las mantiene en memoria Considerar el ancho de banda: –Recomendado: » Modem de 56 K »T1 fraccionada (e.g., 5 canales) »DSL/ISDN »T1 completa, Cable »T3 »OC3, OC12, C48

PÁGINAS QUE CARGAN RÁPIDO * Servidores * Si se sale de la Columna Vertebral (Backbone) principal de la internet

PÁGINAS QUE CARGAN RÁPIDO * Tecnología * Audio: –Emplear solo lo que es compatible con las PC o Mac: » Evitar el uso de Wave y Midi »Emplear Real Audio Versio 2.0 Video: –Emplear Real Video: »Streaming »Quiktime ver 1.0 (Compatible)

PÁGINAS QUE CARGAN RÁPIDO * Tecnología * Animación: –Evitar plugins de: » Shockwave »Flash »Otras tecnologías Evitar lo incrustado (EMBED):