INGENIERIA WEB

Espinosa Fandiño Giovanny

taller enfocado en las semanas 3, 4 y 5

Elkin Darío González Martínez

Profesor

Corporación Unificada Nacional de Educación Superior-CUN

Ingeniería de sistemas
Bogotá
2023
 CORPORACIÓN UNIFICADA NACIONAL DE EDUCACION SUPERIOR

Cuestionario de Investigación: Ingeniería Web y Diseño de Aplicaciones

Tema 1: Áreas Involucradas en el Diseño de Aplicaciones Web

1. ¿Qué áreas considera esenciales para el diseño efectivo de aplicaciones web?

RTA:
 Desarrollo basado en componentes
 Seguridad
 Cumplimiento de estándares

2. ¿Cuáles son los principales aspectos a tener en cuenta al diseñar la interfaz de usuario de
una aplicación web?

RTA:
 Planificación
 Calidad
 Usabilidad

3. Mencione ejemplos de aspectos de seguridad que deben ser considerados durante el

diseño de aplicaciones web.

RTA:
 Proteger tu página con un Firewall de Aplicaciones Web.
 Utilizar un escáner de seguridad de sitios web.
 Actualizar el software con frecuencia.
 Utilizar contraseñas fuertes.
 Limitar el acceso de los usuarios y los permisos en tu sitio web.
 Cambiar los ajustes preestablecidos de tu CMS.

4. ¿Cómo influye la experiencia del usuario (UX) en el diseño de aplicaciones web y cuáles
son los desafíos comunes asociados?

RTA: La experiencia de usuario, también conocida como UX (user experience), se centra

en la experiencia general del usuario final, incluidas sus percepciones, emociones y
respuestas al producto, sistema o servicio de una empresa. Se define por criterios que
incluyen la facilidad de uso, la accesibilidad y la conveniencia.
 1. Usabilidad
Se refiere a la facilidad con la que un usuario puede usar un producto, un servicio o el sitio
web de una marca. Trata de poner a disposición las herramientas indispensables para que
las personas interactúen de forma intuitiva y no requieran de tantas explicaciones, a la vez
que ahorren tiempo.

2. Accesibilidad
Este concepto trata de la posibilidad que tiene el usuario para contactar una marca,
principalmente a través de su sitio web y también en las sucursales físicas.

Abarca aspectos de diseño responsivo e inclusividad. Es decir, toma en consideración

desde qué dispositivo lo hacen (móvil, laptop, tablet, etc.) y si tienen una discapacidad
(física, visual, motriz, auditiva o cognitiva) para adaptar sus canales.

3. Funcionalidad
Otro elemento vital en la experiencia del usuario es el desempeño técnico de los
productos, los servicios, la atención al cliente, el sitio web y la aplicación móvil de una
marca. En el mundo digital es de suma importancia la velocidad de carga, las compras en
línea, las formas de pago, la solicitud de cotizaciones y demás funciones web.

4. Innovación
Se refiere a la capacidad de una empresa para dar soluciones a las necesidades de los
clientes a través de ideas nuevas, con la ayuda de la tecnología. Hoy en día casi todas las
personas cuentan con un móvil con acceso a internet, y esto es una mina de
oportunidades para las marcas que se quieran acercar a ellas.

5. Diseño y navegación
Tiene que ver con la identidad de la marca; su logotipo, paleta de colores, tipografía,
eslogan y elementos gráficos de su presencia digital. Es relevante sobre todo en el sitio
web, donde se busca crear una interacción gratificante. Aquí también entra en juego cuán
navegable es de acuerdo con su arquitectura de la información.

5. En términos de rendimiento, ¿qué consideraciones deben ser abordadas en el diseño de

aplicaciones web?

RTA: Hay varios indicadores que debemos tomar en cuenta para poder hacer un estimado
del rendimiento de nuestra web, estos son los siguientes:
Cuantitativos

En esta categoría de indicadores, tenemos los factores o parámetros que podemos medir
de acuerdo a un formula, números o técnicas definidas que no pueden someterse a
interpretaciones subjetivas.

Cualitativos

Esta categoría es lo contrario a la anterior por cuanto los factores que tomamos en cuenta
no pueden ser medidos con un número o una formula, y son en su mayoría
interpretaciones subjetivas, sin embargo, muchas veces pueden apoyarse de los
indicadores cuantitativos para apoyar algunas de sus explicaciones.

Ya que sabemos las dos grandes categorías, veamos algunos indicadores en específico que
podemos empezar a tener en mente cuando empecemos a medir el rendimiento de
nuestras aplicaciones web.

Tiempo de carga de la página

Este indicador cuantitativo nos permite obtener un número que expresa los segundos que
tarda la aplicación o página web en ser cargada en su totalidad, generalmente se expresa
en segundos y debe estar por debajo de los 2 dígitos, es decir, por debajo de 10 segundos.

Tamaño de la página

Es la sumatoria del peso de todos los componentes que conforman nuestra aplicación, es
decir, es el total de peso de la transferencia que ocurre desde el momento en que
visitamos nuestra página hasta que se muestra.

Número de peticiones HTTP

Son la cantidad de conexiones que realiza nuestra aplicación al momento de cargar, estas
peticiones pueden ser solicitudes de carga de archivos css, js, imágenes, y llamados a otras
librerías o servicios.

Tiempo de renderizado de la página

Es el tiempo que pasa entre que hemos cargado los recursos y que la página o aplicación
pueda mostrarse de forma adecuada.
Tema 2: Proceso de la Ingeniería Web

1. Describa los pasos fundamentales en el proceso de desarrollo de aplicaciones web.

RTA:
 Conceptualización:
1. Modelado del negocio
2. Requerimiento
 Elaboración
1. Análisis
2. Diseño
 Transición:
1. Instalación
2. Publicación

 Construcción:
1. Implementación
2. Pruebas

2. ¿Cómo se abordan la planificación y el diseño en el proceso de ingeniería web?

RTA:
 El diseño web implica trabajo relacionado con el layout y diseño de páginas online,
así como la producción de contenido, aunque generalmente se aplica a la creación
de sitios web. En este caso, los diseñadores web crean las páginas utilizando
lenguajes de marcado como HTML o XML.
 La planificación de una web es un simple esquema o boceto de cómo y qué es lo
que quieres presentar en tu página web, es decir, las páginas que crearás y qué
información pondrás en cada una. Ver todas las piezas antes de montarlas siempre
es de gran ayuda

3. ¿Cuál es la importancia de las pruebas y la depuración en el proceso de desarrollo de

aplicaciones web?
RTA:
 La depuración es un proceso esencial en el desarrollo de aplicaciones móviles,
cuyo objetivo principal es identificar, diagnosticar y rectificar problemas que
surgen durante la creación e implementación de aplicaciones
 as pruebas de seguridad de aplicaciones (AST) son un proceso de identificación,
análisis y corrección de las vulnerabilidades de seguridad de una aplicación web.
Incluye probar la aplicación para detectar vulnerabilidades conocidas y examinar
el código para detectar posibles problemas de seguridad.
4. ¿Cómo se gestiona típicamente el ciclo de vida de desarrollo de una aplicación web, desde
la concepción hasta el despliegue?

RTA:
El ciclo de vida de una aplicación es la "vida útil" completa de una aplicación de software,
desde el concepto hasta el final de su vida útil. Es decir, el término se refiere a todo el
proceso desde el momento en que se concibe la idea de la aplicación hasta el momento en
que se retira del uso. La gestión del ciclo de vida de las aplicaciones, a menudo abreviada
como ALM, es un sistema para gestionar todo el ciclo de vida. Este sistema incluye las
personas, las herramientas y los procesos que le permiten a la empresa navegar con éxito
en cada etapa del ciclo de vida y pasar de una fase a la siguiente.

5. ¿Cuáles son las ventajas y desventajas de diferentes metodologías de desarrollo, como

Agile o Cascada, en el contexto de la ingeniería web?

RTA:
Metodología Ágil
 La metodología ágil es un diseño de producción efectivo cuando se trata de
producir un software eficiente sin la necesidad de una gran documentación. En
breve, evita la excesiva característica burocrática de los sistemas y sus procesos.
En consecuencia, esta estrategia resulta ser yuxtapuesta al modelo de desarrollo
de software tradicional.

 Ventajas

o Ideal para proyectos pequeños.

o Los hace más rápido de controlar.
o Resulta sencillo transmitir el conocimiento sobre los proyectos.
o Crea un diseño de tareas estable.
o Resultados más acordes con las necesidades del cliente.

 Desventajas
o Se genera poca documentación sobre el proyecto.
o Falta de control de calidad.
o Soluciones equivocadas pueden obligar a reiniciar el proceso.
o Se enfocan en las decisiones de los líderes del proyecto.

Metodología en Cascada
 La estrategia waterfall o "cascada" es una herramienta clásica del desarrollo del
software. Esta estrategia hace uso de un proceso contiguo de etapas. Cada etapa
tiene la responsabilidad de resolver los objetivos y los diversos puntos pautados
en el modelo de diseño original. La idea central básicamente se fundamenta en la
de amalgamar los esfuerzos individuales en cada parte del proceso, evitando las
duplicaciones o solapamientos de cada una de las responsabilidades pautadas.
  Ventajas

 Un desarrollo más sólido del proyecto.

 Presupuestos y cronogramas más ajustados y precisos.

 Desventajas

 La modificación del diseño del proyecto implica cierta complejidad para el

cambio.
 Requiere que se cumplan todos los requisitos que parten desde la arquitectura
primaria.
 Dificulta resolver los problemas que surgen durante el desarrollo o durante el feedback
con el cliente.

Tema 3: Herramientas y Tecnologías - Introducción a JSP (JavaServer Pages)

1. ¿Qué son las JavaServer Pages (JSP) y cuál es su función en el desarrollo de aplicaciones
web?
RTA:
 La tecnología JavaServer Pages permite generar contenido Web dinámico como,
por ejemplo, archivos HTML, DHTML, XHTML y XML, para incluirlos en una
aplicación Web. Los archivos JSP son una forma de implementar contenido de
páginas dinámico del lado del servidor. Los archivos JSP permiten a un servidor
Web como, por ejemplo, Apache Tomcat, añadir contenido dinámicamente a las
páginas HTML antes de enviarlas al navegador que las solicita. Cuando se
despliega un archivo JSP en un servidor Web que proporciona un motor de
servlets, se procesa previamente en un servlet que se ejecuta en el servidor. Esto
contrasta con JavaScript™ en el lado del cliente (dentro de códigos <SCRIPT>), que
se ejecuta en un navegador. Una página JSP resulta ideal para tareas para tareas
cuya ejecución es más adecuada en el servidor como, por ejemplo, acceder a
bases de datos o llamar a beans de Enterprise Java

2. En comparación con otras tecnologías de servidor, ¿cuáles son los beneficios clave de
utilizar JSP?
RTA:
 La principal ventaja de JSP frente a otros lenguajes es que el lenguaje Java es un
lenguaje de propósito general que excede el mundo web y que es apto para crear
clases que manejen lógica de negocio y acceso a datos de una manera prolija,
igualmente se puede implementar contenido de páginas dinámico del lado del
servidor. Los archivos JSP permiten a un servidor Web como, por ejemplo, Apache
Tomcat, añadir contenido dinámicamente a las páginas HTML antes de enviarlas al
navegador que las solicita.
3. Explique el proceso de cómo funciona JSP en la generación dinámica de contenido web.
RTA:
 El lenguaje JSP requiere que se tenga un compilador Java en el servidor web. El
servidor web detecta el código de Java en el código HTML y luego lo envía al
compilador de Java para su procesamiento. Cualquier salida de Java el programa la
envía al navegador del cliente como parte del documento HTML. La tecnología
JavaServer Pages permite generar contenido Web dinámico como, por ejemplo,
archivos HTML, DHTML, XHTML y XML, para incluirlos en una aplicación Web.

4. ¿Cuáles son las principales diferencias entre JSP y Servlets en el contexto del desarrollo
web?
RTA:
 Un jsp esta compuesto por html y codigo java , mientras que un servlet es puro
java. Usando las clases correctas en un servlet, podrias crear toda una estructura
html. Yo usaba servlets para cargar ciertos datos y enviar los resultados a un jsp

 Los servlets Java son clases Java diseñadas para responder a solicitudes HTTP en el
contexto de una aplicación web. Puede ver las JSP como una extensión de HTML
que le ofrece la capacidad de incluir fragmentos de código Java dentro de las
páginas HTML.

5. Proporcione ejemplos de casos de uso adecuados para JSP en proyectos de desarrollo

web.
RTA:
Expresiones
 Se puede indicar una expresión Java dentro de las etiquetas <%= y %>. El resultado
aparecerá como parte del códido HTML en el lugar donde se haya escrito la
expresión.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Ejemplos JSP</title>
</head>
<body>
<H1>Ejemplos de expresiones</H1>
<%-- Mostrar la fecha y hora actual --%>
<%= new java.util.Date().toString() %><br>

<%-- Convertir a mayúsculas un String --%>

 <%= "Pasar a mayúsculas".toUpperCase() %><br>

<%-- Resultado de una expresión aritmética --%>

<%= (5+2)/(float)3 %><br>

<%-- Generar un número aleatorio --%>

<%= new java.util.Random().nextInt(100) %>
</body>
</html>

 El código HTML que recibe el navegador para el ejemplo anterior puede ser como
el siguiente:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Ejemplos JSP</title>
</head>
<body>
<H1>Ejemplos de expresiones</H1>
Wed Jan 16 19:00:52 CET 2013<br>
PASAR A MAYÚSCULAS<br>
2.3333333<br>
65
</body>
</html>

Scriplets
Dentro de las etiquetas <% y %> puedes escribir cualquier conjunto de sentencias
Java, que serán ejecutadas por el servidor.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Ejemplos JSP</title>
</head>
<body>
<H1>Ejemplo de scriplet</H1>
<%
int numero = 7, factorial = 1;
for(int i=numero; i>1; i--) {
factorial *= i;
}
%>
<%-- Se muestran en negrita el número y el resultado del factorial --%>
 <%= "El factorial de <b>"+numero+"</b> es <b>"+factorial+"</b>" %>
</body>
</html>
Objetos request, session y out
Los siguientes objetos están predefinidos para ser usados en JSP:

 request: permite obtener datos de la petición HTTP que se realiza. Por ejemplo, los
parámetros GET y POST que son pasados a la página.

 session: contiene los datos de la sesión, permitiendo guardar y recuperar

información durante la vigencia de la sesión.

 out: posibilita enviar información a la salida HTML que se genera.

Guarda en siguiente ejemplo en una archivo llamado factorial.jsp y te permitirá
realizar el cálculo del factorial del número que indique el usuario. Además
mantiene la cuenta de las veces que se ejecuta la página durante la misma sesión.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Cálculo del factorial</title>
</head>
<body>
<h1>Cálculo del factorial</h1>

<!-- Formulario que solicita al usuario el número a usar en el cálculo -->

<form action="factorial.jsp" method="get">
<p>Número: <input type="text" name="numero">
<input type="submit" value="Calcular"></p>
</form>

<%
// A través del objeto request se obtiene el valor pasado por el formulario
String numeroGet = request.getParameter("numero");
if(numeroGet!=null) {
int numero=0;
double factorial=1;
boolean error = false;
try {
numero = Integer.valueOf(numeroGet);
if(numero<1) {
error = true;
} else {
for(int i=numero; i>1; i--) {
factorial *= i;
}
 }
} catch(NumberFormatException e) {
error = true;
}
if(error) {
out.println("<p>Debe indicar un número entero mayor que 0</p>");
} else {
// Mostrar el resultado en la página usando el objeto out
out.println("<p>Resultado: "+numero + "! = " + factorial+"</p>");
}
}

// Uso del objeto session para contar las veces que se ejecuta la aplicación
Integer contador = (Integer)session.getAttribute("contadorVisitas");
if(contador!=null) {
contador = Integer.valueOf(contador);
} else {
contador = 0;
}
if(contador!=0) {
out.println("<p>Ejecuciones de la aplicación en esta sesión: "+contador+
"</p>");
}
contador++;
session.setAttribute("contadorVisitas", contador);
%>
</body>
</html>

Bibliografía

https://es.linkedin.com/pulse/ventajas-y-desventajas-de-las-metodolog%C3%ADas-desarrollo-
wagner

https://www.solvetic.com/tutoriales/article/1502-c%C3%B3mo-medir-el-rendimiento-de-una-
aplicaci%C3%B3n-web/

https://www.loadview-testing.com/es/la-guia-definitiva-para-las-pruebas-de-rendimiento-del-
sitio-web/

https://www.loadview-testing.com/es/la-guia-definitiva-para-las-pruebas-de-rendimiento-del-
sitio-web/
https://www.ibm.com/docs/es/rsar/9.5?topic=files-javaserver-pages-jsp-technology

https://javiergarciaescobedo.es/despliegue-de-aplicaciones-web/86-servidores-de-aplicaciones/
308-introduccion-a-jsp-a-traves-de-ejemplos

https://www.ibm.com/docs/es/i/7.2?topic=java-jsp-servlet-programming