El documento proporciona información sobre el funcionamiento de las páginas web, incluyendo los conceptos clave como servidores, clientes, navegadores, URLs, protocolos HTTP e HTML. Explica los pasos para visualizar una página web, desde escribir la URL hasta que el navegador compone la página final. También describe los elementos básicos de una página web como encabezados, menús, contenido y pie de página, y los factores a considerar en el diseño como la accesibilidad y usabilidad.

1. TIC – 2º Bachilllerato Diseño Páginas Web. HTML.
Página 1 de 5
1. FUNCIONAMIENTO DE LA WEB
La World Wide Web (WWW), comúnmente conocida como la web, se
compone de un sistema de páginas web o sitios web, compuestas a su vez de
documentos relacionados entre sí mediante hipervínculos que permiten así su
localización y acceso. Los documentos que constituyen un sitio web son archivos
organizados en carpetas, que contienen texto, fotografías, botones, iconos,
animaciones, hipervínculos, multimedia, gráficos, tablas, etc.
TÉRMINOS ASOCIADOS A INTERNET
Servidor web: ordenador remoto que tiene
instalados los programas necesarios para
enviar los documentos requeridos por un
ordenador cliente.
Cliente: ordenador conectado a Internet que
realiza la petición de documentos incluidos en
una página web para visualizarlos mediante
programas navegadores.
Navegador web: software instalado en el ordenador del cliente
que se encarga de comunicar el ordenador cliente con los servidores que albergan las
páginas web, descargar las páginas y mostrarlas en nuestro equipo visualizando
los documentos en formato web (HTML) y permitiendo el funcionamiento de
los hiperenlaces. Los navegadores más utilizados son Internet Explorer,
Google Chrome, Opera, Safari, Mozilla Firefox y Netscape.
URL: dirección textual de un servidor web determinado.
IP: código identificativo de un equipo informático o servidor en Internet, formado por cuatro
números, separados por puntos, cuyo valor no puede exceder de 255.
TEMA Nº 6
Diseño de páginas web.
I.E.S. Cruz Santa
2º Bachillerato
Criterios de Evaluación
8. Elaborar y publicar información en Internet con la calidad requerida.
Este criterio pretende determinar la capacidad de los alumnos y alumnas para crear páginas web tanto en entornos
a base de asistentes, configurando gestores de contenidos, o mediante aplicaciones específicas para su diseño, y
publicarlas en un alojamiento web. Todo ello con el nivel de calidad de diseño y contenido que se especifique.

2. TIC – 2º Bachilllerato Diseño Páginas Web. HTML.
Página 2 de 5
DNS: base de datos que relaciona una dirección textual de un servidor (URL) con su dirección IP.
Esta base de datos se encuentra en unos servidores de dominios que deben ser especificados en
nuestra conexión a Internet.
HTTP: Protocolo de transferencia de hipertexto. Al encabezar una URL con este término, el
servidor reconocerá que se le está solicitando un documento web.
HTML: acrónimo inglés del término Hipertext Markup Language, que se traduce como “Lenguaje
de marcado de hipertextos”. Los archivos creados en este formato tienen extensiones .html o .htm.
Funcionamiento de la web: el sistema de visualización de documentos en la World Wide
Web sigue los siguientes pasos:
o Paso 1. Desde nuestro ordenador ejecutamos el programa navegador de Internet y escribimos
la dirección de una página web. La dirección que insertamos es la URL (por ejemplo, tecleamos
la dirección http://www.google.es/).
o Paso 2. El servidor DNS que tenemos configurado en nuestra conexión a Internet localiza la
dirección IP que corresponde con el ordenador servidor donde se encuentran los archivos web
requeridos.
o Paso 3. Como la URL que hemos tecleado comienza por http://, el ordenador servidor reconoce
que le estamos solicitando algún documento web y nos envía un documento con extensión html.
Si en la dirección URL no se especifica un documento html concreto, el servidor buscará en la
carpeta de la web y nos enviará por defecto el archivo denominado Index.html.
o Paso 4. Nuestro navegador estudia el documento html recibido y solicita al servidor los
archivos con los que esté enlazado, como imágenes.
o Paso 5. Finalmente, nuestro programa navegador compone la página con los textos, enlaces,
imágenes y animaciones. Es importante que al elaborar una página web comprobemos que se
visualiza correctamente en los distintos navegadores, ya que la página está compuesta por ellos
y puede ocurrir que no se visualice de igual manera en todos.
2. PÁGINAS WEB.
Lo que habitualmente llamamos página web es un sitio web (website) constituido por distintos documentos
enlazados entre sí a los que se accede a través de una dirección común. Los documentos que constituyen un sitio web
son archivos, organizados en carpetas, que contienen texto, fotografías, botones, iconos, animaciones, hipervínculos,
multimedia, gráficos, tablas, etc., y que se han creado para ser vistos por usuarios con ordenadores y navegadores de
distintas características.
El lenguaje que se usa para crear los documentos que
conforman el sitio web es el HTML (hipertext markup language,
lenguaje de marcas hipertextuales). Una página web se puede crear
(ya que se puede optar por otros métodos como utilizar los editores
WYSIWYG o gestores online), directamente escribiendo en este
código en cualquier editor de textos y guardándolo con la extensión
.html o .htm.

3. TIC – 2º Bachilllerato Diseño Páginas Web. HTML.
Página 3 de 5
Las páginas web se clasifican en estáticas y dinámicas:
 Estáticas. Son aquellas que no cambian, que muestran siempre el mismo contenido cada vez que las
cargamos. Se realizan en lenguaje HTML.
 Dinámicas. Son páginas interpretadas por el servidor de forma que, sin realizar cambios en el código,
devolverán diferentes resultados en función de la actuación del usuario. Por ejemplo, un buscador es una
página web dinámica que devuelve diferentes resultados según la petición del usuario. Se realizan
combinando HTML con lenguajes dinámicos (considerados lenguajes de programación), como ASP,
ASP.NET (Active Server Pages), JAVA, PHP o JavaScript.
3. PLANIFICACIÓN. OBJETIVOS. ELEMENTOS DE UNA WEB.
El primer paso para diseñar una web es la fase que podemos llamar prediseño.
Debemos analizar qué objetivos queremos conseguir con nuestra web y
posteriormente construirla según la planificación marcada para que se cumplan esos
objetivos.
A grandes rasgos, debemos preguntarnos:
1. Objetivo ¿Qué se pretende conseguir con la web?
2. Público ¿A quién se dirige?
3. Contenidos ¿Qué contenidos se quieren mostrar?
4. Directrices ¿Qué especificaciones se usarán en cuanto a forma, organización y
estructura?
5. Tecnología ¿Con qué medios técnicos se cuenta para realizarla?
6. Tiempo ¿De cuánto tiempo se dispone?
7. Presupuesto ¿De cuánto dinero se dispone?
De modo que, en esta etapa debemos escribir nuestros objetivos, recopilar y organizar contenidos, escribir
las directrices de organización y diseño y establecer un código de colores para los distintos elementos.
Debemos también:
 Crear una jerarquía visual clara en cada página.
 Utilizar las convenciones (lo que se usa de forma general y mayoritaria en las páginas web).
 Dividir las páginas en áreas claramente definidas.
 Facilitar el acceso a los enlaces.
 Omitir contenidos innecesarios, es decir, simplificar.

4. TIC – 2º Bachilllerato Diseño Páginas Web. HTML.
Página 4 de 5
Una web tipo tendrá, generalmente, los siguientes elementos y dispuestos según el esquema que se muestra
a continuación:
ENCABEZAMIENTO
MARCA O
LOGOTIPO
TITULAR
MENÚ DE
NAVEGACIÓN
CONTENIDOS (texto, fotografías, botones, iconos, animaciones,
hipervínculos, multimedia, gráficos, tablas, etc.
PIE DE PÁGINA
4. ELEMENTOS DE DISEÑO
A la hora de diseñar una web hay que atender a cuestiones tan elementales como el contraste del texto con el fondo,
el tamaño de los caracteres o la elección de los colores. Cuestiones que, evidentemente, dependen del gusto del
diseñador pero que hay que cuidar y analizar. Cuando un visitante llega a una página, no debería hacerse preguntas
como “¿dónde estoy?”, “¿por dónde empiezo?”,”¿qué es esto?”, “¿dónde está lo que busco?”,…
En esta fase entran en juego dos conceptos:
Maquetación: se encarga de organizar espacios y contenidos escritos, visuales y audiovisuales. Abarca los
aspectos semánticos y formales de una aplicación digital (tipografía, el punto, la línea, la forma, el color, fotografías,
símbolos, iconos...).
Interfaz: es el conjunto de comandos y métodos que facilitan la interacción entre el usuario y el sistema (el
sitio web).

5. TIC – 2º Bachilllerato Diseño Páginas Web. HTML.
Página 5 de 5
5. ACCESIBILIDAD
Los Criterios de Accesibilidad surgen de un compromiso que se adopta para que los
sitios web cumplan unas normas que les permitan ser visitados y utilizados por el mayor
número posible de personas, minimizando el efecto de las limitaciones físicas y técnicas
de los posibles visitantes.
Estos Criterios están recogidos por el Wold Wide Web Consortium (W3C). La WAI
(web accessibility initiative) es una rama del W3C que establece niveles de accesibilidad
(A, AA y AAA) para las webs en función del grado de cumplimiento de dichos criterios,
desde los más básicos hasta los más exigentes.
La adopción de criterios de accesibilidad a la hora de diseñar una web, no sólo intentar conseguir aumentar el
número de visitantes, sino también, reducir el tiempo de carga de la página o disminuir el número de errores. Algunas
acciones que se pueden llevar a cabo para aumentar el nivel de accesibilidad son:
Utilizar hojas de estilo.
Asegurarse de que la página se ve bien en distintos navegadores.
Usar las etiquetas de texto alternativo para describir la función de los elementos visuales.
Facilitar la trascripción de los ficheros de sonido y la descripción de los vídeos.
Organizar las páginas usando encabezados, listas y una estructura consistente.
Realizar tablas de manera que se puedan leer línea a línea.
Revisar y validar el código HTML.