Etapas de un diseño web
Transcript of Etapas de un diseño web
![Page 1: Etapas de un diseño web](https://reader036.fdocuments.co/reader036/viewer/2022062514/55923af01a28abc3778b45e1/html5/thumbnails/1.jpg)
Etapas de un diseño web Milton Fabián llamuca
sani
![Page 2: Etapas de un diseño web](https://reader036.fdocuments.co/reader036/viewer/2022062514/55923af01a28abc3778b45e1/html5/thumbnails/2.jpg)
Es una actividad que consiste en la planificación, diseño e implementación de sitios web y paginas web
![Page 3: Etapas de un diseño web](https://reader036.fdocuments.co/reader036/viewer/2022062514/55923af01a28abc3778b45e1/html5/thumbnails/3.jpg)
Requiere tener en cuenta cuestiones tales comoNavegabilidad.Interactividad.Usualidad.Arquitectura de la información.Interacción de medios (audio, texto, imagen y
video)
![Page 4: Etapas de un diseño web](https://reader036.fdocuments.co/reader036/viewer/2022062514/55923af01a28abc3778b45e1/html5/thumbnails/4.jpg)
Etapas de un proyecto web Negociación Organización de la información Interfaz grafica Inserción del contenido Revisión y ajustes publicación
![Page 5: Etapas de un diseño web](https://reader036.fdocuments.co/reader036/viewer/2022062514/55923af01a28abc3778b45e1/html5/thumbnails/5.jpg)
Fase de negociación
Nuestros objetivos en la fase de negociación son tres:1. Entender claramente cuales son los requisitos
del proyecto.2. Decidir si se trata de un proyecto que
podemos/queremos atender dentro del tiempo requerido.
3. (En caso de que lo sea:) Llegar a un acuerdo con el cliente sobre el costo y alcance del proyecto.
![Page 6: Etapas de un diseño web](https://reader036.fdocuments.co/reader036/viewer/2022062514/55923af01a28abc3778b45e1/html5/thumbnails/6.jpg)
Fase de negociación
Nunca iniciar un proyecto sin el 50% o el 30% de inicio
Emitir contrato o facturaDefinir quien será el encargado del proyecto
![Page 7: Etapas de un diseño web](https://reader036.fdocuments.co/reader036/viewer/2022062514/55923af01a28abc3778b45e1/html5/thumbnails/7.jpg)
Fase de negociación
Nunca iniciar un proyecto sin el 50% o el 30% de inicioPor que si no hay dinero de por medio no hay compromiso de por medio para la ejecución del proyecto • Emitir contrato o factura Siempre se debe emitir un documento como constancia para demostrar que hay documentos firmados y aprobados para el desarrollo del proyecto• Definir quien será el encargado del proyecto Se recomienda que no exista muchas personas de por medio para que no genere confusiones
![Page 8: Etapas de un diseño web](https://reader036.fdocuments.co/reader036/viewer/2022062514/55923af01a28abc3778b45e1/html5/thumbnails/8.jpg)
Organización de la información
•Mapa del sitio Web •Diagrama, esquema general de las páginas
web Word - Balsamiq – todo el sitio
![Page 9: Etapas de un diseño web](https://reader036.fdocuments.co/reader036/viewer/2022062514/55923af01a28abc3778b45e1/html5/thumbnails/9.jpg)
Organización de la informaciónEn esta etapa del proyecto la empresa que
nos contrate para desarrollar el proyecto nos tendrá que facilitar toda la información necesaria para luego hacer sus respectivas maketas
![Page 10: Etapas de un diseño web](https://reader036.fdocuments.co/reader036/viewer/2022062514/55923af01a28abc3778b45e1/html5/thumbnails/10.jpg)
Interfaz grafica
Diseño de la interfaz Es el momento de empezar a crear las piezas del puzzle y ensamblar el conjunto. Al final de esta etapa dispondremos de una versión beta del Sitio que volveremos a revisar y probar. En esta etapa utilizaremos los siguientes software Word, Corel, Illustrator, full color
![Page 11: Etapas de un diseño web](https://reader036.fdocuments.co/reader036/viewer/2022062514/55923af01a28abc3778b45e1/html5/thumbnails/11.jpg)
Interfaz grafica
![Page 12: Etapas de un diseño web](https://reader036.fdocuments.co/reader036/viewer/2022062514/55923af01a28abc3778b45e1/html5/thumbnails/12.jpg)
INSERCIÓN DEL CONTENIDO
Una vez que ha planeado su sitio y ha creado el contenido y los gráficos, usted necesitará convertir su información en formato que se pueda leer en la Web. Usted puede hacer esto al convertir los archivos de texto en HTML
![Page 13: Etapas de un diseño web](https://reader036.fdocuments.co/reader036/viewer/2022062514/55923af01a28abc3778b45e1/html5/thumbnails/13.jpg)
INSERCIÓN DEL CONTENIDO
Software a utilizar Descripción del software Códigos Fuentes Adobe, Website x5 v. 9, Joomla, Drupal
![Page 14: Etapas de un diseño web](https://reader036.fdocuments.co/reader036/viewer/2022062514/55923af01a28abc3778b45e1/html5/thumbnails/14.jpg)
INSERCIÓN DEL CONTENIDO
![Page 15: Etapas de un diseño web](https://reader036.fdocuments.co/reader036/viewer/2022062514/55923af01a28abc3778b45e1/html5/thumbnails/15.jpg)
REVISIÓN Y AJUSTES
Demo del sitio web y documento donde el cliente acepta el sitio. Impresión de la página demo y final. Adobe, Website x5 v. 9, Joomla, Drupal
![Page 16: Etapas de un diseño web](https://reader036.fdocuments.co/reader036/viewer/2022062514/55923af01a28abc3778b45e1/html5/thumbnails/16.jpg)
REVISIÓN Y AJUSTES
![Page 17: Etapas de un diseño web](https://reader036.fdocuments.co/reader036/viewer/2022062514/55923af01a28abc3778b45e1/html5/thumbnails/17.jpg)
PUBLICACIÓN EN LA WEB
Esta es la ultima etapa del desarrollo de un sitio web
Contrato de hosting Instalación del sitio Documentación, capturas de pantalla
![Page 18: Etapas de un diseño web](https://reader036.fdocuments.co/reader036/viewer/2022062514/55923af01a28abc3778b45e1/html5/thumbnails/18.jpg)
PUBLICACIÓN EN LA WEB
![Page 19: Etapas de un diseño web](https://reader036.fdocuments.co/reader036/viewer/2022062514/55923af01a28abc3778b45e1/html5/thumbnails/19.jpg)
MANUAL DE USUARIO
Capturas y descripción de pantallas Guía documentada, capturas de pantalla
![Page 20: Etapas de un diseño web](https://reader036.fdocuments.co/reader036/viewer/2022062514/55923af01a28abc3778b45e1/html5/thumbnails/20.jpg)
PRUEBAS TÉCNICAS – OPERATIVAS DEL SITIO WEB
Medidor de ancho de banda Tiempo de carga del sitio Enlaces rotos, compatibilidad navegadores Pagespeed - Pingdom
![Page 21: Etapas de un diseño web](https://reader036.fdocuments.co/reader036/viewer/2022062514/55923af01a28abc3778b45e1/html5/thumbnails/21.jpg)
PRUEBAS TÉCNICAS – OPERATIVAS DEL SITIO WEB
![Page 22: Etapas de un diseño web](https://reader036.fdocuments.co/reader036/viewer/2022062514/55923af01a28abc3778b45e1/html5/thumbnails/22.jpg)
FIN