Sitios web
Los sitios web son archivos que los usuarios descargan con sus navegadores desde ordenadores remotos. Cuando un usuario decide acceder a un sitio web, le comunica al navegador la dirección del sitio y el programa descarga los archivos, procesa su contenido y lo muestra en pantalla.
Debido a que los sitios webs son de acceso público e Internet es una red global, estos archivos deben estar siempre disponibles. Por este motivo, los sitios web no se almacenan en ordenadores personales, sino en ordenadores especializados diseñados para despachar estos archivos a los usuarios que los solicitan. El ordenador que almacena los archivos y datos de un sitio web se llama servidor y el ordenador que accede a esta información se llama cliente, tal como lo muestra la siguiente imagen.
Los servidores son muy similares a los ordenadores personales, con la diferencia de que están conectados a la red y ejecutando programas que les permiten responder a las solicitudes de los usuarios, sin importar cuándo se reciben o de donde proceden. Los programas más populares para servidores son Apache, para sistemas Linux, e IIS (Internet Information Server), creado por Microsoft para sistemas Windows. Entre otras funciones, estos programas son responsables de establecer la conexión entre el cliente y el servidor, controlar el acceso de los usuarios, administrar los archivos, y despachar los documentos y recursos requeridos por los clientes.
Archivos
Los sitios web están compuestos de múltiples documentos que el navegador descarga cuando el usuario los solicita. Los documentos que conforman un sitio web se llaman páginas y el proceso de abrir nuevas páginas, navegar (el usuario navega a través de las páginas del sitio).
Para desarrollar un sitio web, tenemos que crear un archivo por cada página que queremos incluir. Junto con estos archivos, también debemos incluir los archivos con las imágenes y cualquier otro recurso que queremos mostrar dentro de estas páginas (las imágenes y otros medios gráficos se almacenan en archivos aparte).
En la imagen se muestran dos directorios llamados imagenes y recursos, y tres archivos llamados contacto.html, index.html y news.html.
Los directorios se crearon para almacenar las imágenes que queremos mostrar dentro de las páginas web y otros recursos, como los archivos que contienen los códigos en CSS y JavaScript.
Por otro lado, los archivos de este ejemplo representan las tres páginas web del sitio. El archivo index.html contiene el código y la información correspondiente a la página principal, contacto.html contiene el código necesario para presentar un formulario que el usuario puede rellenar para enviarnos un mensaje y noticias.html contiene el código necesario para mostrar las noticias que queremos compartir.
Los archivos de un sitio web son iguales que los archivos que podemos encontrar en un ordenador personal.
Todos tiene un nombre seleccionado por el desarrollador y una extensión que refleja el lenguaje usado para programar su contenido (en nuestro ejemplo, los archivos tienen la extensión .html porque fueron desarrollados en HTML).
Si un usuario accede al servidor sin especificar el nombre del archivo que intenta abrir,el servidor busca el archivo index y lo envía de vuelta al cliente.
Dominios y URL
Los servidores se identifican con un valor llamado IP (Internet Protocol). Esta IP es única para cada ordenador y, por lo tanto, trabaja como una dirección que permite ubicar a un ordenador dentro de una red.
Cuando el navegador tiene que acceder a un servidor para descargar el documento solicitado por el usuario, primero busca el servidor a través de esta dirección IP y luego le pide que le envíe el documento.
Las direcciones IP están compuestas por números enteros entre 0 y 255 separados por un punto, o números y letras separadas por dos puntos, dependiendo de la versión (IPv4 o IPv6).
Por ejemplo, la dirección 216.58.198.100 corresponde al servidor donde se encuentra alojado el sitio web de Google. Si escribimos esta dirección IP en la barra de navegación de nuestro navegador, la página inicial de Google se descarga y muestra en pantalla.
Podemos acceder a cualquier servidor utilizando su dirección IP, pero estos valores son difíciles de recordar y pueden variar cuando uno cambia de servidor. Por esta razón, Internet utiliza un sistema que identifica a cada servidor con un nombre específico. Estos nombres son personalizados y los llamamos dominios, que son fáciles o significativos para recordar, como google o yahoo,además cuentan con una extensión que determina el propósito del sitio web al que hacen referencia, como .com (comercial), .org (organización), etc.
Cuando el usuario le pide al navegador que acceda al sitio web con el dominio www.google.com, el navegador accede primero a un servidor llamado DNS que contiene una lista de dominios con sus respectivas direcciones IP. Este servidor encuentra la IP 216.58.198.100 asociada al dominio www.google.com, la devuelve al navegador, y entonces el navegador accede al sitio web de Google por medio de esta IP.
Los sitios web están compuestos por múltiples archivos, por lo que debemos agregar el nombre del archivo al dominio para indicar cuál queremos descargar. Esta construcción se llama URL e incluye tres partes, tal como lo podemos observar en la siguiente imagen.
- La primera parte representa el protocolo de comunicación que se utiliza para acceder al recurso (el protocolo creado para la Web se llama HTTP).
- El siguiente componente es el dominio del sitio web.
- El último componente es el nombre del recurso que queremos descargar.
Las URL se utilizan para ubicar cada uno de los documentos en el sitio web y son necesarias para navegar por el sitio.
Hipervínculos
Podemos acceder a todos los documentos de un sitio web escribiendo la URL en la barra de navegación del navegador.
Ejemplos:
https://elprofealegria.com/ –> Vamos directo a la página de inicio.
https://elprofealegria.com/html-css-js/ –> Vamos directo al indice de HTML-CSS-JS donde encontraremos el link/enlace a «Sitios Web», que es donde está este texto.
Así es posible acceder a todos los archivos del sitio web pero no es práctico porque:
- los usuarios no conocen los nombres que el desarrollador eligió para cada archivo y, por lo tanto, estarán limitados a aquellos nombres
que pueden adivinar o solo a la página principal que devuelve por defecto. - los sitios web pueden estar compuestos por docenas o incluso miles de páginas web (algunos sitios contienen millones) y serían practicamente imposibles de encontrar.
La solución son los hipervínculos también llamados enlaces, que hacen referencia a documentos dentro de las páginas de un sitio web. Si el usuario hace clic con el ratón en un enlace, el navegador sigue esa referencia y el documento indicado por la URL de la referencia se descarga y muestra en pantalla.
Debido a estas conexiones entre páginas, los usuarios pueden navegar haciendo clic en los enlaces del sitio web y acceder a todos sus documentos.
URL absolutas y relativas
Los hipervínculos se pueden definir con URL absolutas o relativas.
Las URL absolutas son aquellas que incluyen toda la información necesaria para acceder al recurso.
Las URL relativas son aquellas que solo declaran la parte de la ruta que el navegador tiene que agregar a la URL actual para acceder al recurso.
Ejemplo: Tenemos un hipervínculo dentro de un documento que referencia una imagen dentro del directorio imagenes, con la URL http://www.ejemplo.com/imagenes/miimagen.png, pero tenemos la opción de declararla como «imagenes/miimagen.png» y el navegador se encarga de agregar a esta ruta la URL actual y descargar la imagen.
Las URL relativas no solo pueden determinar una ruta hacia abajo, sino también hacia arriba de la jerarquía.
Ejemplo: si tenemos un documento dentro de un directorio raíz,podemos crear una URL relativa usando los caracteres ../ al comienzo de la ruta. Si el documento que queremos acceder es prueba.html, la URL relativa sería ../pruebas.html. Los dos puntos .. le indican al navegador que el documento al que queremos acceder se encuentra dentro del directorio padre del actual directorio.