El origen de las paginas web

Presentación del tema: "El origen de las paginas web"— Transcripción de la presentación:

1 El origen de las paginas web

2 Origen de las web Historia de la World Wide Web
a Web se remonta a la propuesta de Vannevar Bush en los años 40 sobre un sistema similar: a grandes rasgos, un entramado de información distribuida con una interfaz operativa que permitía el acceso tanto a la misma como a otros artículos relevantes determinados por claves. Este proyecto nunca fue materializado, quedando relegado al plano teórico bajo el nombre de Memex. Es en los años 50 cuando Ted Nelson realiza la primera referencia a un sistema de hipertexto, donde la información es enlazada de forma libre. Pero no es hasta 1980, con un soporte operativo tecnológico para la distribución de información en redes informáticas, cuando Tim Berners-Lee propone ENQUIRE al CERN (refiriéndose a Enquire Within Upon Everything, en castellano Preguntando de Todo Sobre Todo), donde se materializa la realización práctica de este concepto de incipientes nociones de la Web.

3 ¿Qué significa la palabra Web?
World Wide Web (la "telaraña" o "maraña mundial") es tal vez el punto más visible de Internet y hoy en día el más usado junto con el correo electrónico, aunque también es de los más recientes. Originalmente denominado Proyecto WWW y desarrollado en el CERN suizo a principio de los 90, partió de la idea de definir un "sistema de hipermedios distribuidos."

4 Páginas Web Una ventana muestra al usuario la información que desea, en forma de texto y gráficos, con los enlaces marcados en diferente color y subrayados. Haciendo un clic con el ratón se puede "saltar" a otra página, que tal vez esté instalada en un servidor al otro lado del mundo. El usuario también puede "navegar" haciendo pulsando sobre las imágenes o botones que formen parte del diseño de la página.

5 Estándares Web Destacamos los siguientes estándares:
el Identificador de Recurso Uniforme (URI), que es un sistema universal para referenciar recursos en la Web, como páginas web, el Protocolo de Transferencia de Hipertexto (HTTP), que especifica cómo se comunican el navegador y el servidor entre ellos,

6 el Lenguaje de Marcado de Hipertexto (HTML), usado para definir la estructura y contenido de documentos de hipertexto, el Lenguaje de Marcado Extensible (XML), usado para describir la estructura de los documentos de texto. Berners Lee dirige desde 2007 el World Wide Web Consortium, el cual desarrolla y mantiene esos y otros estándares que permiten a los ordenadores de la Web almacenar y comunicar efectivamente diferentes formas de información.

7 Este NeXTcube usado por Berners-Lee en el CERN se convirtió en el primer servidor web.
Las páginas de la WWW están situadas en servidores de todo el mundo (sitios Web), y se accede a ellas mediante un programa denominado "navegador" (browser). Este programa emplea un protocolo llamado HTTP, que funciona sobre TCP/IP, y que se encarga de gestionar el aspecto de las páginas y los enlaces.

8 La WWW Puede definirse básicamente como tres cosas: hipertexto, que es un sistema de enlaces que permite saltar de unos lugares a otros; multimedia, que hace referencia al tipo de contenidos que puede manejar (texto, gráficos, vídeo, sonido y otros) e Internet, las base sobre las que se transmite la información.

9 Cada página Web tiene una dirección única en Internet, en forma de URL
Cada página Web tiene una dirección única en Internet, en forma de URL. Un URL indica el tipo de documento (página Web o documento en formato HTML), y el de las páginas hipertexto de la WWW comienza siempre por http.

10 El 30 de abril de 1993, el CERN anunció que la web sería gratuita para todos, sin ningún tipo de honorarios.

11 Primer generación: Poco trabajo de diseño. Pocas imágenes.
Todo se trabaja manualmente. Diseño lineal. Limitada tecnología de los navegadores. Poca capacidad de transferencia de información grafica.

12 Segunda generación: Utilización de iconos. Imágenes de fondo.
Aparece el diseño y uso de botones con relieve. Uso de banners. Estructuración de texto de forma jerárquica. Propiedades del código HTML estándar definido. Aparición de monitores y tarjetas graficas con mayores resoluciones y definición de color.

13 No se tuvo en cuenta la accesibilidad ni la usabilidad.
Diferencia en la aparición de estándares de los 2 principales navegadores: Internet Explorer y Netscape.

14 Tercer generacion: El diseño web sigue teniendo muchas restricciones para el uso del lenguaje de los 2 navegadores web. mas dinamismo con la aparición de Macromedia flash. paginas de publicidad ventana de productos y servicios.

15 Cuarta generación: El diseño web ya esta totalmente enfocado a la multimedia integrando en las paginas web los elementos multimedia de ultima generación. Gran variedad de diseño debido a todas las posibilidades que ofrece las ultimas tecnologías para los programadores. Las ultimas versiones de los navegadores soportan muchas mas prestaciones y elementos en las paginas web.

16 Quinta generación: La integración de televisión en la web.
Auge de las paginas de televisión lp o televisión online.

17 Evolución de las paginas web
Para el diseño de páginas web debemos tener en cuenta tres etapas: La primera es el diseño visual de la información que se desea editar. En esta etapa se trabaja distribuyendo el texto, los gráficos, los vínculos a otros documentos y otros objetos multimedia que se consideren pertinentes. Es importante que antes de trabajar sobre el computador se realice un bosquejo o prediseño sobre el papel. Esto facilitará tener un orden claro sobre el diseño.

18 Evolución de las paginas web
La segunda es la estructura y relación jerárquica de las páginas del sitio web, una vez que se tiene este boceto se pasa a 'escribir' la página web. Para esto, y fundamentalmente para manejar los vínculos entre documentos, se creó el lenguaje de marcación de hipertexto o HTML. La importancia de la estructura y arborescencia web radica en que los visitantes no siempre entran por la página principal o incial y en ese caso el sitio debe darle la respuesta a lo que busca rápido, además permitirle navegar por el sitio.

19 Evolución de las paginas web
La tercera, etapa consiste en el posicionamiento en buscadores o SEO. Ésta consiste en optimizar la estructura del contenido para mejorar la posición en que aparece la página en determinada búsqueda.

20 Evolución de las paginas web
El HTML consta de una serie de elementos que estructuran el texto y son presentados en forma de hipertexto por agente de usuario o navegadores. Esto se puede hacer con un simple editor de textos (debe guardarse como texto plano, sin ningún tipo de formato y con extensión .html o .htm). Aprender HTML es relativamente fácil, así que es sencillo crear páginas web de este modo. Esta era la única manera de generarlas hasta que aparecieron, a mediados de 1996, algunos editores visuales de HTML, como MS FrontPage y Adobe Dreamweaver. Con estas herramientas no es necesario aprender HTML (aunque sí aconsejable), con lo cual el desarrollador se concentra en lo más importante, el diseño del documento.

21 Evolución de las paginas web
<h1> a <h6>: encabezados o títulos del documento con diferente relevancia. <table>: define una tabla. <tr>: fila de una tabla. <td>: celda de una tabla (debe estar dentro de una fila). <a>: hipervínculo o enlace, dentro o fuera del sitio web. Debe definirse el parámetro de pasada por medio del atributo href. Por ejemplo: <a href=" se representa como Wikipedia). <div>: división de la página. Se recomienda, junto con css, en vez de <table> cuando se desea alinear contenido. <img>: imagen. Requiere del atributo src, que indica la ruta en la que se encuentra la imagen. Por ejemplo: <img src="./imágenes/mifoto.jpg" />. Es conveniente, por accesibilidad, poner un atributo alt="texto alternativo". <li><ol><ul>: etiquetas para listas. <b>: texto en negrita (etiqueta desaprobada. Se recomienda usar la etiqueta <strong>). <i>: texto en cursiva (etiqueta desaprobada. Se recomienda usar la etiqueta <em>). <s>: texto tachado (etiqueta desaprobada. Se recomienda usar la etiqueta <del>). <u>: texto subrayado.

22 La web en la actualidad Generalmente una página Web hoy está compuesta por uno o varios documentos html relacionados entre sí mediante hipervínculos (enlaces). Además estos documentos pueden contener otros elementos como pueden ser imágenes, sonidos, animaciones multimedia, aplicaciones… La página web también puede traer contenido que es interpretado de forma diferente dependiendo del navegador y generalmente no es mostrado al usuario final. Éstos elementos incluyen, pero no exclusivamente: SCRIPTS, GENERALMENTE JAVA SCRIPT. META TAGS. HOJAS DE ESTILO (CSS - CASCADING STYLE SHEETS). PLANTILLAS DE DISEÑO WEB

23 La web en la actualidad Lenguaje de programación: -- Lenguaje con el que está desarrollada una página Web. Editor: -- Programa utilizado para crear páginas Web sin la necesidad de tener que aprender el lenguaje. Ejemplos: M. Front Page 2000 y Macro-media Dreamweaver. Servidor -- Máquina conectada a Internet que –entre otros servicios- ofrece albergue para páginas Web haciendo que estén accesibles desde cualquier punto de Internet. Cliente FTP -- Programa que permite conectarse al servidor para publicar páginas Web. Hosting -- Hospedaje Web. Dominio -- Dirección Web asociada a una página Web.

24 La web en la actualidad Otros complementos de una web site Banner: Elemento gráfico con forma rectangular, normalmente animado, cuyo contenido es publicidad. Imagen: Archivo gráfico que se puede insertar en una página Web y mostrar en un explorador de Web. Existen diferentes formatos: GIF, JPEG, BMP, TIFF, WMF y PNG, entre otros. Propiedades: Características de un elemento del Web actual, como el título y la dirección URL de un Web o el nombre y el valor inicial de un campo de formulario. También puede especificar propiedades para elementos de página como tablas, gráficos y elementos activos.

25 La web en la actualidad Otros complementos de una web site
Elementos de una página web Una página web tiene contenido que puede ser visto o escuchado por el usuario final. Éstos elementos incluyen, pero no exclusivamente: • Texto. El texto editable se muestra en pantalla con alguna de las fuentes que el usuario tiene instaladas (a veces se utiliza una tecnología de fuentes incrustadas, con lo que vemos en el monitor una fuente que realmente no poseemos, pero es poco frecuente.) El texto editable puede marcarse con el ratón o el teclado y copiarse a otra aplicación, como el bloc de notas (muchos de los elementos textuales de las páginas, en especial los títulos, botones de navegación, etc. son realmente gráficos, y su texto no es editable.)

26 La web en la actualidad Las Aplicaciones de Internet, consisten en el aprovechamiento de la experiencia del usuario en herramientas y funciones de escritorio tan naturales como copiar, cortar y pegar, redimensionar columnas, y ordenar etc., con el alcance y la flexibilidad de presentación y despliegue que ofrecen las aplicaciones o páginas Web junto con lo mejor de la multimedia (voz, vídeo, etc.).

27 Finalidad de una pagina web
Las tecnologías de la información y la comunicación no son ninguna panacea ni fórmula mágica, pero pueden mejorar la vida de todos los habitantes del planeta. Se disponen de herramientas para llegar a los Objetivos de Desarrollo del Milenio, de instrumentos que harán avanzar la causa de la libertad y la democracia, y de los medios necesarios para propagar los conocimientos y facilitar la comprensión mutua“ Actualmente una pagina web tiene un costo promedio de 20usd lo cual equivale a 240usd anual. En México existe una cuota actual 70usd por concepto de registro de nuevo dominio que cubre los 2 primeros años de operación