Ingeniería web
-
Upload
victor-barraza -
Category
Technology
-
view
1.504 -
download
0
description
Transcript of Ingeniería web
![Page 1: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/1.jpg)
Ingeniería Web.
Andres Villezcas
Jesus Ivan Torres Cuevas
Jorge Arturo Martinez Cano
Victor Adan Barraza Luna
1
![Page 2: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/2.jpg)
Agenda
Definición de ingeniería Web.
Diferencias y similitudes entre
ingeniería de software e ingeniería
Web.
Atributos de las aplicaciones Web.
Modelo de proceso para la Web.
Ejemplos de aplicaciones Web.
2
![Page 3: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/3.jpg)
¿Qué es la Ingeniería Web?La ingeniería Web está relacionada con el
establecimiento y utilización de principios
científicos, de ingeniería y gestión, y con
enfoques sistemáticos y disciplinados del
éxito y desarrollo, empleo y
mantenimiento de sistemas y
aplicaciones basados en el
Web de alta calidad
3
![Page 4: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/4.jpg)
La ingeniería web es la aplicación de
metodologías sistemáticas,
disciplinadas y cuantificables al
desarrollo eficiente, operación y
evolución de aplicaciones de alta
calidad en la World Wide Web.
4
![Page 5: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/5.jpg)
La ingeniería web se debe al
crecimiento desenfrenado que está
teniendo la Web está ocasionando un
impacto en la sociedad y el nuevo
manejo que se le está dando a la
información en las diferentes áreas en
que se presenta ha hecho que las
personas tiendan a realizar todas sus
actividades por esta vía.
5
![Page 6: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/6.jpg)
Agenda
Definición de ingeniería Web.
Diferencias y similitudes entre
ingeniería de software e ingeniería
Web.
Atributos de las aplicaciones Web.
Modelo de proceso para la Web.
Ejemplos de aplicaciones Web.
6
![Page 7: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/7.jpg)
Ingeniería Web comparada a
Ingeniería del software La ingeniería Web no es un clone de
la Ingeniería del Software aunque
ambos involucren programación y
desarrollo de software.
El desarrollo del WebApps es distinto
respecto al desarrollo de software de
otras categorías.
7
![Page 8: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/8.jpg)
La diferencia:
implica una mezcla de publicación impresa y desarrollo de software, marketing e informática, de comunicaciones internas y relaciones externas, y de arte y tecnología
Por tanto, el desarrollo del un WebApp es un esfuerzo multidisciplinario debido al manejo de múltiples formatos, con una mezcla de atención social para saber su efecto ético y legal 8
![Page 9: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/9.jpg)
Similitudes
Todas las actividades CGC (Control y Garantía de la Calidad) de la ingeniería software tradicional como son: establecimiento y supervisión de estándares, revisiones técnicas formales, análisis, seguimiento y registro de informes, etc, son igualmente aplicables a la Ingeniería Web.
Sin embargo, en la Web toman especial relevancia para valorar la calidad aspectos como: Usabilidad, Funcionabilidad, Fiabilidad, Seguridad, Eficiencia y Mantenibilidad 9
![Page 10: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/10.jpg)
Agenda
Definición de ingeniería Web.
Diferencias y similitudes entre
ingeniería de software e ingeniería
Web.
Atributos de las aplicaciones Web.
Modelo de proceso para la Web.
Ejemplos de aplicaciones Web.
10
![Page 11: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/11.jpg)
Atributos de las aplicaciones web
•El usuario puede acceder fácilmente a estas aplicaciones empleando un
navegador web (cliente).
• Si es por internet, el usuario puede entrar desde cualquier lugar del mundo
donde tenga un acceso a internet.
• Pueden existir miles de usuarios pero una única aplicación instalada en un
servidor, por lo tanto se puede actualizar y mantener una única aplicación y
todos sus usuarios verán los resultados inmediatamente.
• Emplean tecnologías como Java, JavaFX, JavaScript, DHTML, Flash, Ajax...
que dan gran potencia a la interfaz de usuario.
• Emplean tecnologías que permiten una gran portabilidad entre diferentes
plataformas. Por ejemplo, una aplicación web flash podría ejecutarse en un
dispositivo móvil, en una computadora con Windows, Linux u otro sistema, en
una consola de videojuegos, etc.
11
![Page 12: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/12.jpg)
Portabilidad de nuestros datos
Solución a problemas reales
Multiplataforma
Debería tener una visión
No debería molestarme
En constante mejora
Debería tener una excelente
documentación pero innecesaria
Debería ser amistosa
No debería ser pretenciosa
Visualmente atractiva
12
![Page 13: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/13.jpg)
Agenda
Definición de ingeniería Web.
Diferencias y similitudes entre
ingeniería de software e ingeniería
Web.
Atributos de las aplicaciones Web.
Modelo de proceso para la Web.
Ejemplos de aplicaciones Web.
13
![Page 14: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/14.jpg)
Modelo de proceso de la
Ingeniería Web (I) Características como inmediatez,
evolución y crecimiento continuos, nos
llevan a un proceso incremental y
evolutivo, que permite que el usuario
se involucre activamente, facilitando el
desarrollo de productos que se
ajustan mucho lo que éste busca y
necesita.
14
![Page 15: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/15.jpg)
Modelo de proceso de la
Ingeniería Web (II)
15
![Page 16: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/16.jpg)
Modelos de proceso de la
Ingeniería Web (III) Formulación: identificación de metas y objetivos
Planificación: estimación de costes, evaluación de riesgos y
planificación temporal del proyecto
Análisis: establecimiento de requisitos
Ingeniería: dos grupos de tareas paralelas, Técnicas (diseño arquitectónico, de navegación y de
interfaz)
No técnicas (diseño del contenido y producción)
Generación de páginas y pruebasEl contenido se fusiona con los diseños arquitectónico, de
navegación y de interfaz para elaborar páginas web ejecutables en HTML, JSP...
Integración con el software intermedio (middleware) de componentes
Evaluación con el cliente: revisión de cada incremento y solicitud de cambios
16
![Page 17: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/17.jpg)
Ingeniería(I)
DISEÑO ARQUITECTONICO
El diseño arquitectónico para para los
sistemas y aplicaciones basados en
web se centra en la definición de la
estructura global y en la aplicación de
las configuraciones de diseño y
plantillas constructivas para
popularizar la estructura que se
representara como parte de la
webapp.17
![Page 18: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/18.jpg)
Ingeniería(II)
DISEÑO DE NAVEGACIÓN
Una ves establecida la arquitectura de
una webapp y establecidos sus
componentes el diseñador deberá
definir las rutas de navegación que
permitan al usuario acceder al
contenido y a los servicios de la
webapp además definir la mecánica
para la navegación.
18
![Page 19: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/19.jpg)
Ingeniería(III)
DISEÑO DE LA INTERFAZ
Los conceptos, principios y métodos
de diseño de interfaz son aplicables al
diseño de interface de usuario sin
embargo las características
especiales de los sistemas y
aplicaciones web requieren otras
consideraciones adicionales.
19
![Page 20: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/20.jpg)
Agenda
Definición de ingeniería Web.
Diferencias y similitudes entre
ingeniería de software e ingeniería
Web.
Atributos de las aplicaciones Web.
Modelo de proceso para la Web.
Ejemplos de aplicaciones Web.
20
![Page 21: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/21.jpg)
EJEMPLO DE APLICACIÓN
WEB
RESERVA DE MESA ONLINE
21
![Page 22: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/22.jpg)
Se selecciona la fecha deseada
en que se quiere reservar la
mesa
22
![Page 23: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/23.jpg)
*Después de seleccionar la
fecha se selecciona el numero
de personas y el área de donde
necesita su mesa de fumador o
no fumador.
23
![Page 24: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/24.jpg)
Si la mesa es mayor a cinco
personas la mesa será doble.
24
![Page 25: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/25.jpg)
En la ubicación de no fumador
se le asigna la mesa y quien
reserva la mesa elige el lugar.
25
![Page 26: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/26.jpg)
Ejemplo 2
Aplicación de llenar un formulario
para alquiler de un auto.
26
![Page 27: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/27.jpg)
Seleccionar fecha de alquiler.
27
![Page 28: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/28.jpg)
Se selecciona el tipo de contrato
para nuestro auto si lo necesitamos
económico u o de otro tipo
28
![Page 29: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/29.jpg)
A continuacion se muestra la
descripción del auto en este
caso es económico.
29
![Page 30: Ingeniería web](https://reader033.fdocumento.com/reader033/viewer/2022052400/559d14301a28abca018b46f8/html5/thumbnails/30.jpg)
Gracias
30