Download - 02 introducción al diseño web
![Page 1: 02 introducción al diseño web](https://reader033.vdocumento.com/reader033/viewer/2022051110/54c5713d4a795946468b4610/html5/thumbnails/1.jpg)
MAESTRÍA EN MEDIOS INTERACTIVOSCurso Propedéutico
2010
![Page 2: 02 introducción al diseño web](https://reader033.vdocumento.com/reader033/viewer/2022051110/54c5713d4a795946468b4610/html5/thumbnails/2.jpg)
INTRODUCCIÓN AL DISEÑO WEB
02
![Page 3: 02 introducción al diseño web](https://reader033.vdocumento.com/reader033/viewer/2022051110/54c5713d4a795946468b4610/html5/thumbnails/3.jpg)
CONTENIDO
• Proceso de desarrollo de proyectos Web
• Consejos para la ejecución de proyectos Web
• Página y sitio Web
![Page 4: 02 introducción al diseño web](https://reader033.vdocumento.com/reader033/viewer/2022051110/54c5713d4a795946468b4610/html5/thumbnails/4.jpg)
PROCESO DE DESARROLLOde proyectos Web
![Page 5: 02 introducción al diseño web](https://reader033.vdocumento.com/reader033/viewer/2022051110/54c5713d4a795946468b4610/html5/thumbnails/5.jpg)
PROCESO DE DESARROLLO DE PROYECTOS WEB
• Definición mínima:
El diseño Web es una actividad que consiste en la planificación, diseño e implementación de páginas y sitios Web.
es.wikipedia.org
![Page 6: 02 introducción al diseño web](https://reader033.vdocumento.com/reader033/viewer/2022051110/54c5713d4a795946468b4610/html5/thumbnails/6.jpg)
PROCESO DE DESARROLLO DE PROYECTOS WEB
• Cada proyecto Web plantea desafíos únicos, sin embargo el proceso general de un sitio Web complejo implica seis etapas de desarrollo:
• Definición del sitio y planificación
• Arquitectura de Información
• Diseño del sitio
• Construcción del sitio
• Marketing
• Seguimiento, evaluación y mantenimientoJ. Lynch Patrick. Web style guide: Basic Design Principles for Creating Web Sites
![Page 7: 02 introducción al diseño web](https://reader033.vdocumento.com/reader033/viewer/2022051110/54c5713d4a795946468b4610/html5/thumbnails/7.jpg)
Proceso de desarrollo WebJ. Lynch Patrick. Web style guide: Basic Design Principles for Creating Web Sites
![Page 8: 02 introducción al diseño web](https://reader033.vdocumento.com/reader033/viewer/2022051110/54c5713d4a795946468b4610/html5/thumbnails/8.jpg)
CONSEJOS
• Carguen, preparen, apunten..., fuego!
• Olvidar el aspecto visual hasta asegurar que todo lo demás está previsto
• Menos es más
• Primero planear el trabajo, después trabajar el plan
J. Lynch Patrick. Web style guide: Basic Design Principles for Creating Web Sites
![Page 9: 02 introducción al diseño web](https://reader033.vdocumento.com/reader033/viewer/2022051110/54c5713d4a795946468b4610/html5/thumbnails/9.jpg)
CONSEJOS
• Ser invisible
• Los estándares son amigos
• Iterar y después, iterar nuevamente
• Los usuarios buscan comunicarse con personas, no con máquinas
J. Lynch Patrick. Web style guide: Basic Design Principles for Creating Web Sites
![Page 10: 02 introducción al diseño web](https://reader033.vdocumento.com/reader033/viewer/2022051110/54c5713d4a795946468b4610/html5/thumbnails/10.jpg)
PÁGINA Y SITIO WEB
• Página Web:• Simple documento de texto plano (caracteres alfanuméricos y especiales)adicionado con
texto del lenguaje de marcado de hipertexto (HTML). El documento se visualiza en un navegador a través del protocolo HTTP de Internet.
![Page 11: 02 introducción al diseño web](https://reader033.vdocumento.com/reader033/viewer/2022051110/54c5713d4a795946468b4610/html5/thumbnails/11.jpg)
PÁGINA Y SITIO WEB
• Sitio Web:• Colección de páginas Web enlazadas una a otra. El conjunto de documentos se visualiza en
un navegador a través del protocolo HTTP de Internet.
![Page 12: 02 introducción al diseño web](https://reader033.vdocumento.com/reader033/viewer/2022051110/54c5713d4a795946468b4610/html5/thumbnails/12.jpg)
PÁGINA Y SITIO WEB• Anatomía de una página Web
![Page 13: 02 introducción al diseño web](https://reader033.vdocumento.com/reader033/viewer/2022051110/54c5713d4a795946468b4610/html5/thumbnails/13.jpg)
PÁGINA Y SITIO WEB• Anatomía de una página Web
![Page 14: 02 introducción al diseño web](https://reader033.vdocumento.com/reader033/viewer/2022051110/54c5713d4a795946468b4610/html5/thumbnails/14.jpg)
PÁGINA Y SITIO WEB• Anatomía de una página Web
![Page 15: 02 introducción al diseño web](https://reader033.vdocumento.com/reader033/viewer/2022051110/54c5713d4a795946468b4610/html5/thumbnails/15.jpg)
PÁGINA Y SITIO WEB• Anatomía de una página Web
![Page 16: 02 introducción al diseño web](https://reader033.vdocumento.com/reader033/viewer/2022051110/54c5713d4a795946468b4610/html5/thumbnails/16.jpg)
PÁGINA Y SITIO WEB• Anatomía de una página Web
![Page 17: 02 introducción al diseño web](https://reader033.vdocumento.com/reader033/viewer/2022051110/54c5713d4a795946468b4610/html5/thumbnails/17.jpg)
PÁGINA Y SITIO WEB• Anatomía de una página Web
![Page 18: 02 introducción al diseño web](https://reader033.vdocumento.com/reader033/viewer/2022051110/54c5713d4a795946468b4610/html5/thumbnails/18.jpg)
PÁGINA Y SITIO WEB• Anatomía de una página Web
![Page 19: 02 introducción al diseño web](https://reader033.vdocumento.com/reader033/viewer/2022051110/54c5713d4a795946468b4610/html5/thumbnails/19.jpg)
CONCLUSIONES
• El diseño Web es una actividad interdisciplinaria que tiene, o debería tener, como principio y fin al usuario.
• En la comunicación Web..., ¿el medio es el mensaje?..., ¡maldito seas McLuhan!
![Page 20: 02 introducción al diseño web](https://reader033.vdocumento.com/reader033/viewer/2022051110/54c5713d4a795946468b4610/html5/thumbnails/20.jpg)
CONCEPTOS PENDIENTES...
• Web
• Internet
• Protocolo de Internet
• URL
• Servidor Web
![Page 21: 02 introducción al diseño web](https://reader033.vdocumento.com/reader033/viewer/2022051110/54c5713d4a795946468b4610/html5/thumbnails/21.jpg)
03. HTML/CCS/JS CONCEPTOS MÍNIMOS
Siguiente sesión: