Arquitectura de Entornos

Web
Unidad 1: Proyecto web
Tema 1: Fundamentos de un proyecto web
Tema 1: Fundamentos de un proyecto web

2
Índice
1.1. Tema 1: Fundamentos de un proyecto web
1.1.1. Internet
1.1.2. Página web
1.1.3. Hipertexto
1.1.4. Servidor web
1.1.5. Hosting
1.1.6. HTML
1.1.7. Navegadores de internet
1.1.8. Proyecto web
1.1.9. Etapas de un proyecto web

3
Capacidades
• Conoce la terminología básica de Internet necesaria para el desarrollo de un proyecto web.
• Identifica las etapas de un proyecto web.

4
Introducción
• Para conocer cómo desarrollar un proyecto web, se debe tener conocimientos básicos acerca de la web: Internet,
servidores web, hosting, navegadores, etc.
• A partir de estos conceptos, se inicia el estudio de un proyecto web, sus etapas y arquitectura de la información.

5
1.1.1 Internet
Internet es más que solo poder navegar o
buscar información.
Es el conjunto de computadoras y
servidores, conectados en una RED DE
REDES MUNDIAL (World Wide Web), los
cuales comparten un mismo protocolo de
comunicación, y proporcionan SERVICIOS
como:
• Correo electrónico
• Buscadores
• Grupos de noticias
• Listas de distribución
• Foros Fuente: https://dplnews.com/peru-empresas-cinco-claves-para-usar-el-internet-y-agilizar-los-negocios/

• Intercambio de información

6
1.1.2 Página web
• Es un documento que facilita el acceso a la
información almacenada en Internet, accesible
mediante el protocolo HTTP de Internet y que
puede contener diferentes contenidos como:
texto, audio, video, animaciones.
• Se utiliza para su creación HTML (HyperText
Markup Language o lenguaje de marcas de
hipertexto)
• Un sitio web es una colección de páginas de
internet relacionadas a un dominio o nombre
en Internet. Todos los sitios web, constituyen
la World Wide Web de información.

Fuente: https://www.cibertec.edu.pe/

7
1.1.3 Hipertexto
• El hipertexto es texto que contiene
enlaces a otros textos. El término fue
acuñado por Ted Nelson alrededor de
1965.
• Es una estructura no secuencial que
permite crear, agregar, enlazar y
compartir información de diversas
fuentes por medio de enlaces asociativos
y redes sociales.

Fuente: https://www.cibertec.edu.pe/

8
1.1.4 Servidor web
• Un servidor es un computador que se
encarga de transmitir la información pedida
por sus clientes.
• Los servidores web (web server) son un
componente de los servidores con la
función de almacenar y transmitir el
contenido solicitado de un sitio o página
web al navegador del usuario.
• El servidor web, deberá estar siempre
disponible a la espera de peticiones de
ejecución que le hará un usuario de Internet
y encargándose de contestar a estas
peticiones de forma adecuada, entregando
como resultado una página web o
información de todo tipo de acuerdo a los
comandos solicitados.

Fuente: http://trimestrecuatrodeamarelysmaita.blogspot.com/2013/06/

9
1.1.5 Hosting
1. Si no cuentas con un servidor web, pero estas diseñando una
página o sitio y quieres que otros puedan visitarla, se necesita
publicar tu página; para ello, contratas un servicio de web
hosting.
2. Este servicio ofrece servidores web que provee a los usuarios
de Internet, un sistema para poder almacenar información,
imágenes, vídeo, o cualquier contenido accesible vía Web y
publicación.
3. Existen gratuitos y de pago que dependerá de las
necesidades.
4. Así también, muchos hosting proveen de la venta de un
dominio, es decir el nombre de un sitio web. El cual
reemplaza a la dirección numérica conocida como IP
(Protocolo de Internet).
5. Cada dominio tiene que ser único en Internet. Está
compuesto generalmente del nombre, extensión del Fuente: https://www.hostingperu.com.pe/
dominio y país.

10
1.1.6 HTML
• HTML (Hyper Text Markup Language), es un lenguaje de
hipertexto, que permite escribir texto de forma estructurada, y
que está compuesto por etiquetas, que marcan el inicio y el fin
de cada elemento del documento.
• Los documentos HTML deben tener la extensión html.
• Los navegadores se encargan de interpretar el código HTML
de los documentos, y de mostrar a los usuarios las páginas web
resultantes del código interpretado.
• Actualmente, se utiliza el HTML5.

11
1.1.7 Navegadores de internet
• Un navegador web (web browser) es un programa
que permite visualizar la información que contiene una
página web, la cual puede estar alojada en un servidor
dentro de la World Wide Web o en uno local.
• La funcionalidad de un navegador web es permitir la
visualización de documentos de texto, reproducir
recursos multimedia incrustados y ejecutar acciones.
• Los documentos pueden estar ubicados en la
computadora, del usuario, o en cualquier otro
dispositivo que esté conectado a la computadora del
usuario o por Internet.

Fuente: https://gs.statcounter.com/browser-market-share/all/south-america
12
1.1.8 Proyecto web
Es una planeación estructurada, para solucionar una necesidad
de una empresa u organización, a través de una aplicación, que se
accederá vía internet o vía web.

13
1.1.9 Etapas de un proyecto web
• Existen muchas sugerencias respecto a las fases del desarrollo de un sitio web, variando ligeramente:

Fuente: https://grupovisuallab.com/las-7-fases-de-desarrollo-de-un-sitio-web-optimo/

14
1.1.9 Etapas de un proyecto web
1. Análisis. Se debe identificar el propósito del sitio web, los objetivos y el público al que irá dirigido.

2. Planificación. Es importante definir el mapa del sitio, para dimensionar la magnitud y el alcance del proyecto que
se va a realizar, también nos permite crear la estructura y las tecnologías que debemos utilizar para nuestra
página web.

3. Diseño. Durante esta etapa debemos concentrarnos en el diseño visual del sitio, que tenga una comunicación
clara, colores que representen la marca o producto. Es importante centrarse en la utilización de los principios de
la usabilidad (facilidad de uso para el usuario), UI (interfaz de usuario) y UX (experiencia del usuario), estos
permiten que además del diseño gráfico, el sitio web sea funcional y más efectivo.

4. Contenidos. En esta etapa debemos concentrarnos en la redacción de textos correctamente, inclusión de

imágenes, videos con optimización para la web y la optimización para motores de búsqueda (SEO). Los
contenidos son la materia prima de nuestro proyecto, de estos depende en gran parte el éxito porque al fin y al
cabo es lo que nuestros usuarios utilizarán.

15
1.1.9 Etapas de un proyecto web
5. Desarrollo. En este punto se desarrolla el sitio utilizando lenguajes como HTML, CSS y otros. También es
importante aspectos funcionales como el diseño adaptativo (responsive size), esto permitirá tener
compatibilidad con dispositivos móviles y llegar a una mayor cantidad de usuarios.

6. Pruebas. Se deben realizar pruebas técnicas para el funcionamiento adecuado de la página web, se revisa la
compatibilidad con los navegadores web y muy importante revisar si el sitio web cumple con el propósito que se
plantea en los objetivos iniciales.

7. Lanzamiento. Una vez se publique el sitio web en internet para el público, se debe realizar un monitoreo
constante para evitar fallas técnicas o realizar algún ajuste. También es necesario el mantenimiento del sitio web
no solo en temas técnicos sino en actualización de contenidos.

16
Conclusiones
• HTML, es un lenguaje compuesto por etiquetas, que marcan el inicio y el fin de elementos con los que se
estructura una página web.
• Un navegador web es un programa que permite “interpretar” las etiquetas del lenguaje HTML y mostrar la
información que contiene una página web.
• Hosting es un servicio que permite publicar y alojar páginas web para que otros puedan visitarlas, reduciendo
el costo de implementar un servidor web en la empresa.
• Proyecto web, es una planeación estructurada, para solucionar una necesidad de una empresa u
organización, a través de una aplicación, que se accederá vía internet o vía web.
• El mapa de un sitio web es un documento que se utiliza para planificar el diseño del sitio web, donde se listan
todas o las más importantes páginas web del mismo (generalmente organizadas de alguna manera).

17
Referencias bibliográficas
• García de León, A. (octubre-diciembre 2002). Etapas en la creación de un sitio web. BIBLIOS, (14), 1-18.
http://eprints.rclis.org/5474/1/T14-01.pdf
• Torregrosa, M. (2016). Infografía de los pasos para diseñar una página web.
https://www.n4gash.com/2016/infografa-pasos-diseno-pagina-web/
• Uniwebsidad. (2006-2022). Los mejores recursos para aprender diseño y programación web.
https://uniwebsidad.com/

18
 GRACIAS

SEDE INDEPENDENCIA SEDE BREÑA SEDE TRUJILLO

Av. Carlos Izaguirre 233 Av. Brasil 714 – 792 (CC La Rambla – Piso 3) Calle Borgoño 361
Independencia – Lima Breña – Lima Trujillo
Teléfono: 633-5555 Teléfono: 633-5555 Teléfono: (044) 60-2000

SEDE SAN JUAN DE LURIGANCHO SEDE LIMA CENTRO SEDE BELLAVISTA SEDE AREQUIPA
Av. Próceres de la Independencia 3023-3043 Av. Uruguay 514 Av. Mariscal Oscar R. Benavides 3866 – 4070 Av. Porongoche 500
San Juan de Lurigancho – Lima Cercado – Lima (CC Mall Aventura Plaza) (CC Mall Aventura Plaza)
Teléfono: 633-5555 Teléfono: 419-2900 Bellavista – Callao Paucarpata - Arequipa
Teléfono: 633-5555 Teléfono: (054) 60-3535

www.cibertec.edu.pe