DISEÑO WEB I 20/08/14 ALGUNOS DATOS CUÁL SERÁ LA MECÁNICA? Ing. Jéber Gerardo Martínez Ríos. SESIÓN 1. Ing. Jéber Gerardo Martínez Ríos.

Transcripción

1 DISEÑO WEB I ALGUNOS DATOS Ing. Jéber Gerardo Martínez Ríos. Carrera: Ingeniero en Sistemas de Información (ITESM 2002) correo@menteinteractiva.com Skype: mente.interactiva Celular: SESIÓN 1 ISI JÉBER MARTÍNEZ ALGUNOS DATOS Ing. Jéber Gerardo Martínez Ríos. ALGUNOS DATOS Ing. Jéber Gerardo Martínez Ríos. Experiencia: Desarrollando Web desde que existe la Web como la conocemos (1996). 14 años como líder de proyectos Web, desarrollando y diseñando aplicaciones para la Web. 11 años como propietario de Mente Interactiva, empresa que desarrolla soluciones para la Web, aplicaciones Multimedia, apps Móviles. 10 años capacitando en empresas y universidades en temas de la Web. Proyecto Personal Actual: Mente Interactiva Estudios Centro de soluciones para Web, multimedia, posproducción de video, efectos visuales y de sonido, y jingles corporativos. Escuela Semillero para Profesionales de Artes Digitales. ALGUNOS DATOS Ing. Jéber Gerardo Martínez Ríos. Hobbies: Arte Digital Autoaprendizaje continuo Ejecución y composición musical Guitarra Eléctrica Videojuegos - Gamer desde 1988 Cine de todos tipos (fantasía, ciencia ficción, Pixar ) CUÁL SERÁ LA MECÁNICA? Método de Aprendizaje: Clase presencial Tareas en casa Prácticas en clase Autoaprendizaje Participación en el blog Participación en Facebook Clase Diseño WEB UCB 1

2 DISEÑO WEB 1 Objetivo General: Aprender a diseñar para la Web. Lograr la capacitación base para trabajar en el sector de Internet. Actividades Específicas: Conceptos de informática básico en Web Tratamiento de imagen e interfaces en la Web Usabilidad en la Web Sintaxis y manejo de HTML5, CSS2, CSS3, Javascript Maquetación Web Manejo de Herramientas de edición Adobe Dreamweaver CS6, Photoshop CS6 y Edge. Diseño Web (Tendencias, herramientas, blogging, contenidos, arquitectura ) POR QUÉ APRENDER A DISEÑAR PARA LA WEB? El diseñador gráfico del siglo XXI es un profesional versátil capaz de adaptarse a cualquiera de los formatos de los nuevos entornos digitales: ya no basta sólo con saber diseñar un cartel publicitario, sino que se requieren competencias en el diseño y programación web, la creación de gráficos vectoriales, la maquetación de páginas web o la creación de infografías avanzadas. Tan sólo aquellos diseñadores que sean capaces de adaptarse a los continuos cambios de la realidad digital podrán triunfar en el nuevo marco laboral. EVALUACIÓN PARCIAL Temas Valor Examen Parcial 40% Prácticas 30% Participación y Tareas 20% Ejercicio Integrador 10% EVALUACIÓN FINAL Temas Valor Examenes Parciales 30% Prácticas 15% Participación y Tareas 15% Trabajo Final 40% REGLAS DEL JUEGO Asistencia Puntual (la clase empieza a los 5 minutos de la hora), llegar con anticipación pues pasado el tiempo tendrán inasistencia. Hacer el smartphone a un lado. obviamente, APAGAR EL CELULAR, O BIEN, MANTENERLO EN VIBRADOR. Abstenerse de Facebookitis o Twittercitis. No se permite filmar en clase bajo ninguna circunstancia. No gritar ni alzar la voz. à Respeto ß Participar, participar y participar. 2

3 CADA 60 SEGUNDOS Un dominio.com es registrado Se publican 98,000 tweets Se actualizan 695,000 status de Facebook. Hay 510,040 comentarios en muros de Facebook. Se hacen 694,445 búsquedas en Google. Se crean 60 nuevos Blogs. Se publican 600 videos nuevos en YouTube. Se preguntan 100 cosas en Yahoo (y se contestan 60). QUÉ ES INTERNET? TIM BERNERS-LEE Hola, soy Tim Berners Lee qué quién soy? Ah. Solo inventé la Internet. La Web (Internet) es una red de computadoras interconectadas hablándose una a otra. Idea originada en el Departamento de Defensa de Estados Unidos en los 60s como una forma de mantener comunicación en caso de una Guerra Nuclear (Guerra Fría). WWW La Web también conocida como WWW (la World Wide Web) es un sistema de distribución de información basado en hipertexto. Creada en 1989 por el inglés Tim Berners-Lee en CERN, Suiza. Sir Tim Berners-Lee es considerado el padre de la web por inventar HTML. Computadora NeXT, conocida como El Cubo creada por la compañía de Steve Jobs. INTERNET EN MÉXICO El Instituto Tecnológico y de Estudios Superiores de Monterrey estableció el primer enlace dedicado a la red de la National Science Foundation por medio de la Escuela de Medicina de la Universidad de Texas, utilizando los protocolos de conexión propios de internet. El segundo punto que logró conectarse a la red se estableció en el Instituto de Astronomía de la Universidad Nacional Autónoma de México por medio del Centro Nacional de Investigación Atmosférica de Boulder, Colorado, en Estados Unidos. Para 1994, la red de redes dejó de ser de uso exclusivo de las universidades y para febrero de 1995 se metió al ciberespacio el primer periódico mexicano: La Jornada. Entre octubre de 1995 a enero de 1996 ocurrió la explosión: un promedio de 30 dominios por mes se registraron en el país y a comienzos de 1997 ya existían más de 150 proveedores de acceso a internet en los principales centros urbanos de México como Guadalajara, Monterrey, el Distrito Federal, Puebla, Mérida, Tijuana, entre otros. 3

4 INTERNET EN MÉXICO La Presidencia de la República no contó con un espacio en la World Wide Web hasta septiembre de 1996, para el segundo informe de gobierno del entonces presidente Ernesto Zedillo. La masificación era cosa de meses y aparecieron en México uno de esos icónicos lugares que todavía pueden encontrarse en algún rincón del país en donde la infraestructura y situaciones económicas no sean suficientes: los cibercafés. QUÉ ES UNA PÁGINA WEB? Es una colección de archivos escritos comúnmente en HTML ubicados en un punto de la Web en un servidor. A su vez puede contener otros archivos como imágenes, videos u otros que soporte Internet. 4

5 QUÉ ES UNA PÁGINA WEB? Es una colección de archivos escritos comúnmente en HTML ubicados en un punto de la Web en un servidor. A su vez puede contener otros archivos como imágenes, videos u otros que soporte Internet. INTERNET PARA MORTALES CLIENTE Y SERVIDOR. CLIENTE SITIO WEB SERVIDOR OOOOK, SERVIDOR ENTONCES ES Donde están alojados todos los archivos de una web. Cuando queremos tener nuestra página en la web normalmente es lo que se le conoce como Hosting o Web hosting. Un servidor sirve para servir páginas o sitios web. Cuando un browser solicita una página el servidor atiende la petición y la manda. CÓMO SE ENCUENTRA UNA PÁGINA Respuesta corta: tecleando la URL o la dirección de la web. Otra opción es buscando en motores de búsqueda como Google. URL URL=UNIFORM RESOURCE LOCATOR: Es una manera fundamental de especificar qué queremos ver en la Web. El formato de una URL es: protocol://nombre del host/otra información ftp://pagina.com/archivo.html DOMINIOS, IP S Una IP es una dirección que consta de 4 sets de números que van del 0 al 256 para identificar una computadora, ej: Un dominio es una palabra con terminación.com (aunque también hay otras) manera amigable para identificar una IP o dirección de Web. qué otras terminaciones conoces? 5

6 HTTP Acrónimo de Hypertext Transfer Protocol: el lenguaje de los sitios Web. https es Hypertext Transfer Protocol SECURED. Significa que el Sitio Web tiene una capa especial de encripción para esconder información personal o contraseñas. Ej: Bancos o sitios de . HTML HYPERTEXT MARKUP LANGUAGE o Lenguaje de Marcado de Hipertexto. Es el lenguaje en el que escribiremos páginas Web. HTML usa comandos llamados etiquetas HTML que lucen de la siguiente manera: <body></body> <a href=" <title></title> BROWSERS Un browser o navegador, es un programa para ver páginas Web. BROWSERS NEXUS (1993) Todo inició con Nexus en En 1993, Mosaic era popular. También figuraba Lynx. En 1994, apareció Netscape Navigator. En 1995 aparece Internet Explorer 1. En 1998 surge Mozilla. En el 2001, se creó uno de los peores navegadores de la historia: Internet Explorer 6. 6

7 MOSAIC (1993) LYNX (1993) Y FIREFOX RENDERIZANDO LA MISMA PÁGINA INTERNET EXPLORER 1.0 (1995) INTERNET EXPLORER 4.0 (1997) OPERA 5 (2000) INTERNET EXPLORER 6.0 (2001) 7

8 BROWSERS MODERNOS BROWSERS W3C Es la World Wide Web Consortium, organización no lucrativa fundada por TBL y conformada por empresas involucradas en la Web. Ellos establecen las reglas del juego en el diseño Web. Los estándares y guías para hacer la Web un mejor lugar. TAREA 1 INVESTIGAR LOS SIGUIENTES TÉRMINOS, Y ESCRIBIRLOS A MANO CON SUS PALABRAS: QUÉ ES HTML5 QUÉ ES CSS QUÉ ES JAVASCRIPT QUÉ ES JQUERY QUÉ SON LAS WEB SAFE FONTS QUÉ ES UN BLOG DEFINE CLOUD COMPUTING DARSE DE ALTA EN EL GRUPO DE FACEBOOK 8