Lectura 1.

<Introducción al Diseño Web= 10

Instrucciones: Realiza el análisis de la siguiente información, posteriormente, completa la
Actividad 1. Conceptos básicos de Página Web.

Tecnologías de la Información y la Comunicación

¿Qué es una Página Web?
Es una página electrónica o documento digital de carácter multimediático (es decir, capaz de incluir audio,
video, texto y sus combinaciones), adaptado a los estándares de la World Wide Web (WWW) y a la que
se puede acceder a través de un navegador Web y una conexión activa a Internet. Se trata del formato
básico de contenidos en la red.

Actualmente representan el principal archivo de información por lo que existen millones de ellas de
diversas índole y contenido en distintos idiomas y de todas partes del mundo. Estas las podremos
encontrar guardadas en muchos servidores a los que podemos acceder a través de protocolos de
comunicación (HTTP).

Las páginas Web se encuentran programadas en un formato HTML o XHTML y se relacionan por medio de
hipervínculos que son enlaces hacia otros contenidos que podemos hacer para poder tener una lectura
compleja, simultánea y diversa. Cumplen básicamente con la tarea de brindar información de cualquier
índole y en cualquier estilo o grado de formalidad.

Las funciones de una página Web son amplias ya que la mayor parte de la demanda de los usuarios y la
oferta de quienes las hacen. Existen dos tipos de acuerdo con la forma en que se genera su contenido,
estas pueden ser:
Estáticas. Son de carácter documental o informativo ya que no permiten la interacción del usuario.
Operan mediante la descarga de un fichero programado en código HTML y en este se encuentran todas
las instrucciones para que el navegador muestre la página Web, accediendo a las ubicaciones de sus
elementos y siguiendo un orden preconcebido, rígido sin dar ningún tipo de acceso.
Dinámicas. Estas se generan en el momento mismo del acceso del usuario, empleando para ello algún
lenguaje interpretado (como el PHP), lo cual le permite recibir solicitudes del usuario, procesarlas en bases
de datos y ofrecer una respuesta acorde a sus requerimientos.

Todas las páginas Web necesitan de un navegador Web para ser visualizadas y utilizadas. Un navegador
Web es un software de aplicación que permite abrir páginas Web ya sea en una ruta local (como el disco
rígido) o desde la red de Internet. Se les conoce como <navegadores= o <exploradores= porque nos
permiten <entrar= a Internet y visualizar distintos contenidos a partir del ingreso de direcciones URL o del
empleo de servicios online de búsqueda de datos (conocidos como Buscadores Web).
Debemos tener en cuenta entonces que no es lo mismo hablar de página Web (Web page) y de sitio Web
(Web site), ya que estos últimos son los que contienen un número diverso de las primeras.
11
Por lo que definimos a un sitio web, como un espacio virtual en Internet que contiene un conjunto de
páginas web que son accesibles desde un mismo dominio o subdominio de la World Wide Web (WWW).
Este debe estar en condiciones de adaptarse a distintos formatos de pantalla.

Tecnologías de la Información y la Comunicación

En los sitios web podremos encontrar documentos HTML, fotografías, sonidos, vídeos, animaciones y
otros tipos de contenidos que pueden compartirse en línea. Se identifican por una dirección URL única
que la mayor parte de las veces pertenece a la página de inicio también conocida como Home page que
es la que comúnmente nos permite el acceso a todas las páginas del sitio mediante links (hipervínculos o
enlaces).

Cada página web que encontramos en un sitio está diseñada empleando un código en HTML y se
encuentra guardada en una cuenta de hosting a través de un dominio el cual permitirá que un navegador
pueda mostrarla en internet.

Clasificación de las páginas web

Página web estática Página web dinámica
Es un sitio de internet que muestra
Son aquellas en las que la información
información permanente donde el
presentada se genera a partir de una
DEFINICIÓN usuario no puede interactuar con la
petición del usuario de la página y
página visitada excepto para leer el
permiten a los usuarios que la visitan
contenido.
• Incluye texto y archivos • Utilizan bases de datos para
multimedia como videos, cargar la información y los
imágenes, audio, banners o GIF contenidos se actualizan cada vez
CARACTERÍSTICAS animados. que el usuario accede a la
• Se desarrollan con HTML y CSS en aplicación.
editores de texto simple. • Desarrolladas en lenguajes como
• Sencillas de programar y menos JavaScript, PHP O ASP.
costosas. • Más complejas en su construcción
y diseño.
Portafolios digitales, blog, página web
Páginas de encuestas y votaciones,
corporativa de una empresa.
EJEMPLOS noticias, compra de productos, libros,
revistas y periódicos digitales.
 Según el negocio o función:

▪ Buscadores ▪ Sitios web de eCommerce 12

▪ Foros ▪ Sitios web de noticias
▪ Blogs ▪ Sitio Web corporativas
▪ Wikis ▪ Sitios educativos
▪ Videos ▪ Sitios de gobierno

Tecnologías de la Información y la Comunicación

HTML: ( Hyper Text Markup Language) Es un lenguaje de marcado de hipertexto que se utiliza para crear
las páginas web a las que accedemos en internet a través de los navegadores ya que este permite
estructurar un documentos a través de etiquetas. Se caracteriza por ser adaptable y contener una
estructura lógica muy fácil de entender.
El lenguaje HTML es un estándar reconocido en todo el mundo y cuyas normas define un organismo sin
ánimo de lucro llamado World Wide Web Consortium, mejor conocido como W3C. Los estándares
oficiales HTML son el HTML 2.0, el HTML 3.2, el HTML 4.0, el HTML 4.01 y el HTML 5. El HTLM 5 es la última
especificación oficial.

Figura 1_Gima (2019) Cronología diseño WEB

<Desde la creación del primer sitio web, hasta hoy los cambios son abismales. Y lo más interesante de
todo es que esta evolución es constante= (Gima, 2019), desde la creación del código HTML hasta ahora
han existido diferentes técnicas de creación de páginas web. Cada una proporciona una estructura distinta
para optimizar los recursos buscando evolucionar hacia la experiencia del usuario para que la navegación
por internet sea más fácil e intuitiva.
Diseño web: Es la actividad que se encarga de la planificación, el diseño,
la implementación, el mantenimiento y la creación de páginas web
13
utilizando lenguajes de marcado como HTML o XML, o aplicaciones como
Adobe Dreamweaver y CMS que son plataformas de administración de
contenido y tomando en cuenta para ello el diseño de la interfaz, todos
los elementos gráficos a utilizar la experiencia que tendrá el usuario con

Tecnologías de la Información y la Comunicación

el sitio.

Se encarga de la parte visual (estética) de la página por lo que busca que el resultado obtenido ofrezca
una buena experiencia con navegación y arquitectura agradable al usuario que permite un grado de
usabilidad aceptable y no haga que este abandone el sitio moviéndose a otras páginas.

Servidor web: es una computadora de gran capacidad que tiene

como función almacenar los archivos de un sitio y emitirlos por
Internet para poder ser visitado por los usuarios. Cuando un
usuario entra en una página de Internet el servidor es el que
encarga de proporcionar todos los elementos de esta a tu
computadora para que sean visualizados por su navegador.

Hosting: Es el espacio en
línea que proporciona un
servidor para almacenar todo el contenido de un sitio web que hará
que este funcione adecuadamente. Este servicio permite publicar un
sitio o aplicación web en internet a través de un dominio mientras
se navega por Internet.

Dominio: Es el nombre único en internet que identifica una página web o un sitio web y por medio del
cual podrán acceder los usuarios. Este puede ser alfanuméricos, es decir, compuestos de letras y
números, en una secuencia específica y puntual.
Este nombre contiene los siguientes elementos:

• Nombre de la organización. El nombre específico de la empresa, persona u organización de

cualquier tipo que estamos buscando, como puede ser Cobatab.
• Tipo de organización. Define el tipo de organización al que pertenece la empresa del sitio, puede
discernir entre páginas comerciales (.com), de telecomunicaciones (.net de network),
organizacionales (.org), gubernamentales (.gob), educación (.edu), etc.
Un navegador web necesita un nombre de dominio (dirección física) para dirigirte a un sitio web. Internet
funciona y está organizado a través de direcciones IP, cada dirección IP dirige el explorador a una ubicación
donde el servicio de hosting tiene almacenados los archivos. Estas direcciones se encuentran en un
14
formato de números separados por puntos (por ejemplo [Link]) que es muy difícil de recordar y
no son atractivos, por lo que se crearon los dominios, en los que se pueden utilizar letras, números y
algunos caracteres especiales para crear un nombre atractivo al sitio web. Un mecanismo conocido como
DNS (Sistema de Nombres de Domino) se encarga de <traducir= el nombre del dominio en la dirección IP

Tecnologías de la Información y la Comunicación

a la que este apunta y así permite que mediante este se pueda acceder a los archivos que contienen el
sitio web y visualizarlo en el explorador.

URL: (Uniform Resource Locator, en español Identificador de Recursos Uniforme) es la dirección única y
específica que se asigna a cada uno de los recursos (páginas, sitios, documentos, archivos, carpetas)
disponibles de la World Wide Web para que puedan ser localizados por el navegador y visitados por los
usuarios.

Partes de una URL

1. Protocolo de red. Http, Https, Mailto y FTP son protocolos web que encabezan una URL, indicando
a la máquina qué tipo de conexión debe realizar y el lenguaje específico que se hablará con la
computadora o la red de computadoras que brindarán la información al usuario.
2. Servicio. Se trata de los servicios de soporte de información on-line, de los cuales la World Wide
Web (WWW) es la más popular.
3. Dominio, tipo de dominio y país. Es el <nombre= de la empresa que brinda la información, o del
proyecto, la red o la computadora en donde se encuentran, es decir, el nombre específico de
quien tiene lo que buscamos, el tipo de servicio que presta: comercial (.com), educativo (.edu),
etc., y el país al que pertenece: Argentina (.ar), Brasil (.br), Italia (.it), etc.
4. Ruta y nombre del archivo. Las carpetas y directorios en los que se ubica el recurso específico
dentro del computador servidor (que brinda la información).
Ejemplo

Applet: es un programa que puede incrustarse en un documento

HTML (página Web). Cuando un Navegador carga una página Web
que contiene un Applet, éste se descarga en el navegador Web y
comienza a ejecutarse, lo cual nos permite crear programas que
cualquier usuario puede ejecutar. Para que el applet funcione se Figura 2_L. (2018, 30 abril). Applet.
debe tener instalado el Java y que esté activado a través del explorador web, además puede realizar
muchas operaciones como operaciones aritméticas, mostrar gráficos, reproducir sonidos, aceptar
entradas de usuario, crear animaciones y juegos interactivos.
15

Elementos de una página web

1. Contenido: Debe ser atractiva visualmente y con contenido interesante y actualizado que

Tecnologías de la Información y la Comunicación

atraiga al público objetivo.
2. Tipografía: Se debe utilizar fuentes llamativas pero sencillas de leer con variaciones de tamaño
para resaltar secciones interesantes del contenido y del texto.
3. Imágenes: Las imágenes utilizadas no deben estar pixeladas o desenfocadas, ya que pueden
causar una mala imagen del sitio en general.
4. Animaciones y movimiento: Se pueden utilizar elementos animados para generar una
sensación de dinamismo, pero no abusar de éstos.
5. Botones e iconos: Deben utilizar botones prácticos y representativos para hacer atractiva la
página, así como iconos grandes y vistosos que aumenten la facilidad de navegación en la
página.
6. Fondos claros y sencillos: Si se usa fondos claros o totalmente blancos facilitan la visualización
y dan un aspecto despejado a la página resaltando las imágenes.
7. Enlaces a redes: Se deben incluir enlaces a redes sociales con las cuales el usuario pueda
interactuar con facilidad.
8. Sobriedad: Debe permitir una fácil visualización de los contenidos (vídeos, imágenes, textos).
Saturar al cibernauta con mucho contenido puede ser contraproducente.
 Actividad 1. Conceptos básicos de Página Web 16

Instrucciones: De acuerdo con la Lectura 1 <Introducción al diseño web= elabora una

infografía utilizando un software de aplicación.

Tecnologías de la Información y la Comunicación

<Con esfuerzo y perseverancia podrás alcanzar tus metas=

 INSTRUMENTO DE EVALUACIÓN LISTA
DE COTEJO
17
Actividad 1: Infografía <Conceptos básicos de página Web=

DATOS GENERALES
Nombre(s) del alumno(s) Matricula(s)

Tecnologías de la Información y la Comunicación

Producto: Infografía en formato tabloide Fecha
Materia: Diseño de página Web Periodo: 2022-2023B

Nombre del docente Firma del docente

VALOR
OBTENIDO OBSERVACIONES
INDICADORES
PONDERACIÓN CAL Y/O SUGERENCIAS
CRITERIO SI NO
DE MEJORA
Contiene imágenes que representan el
1 2
tema solicitado.
Utiliza texto breve y conciso que facilita
2 1
la comprensión del tema.
3 Muestra orden en el trabajo. 1
Contiene los conceptos revisados en la
4 2
lectura
Carece de faltas de ortografía y
5 1
gramática.
Utiliza fuentes y diversos colores
6 1
acordes con el tema
Presenta un trabajo creativo y agradable
7 1
a la vista.
8 Entrega en tiempo y forma. 1
CALIFICACIÓN

Observaciones: