Universidad Autónoma del Estado de
Hidalgo
Escuela superior de Tizayuca
Bachillerato
Bloque I: Tecnologías web
Aplicaciones computacionales web y móviles 2.0
Dr. Genaro Moreno Beltrán
Objetivo de la unidad
Conocer las diferentes tecnologías Web existentes, y que los estudiantes identifiquen su
valor agregado en la solución de problemas de diversos dominios de aplicación.
Objetivo del tema
Identificar cuales son las tecnologías web que operan del lado del cliente y servidor,
reconociendo la utilidad de las herramientas web disponibles para el desarrollo de
aplicaciones.
Competencias a desarrollar
Uso de la • 2.-Tener claridad en cuanto a las implicaciones que
posee el uso de las nuevas tecnologías en la creación
tecnología de nuevas relaciones y escenarios.
• 12.-Utiliza las tecnologías de la información y
Comunicación comunicación para investigar, resolver problemas,
producir materiales y transmitir información.
Tema 1.1 Introducción a las tecnologías Web
Tema 1.1.1 Tipos de tecnologías Web
Tecnologías web: concepto
Son todas aquellas herramientas, lenguajes, protocolos y estándares que permiten el
diseño, mantenimiento e implementación de sitios y aplicaciones basadas en web (Luna,
2014).
Android retira el soporte a Flash
HTML, JS y
Flash
CSS
2007 aparece el
2000
primer iPhone
Tema 1.1.1 Tipos de tecnologías Web
Tecnologías web
Tecnologías
Del lado del Del lado del
cliente servidor
Bases de
CSS JS HTML5 PHP Python
datos
Bootstrap AJAX MySQL MongoDB
Tema 1.1.1 Tipos de tecnologías Web
Tecnologías web del lado del cliente: HTML
HTML (HyperText Markup Language) es el lenguaje estándar para la creación de sitios web y
la estructuración de su contenido. Se trata de un lenguaje de marcado que utiliza etiquetas
para organizar textos, imágenes, videos y otros elementos que componen una página web
(Luna, 2014)
Tema 1.1.1 Tipos de tecnologías Web
Tecnologías web del lado del cliente: CSS y JS
CSS
Del ingles Cascade Style Sheets o en español Hojas de Estilo en Cascada; tiene como
función prioritaria el establecer el aspecto visual de una pagina web; cabe mencionar que la
implementación de hojas de estilo permiten separar el diseño de la estructura HTML (Luna,
2014).
JavaScript
Es un lenguaje de programación que permite incorporar mayor dinamismo a sitios web,
pues permite incorporar animaciones, eventos, validaciones, creación de objetos, entre
otros más (Luna, 2014).
Tema 1.1.1 Tipos de tecnologías Web
Tecnologías web del lado del servidor: PHP y Python
• Es un lenguaje que se ejecuta del lado del
servidor, y es comúnmente utilizado para
PHP comunicar datos entre una aplicación o sitio
web y una base de datos(PHP, s.f.).
• Es un lenguaje de programación de alto nivel
que permite ejecutar código del lado del
Python servidor o incluso desarrollar aplicaciones
web completas (AWS, s.f.).
Tema 1.1.2 Herramientas web
Herramientas web: concepto
Son todas aquellas aplicaciones, servicios o protocolos que permiten el desarrollo de
aplicaciones web.
Frameworks Librerías
Entornos de
desarrollo
Tema 1.1.2 Herramientas web
Herramientas web: HTTP
Hypertext Transfer Protocol o bien Protocolo de Transferencia de Hipertexto, es un protocolo el
cual permite realizar la petición y recepción de recursos en internet (MDN, 2024).
Respuesta
Cliente HTTP puede controlar:
Servidor
Sesiones de usuario.
Manejo de cache.
Petición Autenticación de usuario.
Tema 1.1.2 Herramientas web
Herramientas web: FTP
Es un protocolo de transferencia de archivos
que permite el intercambio de datos entre
computadoras que estén conectadas a internet;
no obstante, cabe mencionar que para que esto
funcione un equipo debe estar configurado
como cliente y otro como servidor (Fernández,
2024).
Tema 1.1.2 Herramientas web
Herramientas web: SMTP
SMTP es un protocolo simple de transferencia de correo cuya finalidad es la de enviar y
recibir mensajes de correo electrónico vía internet; cabe mencionar que este protocolo
es implementado por todo aquel servicio que realiza envió y recepción de mensajes de
email (AWS, s.f.).
Tema 1.1.2 Herramientas web
Herramientas web: Telnet
Es un protocolo de red que permite la conexión a equipos de forma remota, lo cual, se realiza
mediante una interfaz de línea de comandos . Siendo su objetivo primario la gestión remota de
equipos de computo (Fernández, 2020).
Nota: actualmente, previo al uso
de esta función, la misma debe
ser habilitada en Windows.
Tema 1.2 Componentes necesarios para ejecutar
aplicaciones Web
Tema 1.2.1 Servidor web
Servidor web: concepto
Un equipo de computo de tipo servidor, es aquella maquina que permite almacenar, procesar y
entregar archivos desde una red local o de internet a los usuarios por medio de una aplicación
basada en red (Hostinger, 2025).
HTTP FTP SMTP
Protocolos implementados
Hardware Software
Tema 1.2.1 Servidor web
Servidor web: funcionamiento
Cliente: hace peticiones al
Servidor: procesa la petición,
servidor por medio de un
busca dentro de sus archivos, y
navegador o aplicación web, para
regresa el recurso solicitado
ello implementa el protocolo
(Boada, 2025).
HTTP (Boada, 2025).
Tema 1.2.1 Servidor web
Servidor web: funcionamiento
Implican aplicaciones y
Muestra contenido fijo al
bases de datos, es decir,
usuario, es decir, se
basan en el consumo y
Estático Dinámico actualizan el contenido
consultado por el usuario
envió de archivos
Servidores
No obstante, cabe mencionar que
cuando las peticiones no logran
resolverse, el servidor mostrara un
mensaje de error (como el 504).
(Boada, 2025)
Tema 1.2.1 Servidor web
Servidor web: características
• Permite llevar una bitácora de las
Registro de archivos operaciones que se registran en el
servidor.
• Permite asignar recursos a los usuarios
Autenticación en razón de los roles que cumplen.
Control del ancho de • Permiten limitar la tasa de transferencia
de datos, además de la velocidad de
banda navegación en el sitio.
Lenguaje de • Es el tipo de código que se implementa
para el desarrollo de aplicaciones.
programación
(Boada, 2025)
Tema 1.2.1 Servidor web
Servidor web: usos principales
Servicios de Permiten el alojamiento de paginas o aplicaciones web, a las cuales,
hospedaje se les asigna una dirección de dominio (URL) (Boada, 2025).
Procesamiento En razón de la configuración un servidor puede cumplir con un
de protocolos propósito específico, como mandar correos o transferir
archivos (Boada, 2025).
Nota: los servicios de hospedaje, tienen un cobro de renta anual, en ese sentido, en
razón de los costos, se suelen agregar más o menos servicios.
Tema 1.2.1 Servidor web
Servidor web: tipos de servidores
Cabe mencionar, que a nivel de software, un servidor bien puede ser administrado por un sistema
operativo especializado, no obstante, en algunos casos, requiere de una aplicación complementaria para
la administración de algunas funciones.
Apache
Internet Information
Services (IIS) de
Microsoft
NGINX
(Boada, 2025)
Tema 1.2.1 Servidor web
Servidor web: Apache
Es un servidor web de código abierto que funciona mediante la implementación del
protocolo HTTP, es decir, que una de las principales tareas de este programa es la de
resolver peticiones sobre recursos del servidor (Medina, 2023).
Permite alojar sitios y aplicaciones web
Flexible y fácil de configurar
Permite la ejecución de código del lado
del servidor
Tema 1.2.2 Servidor de base de datos
Servidor de base de datos: concepto
Es un software especializado que permite el cual permite la organización de la información en
tablas, índices y registros (Borges, 2019).
Permiten la gestión de
aplicaciones
Operaciones básicas
Consulta
Guardado Motor de base de datos
Actualización
Eliminación
Permiten la gestión de
cantidades masivas de datos
Tema 1.2.2 Servidor de base de datos
Servidor de base de datos: aplicaciones
Administración de • Permite la gestión de datos, cabe mencionar que un
registro bien puede ser un dato, una imagen, un
registros documento, etc.
• Es decir, que una base de datos permite almacenar
Indexación sitios direcciones de sitios web, como por ejemplo, Google.
Entrega contenido • En combinación con una aplicación web, las bases de
datos pueden dar al cliente contenido bajo demanda
dinámico (dinámico).
(Borges, 2019)
Tema 1.2.2 Servidor de base de datos
Servidor de base de datos: servidores de bases de datos
MySQL Es un servidor de base de datos relacional de código abierto, el cual es considerado
server como una de las aplicaciones más populares en la administración de base de datos.
Es un administrador de base de datos desarrollado por Microsoft, el cual ofrece una
SQL server
interfaz grafica mediante la cual el usuario puede interactuar.
Es un administrador de base de datos el cual se basa en estructuras dinámicas similares
MongoDB
a un formato JASON; es multiplataforma y permite indexación, replicación de datos,
server
balanceo inteligente de carga, almacenamiento de archivos, entre otros servicios.
(Borges, 2019)
Tema 1.3 Aplicaciones WEB que se ejecutan de lado
del cliente
Tema 1.3.1 JavaScript
Concepto
Del lado del cliente, JavaScript permite dotar de funcionalidad y dinamismo al contenido que se
muestra al usuario; usualmente, dicha programación responde a eventos (AWS, s.f.).
Tema 1.3.2 Applets de java
Concepto
Los applets, son pequeños programas escritos en lenguaje java que pueden ser ejecutados
en un navegador cuando se incrustan en un documento HTML (IBM, 2024).
En los inicios del internet contemporáneo,
fueron de mucha utilidad; no obstante, en la
actualidad han sido remplazados por
JavaScript.
Tema 1.3.1 VBScript
Concepto
Visual Basic Script es un lenguaje derivado de visual basic desarrollado por Microsoft; no obstante, y a
diferencia del lenguaje base del que nace, es mucho más limitado en capacidades, y surge como una
respuesta a JavaScript. Asimismo, cabe mencionar que solo se podía ser ejecutado sobre internet
explorer (VBScript, s. f.).
Tema 1.4 Aplicaciones WEB que se ejecutan de lado
del servidor
Tema 1.4.1 CGI
Concepto
Common Gateway Interface (CGI) es una interfaz de los servidores web la cual permite
el intercambio de datos entre servidores o aplicaciones de forma estandarizada; por otra
parte, pese a ser tecnología antigua, sigue siendo sumamente implementada debido a
que genera contenido de forma dinámica del lado del servidor (IONOS, 2020).
Tema 1.4.1 CGI
Funcionamiento
Consulta de
Petición CGI
datos
Creación de
Respuesta contenido
dinámico
(IONOS, 2020)
Tema 1.4.1 CGI
Aplicaciones
Carritos de compra
Formularios
Pruebas de software
Comentarios
(IONOS, 2020)
Tema 1.4.1 CGI
Ventajas y desventajas
Ventajas
Desventajas
Permiten la generación de
contenido dinámico, asimismo,
Se generan excesivos tiempos
permiten una adecuada gestión
de espera, debido a que los
de recursos del lado del
scripts se ejecutan una petición
servidor.
a la vez.
(IONOS, 2020)
Tema 1.4.2 SERVLETS
Concepto
Un SERVLET, es un programa escrito en java que se ejecuta del lado de un servidor web,
el cual permite gestionar peticiones HTTP, y a diferencia de un CGI, este es más eficiente
ya que permite dar respuesta a múltiples consultas (GoDaddy, 2024).
Tema 1.4.2 SERVLETS
Funcionamiento
Inicialización Servicio Destrucción
(GoDaddy, 2024)
Tema 1.4.2 SERVLETS
Ventajas y desventajas
• Es seguro.
• Escalable.
Ventajas • Permite una adecuada gestión de
recursos.
• Complejo.
• Difícil de mantener.
Desventajas • Requiere de un ambiente de
ejecución.
(GoDaddy, 2024)
Tema 1.4.3 Java Server Pages (JSP)
Concepto
Java Server Pages es una tecnología basada en java que permite la creación de web
dinámicas combinando HTML con código de lenguaje java; al ser una extensión de los
SERVLETS, permite una mejor distinción entre el modelo de negocio y la presentación
(Galicia, 2024).
Tema 1.4.3 Java Server Pages (JSP)
Funcionamiento
Petición
JSP a SERVLET
Ejecución
Respuesta
(Galicia, 2024)
Tema 1.4.3 ASP
Active Services Pages: concepto
ASP es un lenguaje que ejecuta código del lado del servidor desarrollado por Microsoft
que permite la creación de web dinámicas e interactivas introducido por primera vez en
1996 (Castro, 2003).
Es compatible con otros lenguajes de script
Permite conexión a base de datos mediante
Características
ActiveX Data Objects (ADO)
Integración directa con IIS
Tema 1.4.3 ASP
Active Services Pages
Ventajas Desventajas
❖ Facilidad de uso. ❖ Su máxima eficiencia solo se da
❖ Compatibilidad con tecnologías sobre plataformas de Microsoft.
de Microsoft ❖ Obsolescencia
Tema 1.4.3 ASP
Active Services Pages: funcionamiento
Tema 1.5 Diseño web responsivo
Tema 1.5.1 Diseño responsivo
Concepto
Se trata de una técnica de desarrollo de paginas web que permiten a las aplicaciones
resultantes adaptar el contenido en razón de la resolución de pantalla del dispositivo
que se emplea para su visualización. Esta practica, fue introducida por Ethan
Marcotte en 2010, convirtiéndose en un estándar en el desarrollo web moderno
(Robbins, 2018; Duckett, 2014).
Tema 1.5.1 Diseño responsivo
Principios
Basado en Se hace uso de unidades relativas para definir el tamaño de los
cuadriculas elementos (Robbins, 2018).
Imágenes y medios Es decir, que tengan la capacidad de escalar su tamaño de acuerdo
flexibles al medio en el que se visualizan (Duckett, 2014).
Son reglas de CSS que permiten aplicar cambios si y solo si se
Uso de media queries
cumplen ciertos criterios
Tema 1.5.1 Diseño responsivo
Media queries
Tema 1.5.1 Diseño responsivo
Bootstrap
Es un framework de CSS desarrollado por Twitter (ahora X) en el año 2010; cuyo fin es el
de proporcionar interactividad, estilo y permitir la construcción de sitios web responsivos
(rockcontend, 2020).
Tema 1.5.1 Diseño responsivo
Herramientas para el diseño responsivo
• Framework que permite la implementación del
Fundation diseño responsivo de forma modular (Robbins,
2018).
• Son soluciones nativas de CSS para manejar
CSS Grid y Flexbox diseños responsivos sin necesidad de
frameworks externos (Robbins, 2018).
Tema 1.5.1 Diseño responsivo
Herramientas para el diseño responsivo
Foundation
Tema 1.5.1 Diseño responsivo
Herramientas para el diseño responsivo
Flexbox
Tema 1.5.1 Diseño responsivo
Diseño
responsivo
Oneshot
Mobile first Maquetado Frameworks
pages
Tema 1.5.1 Diseño responsivo
Ventajas
Permiten la consulta universal de sitios o aplicaciones web desde cualquier dispositivo
(Duckett, 2014).
Mejoran el posicionamiento SEO de un sitio (Robbins, 2018).
Hacen que el manetenimiento sea más sencillo.
❖ Boada, D. (2025, 16 enero). ¿Qué es un servidor web y cómo funciona? Tutoriales Hostinger.
[Link]
Bibliografía ❖ Borges, E. (2019, 13 octubre). Servidor base de datos. Infranetworking. [Link]
de-datos/
❖ Castro, E. (2003). Active Server Pages 3.0: Guía completa. Anaya Multimedia.
❖ Fernández, Y. (2020, 14 julio). Telnet: qué es y cómo activarlo en Windows 10. Xataka.
[Link]
❖ Fernández, Y. (2024, 18 abril). FTP: qué es y cómo funciona. Xataka. [Link]
funciona
❖ Galicia, F. P. L. (2024, 17 octubre). JSP (JavaServer Pages): Definición, funcionamiento y uso. GoDaddy Resources -
LATAM. [Link]
❖ Generalidades del protocolo HTTP - HTTP | MDN. (2024, 8 julio). MDN Web Docs.
[Link]
❖ GoDaddy, E. (2024, 26 julio). Servlets en Java: Qué son, funciones y uso. GoDaddy Resources - LATAM.
[Link]
❖ IBM i 7.5. (s. f.). [Link]
❖ IONOS. (2020, 14 septiembre). Common Gateway Interface (CGI): qué es y qué aplicaciones tiene. IONOS Digital
Guide. [Link]
❖ Luna, F. (2014). Desarrollo web para dispositivos móviles. 1a ed. Buenos Aires.
❖ Medina, M. (2023, 18 abril). Qué es Apache y Para qué Sirve. Hostinet. [Link]
web/apache/que-es-apache-y-para-que-sirve/
❖ PHP: Hypertext Preprocessor. (s. f.). [Link]
❖ Rockcontend (2020). Bootstrap: guía para principiantes de qué es, por qué y cómo usarlo. Rockcontent. Recuperado de:
[Link]
Bibliografía ❖ VBScript. (s. f.). Desarrollo Web. [Link]
❖ ¿Qué es SMTP? Explicación del servidor SMTP - AWS. (s. f.). Amazon Web Services, Inc.
[Link]
,%C2%BFQu%C3%A9%20es%20un%20servidor%20SMTP%3F,administra%20y%20env%C3%ADa%20correos%20ele
ctr%C3%B3nicos.
❖ ¿Qué es JavaScript? - Explicación de JavaScript (JS) - AWS. (s. f.). Amazon Web Services, Inc.
[Link]
is/javascript/#:~:text=En%20el%20lado%20del%20cliente,en%20un%20bot%C3%B3n%20de%20descarga.
❖ ¿Qué es Python? - Explicación del lenguaje Python - AWS. (s. f.). Amazon Web Services, Inc.
[Link]
is/python/#:~:text=Python%20es%20un%20lenguaje%20de,el%20machine%20learning%20(ML).-
