Conceptos Fundamentales de la Web

INSTITUTO TECNOLÓGICO“BOLIVIA MAR”

CARRERA DE SISTEMAS INFORMÁTICOS

DISEÑO Y PROGRAMACIÓN WEB I

Lic. Gabriel Alejandro Mamani Titto2015

GABRIEL ALEJANDRO

LIC. GABRIEL ALEJANDRO MAMANI TITTO - 2014 2

La World Wide Web (Red de Alcance Mundial) es una colección de documentos electrónicos que están vinculados entre sí, como una gran telaraña.

Estos documentos están almacenados en computadores llamados servidores situados en cualquier parte del mundo.

Servidor de nombres(DNS)

Servidor WebCliente Web(Internet Explorer, Firefox, etc.)

Internet

La Web - www


Conformación de la Web

• De un computador personal

• Un programa explorador para acceder a la Web (Navegador).

• Una conexión a un proveedor de servicios de Internet (ISP, Internet Service Provider)

• Servidores para albergar los datos

• Enrutadores y conmutadores para dirigir el flujo de datos


Navegador

Programa informático que permite visualizar la información contenida en una página web, ya sea alojada en Internet o en un servidor local.

Pone rápida y sencillamente al alcance del usuario, toda la información que ha sido subida por desarrolladores de todo el mundo.

Los navegadores más populares son el Internet Explorer, Mozilla Firefox, Google Chrome, Safari, Opera y algunos otros.

Son utilizados en los ordenadores, pero también muchos dispositivos móviles como celulares o tabletas que pueden integrar estas aplicaciones para su uso en todo momento.


Navegador

Aseguran una experiencia segura al usuario, protegiéndolo de errores, virus y otros elementos nocivos que pueden hallarse en la web y afectar la computadora que realiza la navegación.

Tiene herramientas necesarias para interpretar el código de una página, el cual puede constar de uno o varios lenguajes de programación, y presentar el contenido en pantalla de modo tal que el usuario pueda interactuar con la información y navegar hacia otras páginas a través de enlaces (también conocidos como hipervínculos o links).

http://definicion.de/herramienta


1. Iniciar sesión en un navegador Web (ej.: Internet Explorer, Mozilla, Google Chrome, etc.)

2. Indicar al navegador el URL de la página que se desea "visitar".

URL = Uniform Resource Locator (Identificador de recurso uniforme)

http://www.uv.es/cerveron/index.html

Nombre del protocolo de

comunicacióncon el servidor

(http es el estándar para

web)

Nombre del dominio del

servidor web donde se

almacena el documento

Localización del

documento dentro delsistema de archivos del servidor web

Funcionamiento de la Web



Servidor Web

Cliente Web(Mosaic, Netscape, Internet Explorer,

Firefox, etc.)

InternetAbrir dirección “http://www.uv.es/cerveron/index.html”

Buscando host:www.uv.es

¿dirección IPwww.uv.es?

147.156.11.1

Funcionamiento de la Web 3. El navegador pide al DNS la dirección IP correspondiente al servidor que contiene el documento cuyo URL se ha indicado.

4. El navegador abre una sesión TCP con la máquina cuya dirección IP se ha obtenido.

http://www.uv.es/

http://www.uv.es/



Servidor Web

Cliente Web(Mosaic, Netscape, Internet Explorer,

Firefox, etc.)

InternetAbrir dirección “http://www.uv.es/cerveron/index.html”

Envíame el documentocerveron/index.html

Funcionamiento de la Web 5. El navegador solicita al servidor que le transmita el documento.

6. El servidor web envía el documento.

7. El navegador muestra el documento.


Página Web

Una página web es un documento electrónico escrito en un lenguaje llamado HTML.

Las páginas Web pueden contener texto, gráficos, vídeo, animaciones, sonido y elementos interactivos.

Cada página tiene una dirección única que se denomina una URL que identifica su ubicación en el servidor.


Página Web Estática

Son aquellas cuya información no varía en un tiempo a medio o a corto plazo, también se las reconoce puesto que no interactúan con el usuario o navegante, y están compuestas principalmente de textos e imágenes.

Fueron el primer tipo de páginas que aparecieron durante el desarrollo y expansión de Internet.

Por otro lado cada vez que se necesite modificar alguna parte de la web es necesario conectarse al servidor donde está alojado y subir los documentos modificados, cosa que conlleva tiempo y esfuerzo.


Página Web Dinámica

Son aquellas que son capaces de interactuar con el usuario, dado que están conectadas con BASES DE DATOS que permiten el desarrollo de aplicaciones webs.

Desarrolladas bajo lenguajes de programación como PHP, ASP, JSP o RUBY, el manejo de dichos lenguajes requiere de ciertos conocimientos informáticos.


Páginas Web Públicas y Privadas

Las páginas privadas son aquellas que solo pueden acceder un número limitado de personas que puedan ser identificadas y reconocidas por el sistema de acceso,

Las páginas públicas son accesibles por cualquier persona que disponga de una conexión a Internet.

Hoy en día dentro de un mismo sitio web existen las 4 clases de páginas descritas.

El acceso a nuestra cuenta bancaria es una página dinámica dado a que el saldo disponible cambia instantáneamente cuando realizamos una compra

Es una página privada puesto que su acceso está restringido a las personas que puedan autentificarse mediante claves o password

Las páginas son estáticas como: direcciones de contacto o información global sobre el sitio como las políticas de uso, y a su vez estas páginas son públicas dado a que se requiere ningún tipo de autentificación para acceder a ellas

Páginas web de un banco


Sitio Web

Se compone de una o más páginas web referidas a un asunto común, como a una persona, un negocio, una organización o a un tema.

La primera página se llama la página de inicio, y hace las funciones de un índice, indicando el contenido del sitio.

Una portada o página inicial

Así que cuando entro en la página principal de un sitio web, es como si

fuera la portada de un libro, desde donde puedo acceder a las páginas

principales de sitio web navegando por el menú.

Un índice o menú

Diferentes capítulos o páginas de contenido y aplicación web

Los datos del autor o la página de contacto


Sitio Web


Las páginas Web contienen generalmente hiperenlaces a otras páginas web.

Los hiperenlaces son textos e imágenes que hacen referencia a URL’s de otras páginas web.

Hipervínculos


Al hacer click sobre diferentes partes de un gráfico vinculado, llamado un mapa de imagen, se desplazará a diferentes páginas web o a diferentes puntos dentro de la misma página.

Hipervínculos

Además de apuntar a páginas web, los hipervínculos pueden acceder a archivos multimedia, como clips de sonido o video.


Blogs

Un blog, es un sitio web que recopila cronológicamente textos o artículos de uno o varios autores, apareciendo primero el más reciente.

Habitualmente, en cada artículo, los lectores pueden escribir sus comentarios y el autor darles respuesta, de forma que es posible establecer un diálogo.

El uso o temática de cada blog es particular, los hay de tipo personal, periodístico, empresarial o corporativo, tecnológico, educativo, etc.


Estructura básica de una página web

Logo, un título o eslogan, información de contacto y el menú para navegar por las páginas.

Contenido más relevante para esa página en particular

información de contacto, un menú a las páginas más relevantes, links a otras webs y en general contenido complementario referente a la temática del sitio web.


Bloque de Navegación a la izquierda

http://xn--guiadiseo-s6a.com/


Bloque de Navegación arriba

http://www.apple.es/


Bloque de Navegación a la derecha

http://www.narfstuff.co.uk/


Estructura combinada

http://www.apple.es/


Estructura combinada


ACTIVIDADES EVALUATIVAS

Preguntas:

¿Cuál es la principal ventaja o uso común que encontramos en la web?

¿Cuáles son los elementos principales que una página web debe tener para ser atractiva y llamativa para el usuario?

¿Qué navegador web es mas eficiente al momento de navegar por la web?

¿Qué servicios de comunicación de información nos proporciona la web?

¿Cómo identificamos las diferencias entre navegar un sitio web por medio de un celular y una computadora?

¿Será necesario desarrollar sitios y aplicaciones web que sean aptos para la navegación en dispositivos móviles?

1. DIÁLOGO



Situación: Al inicio del semestre los estudiantes conformaran grupos de trabajo para diseñar e implementar un sitio web que permita realizar la publicación de noticias, eventos, actividades de una empresa, añadir una aplicación que permita mantener el contacto permanente entre usuarios (chat) y una página en la cual se pueda compartir archivos entre usuarios. El día de la presentación el grupo deberá explicar cómo se desarrolló el sitio web, explicando la metodología utilizada, el nivel de formalización de la base de datos, las herramientas utilizadas, además de mostrar las principales funciones solicitadas.

2. PROYECTO

Instrucciones para el estudiante: Diseñar e implementar un sitio web para la empresa, que permita al usuario en primer lugar autentificarse, editar su perfil, publicar una actividad, comentar publicaciones, compartir archivos y mantener comunicación mediante un chat con otros usuarios. La prueba funcional requiere que el sistema desarrollado responda a los procesos mencionados, y tener una buen diseño y administración de la base de datos.



Los criterios de evaluación se darán en dos niveles:

• la calidad de la presentación oral • la funcionalidad del sistema. La presentación oral será evaluada en términos de: • Claridad expresiva.• Conocimiento de los procesos del sistema web. El producto será evaluado en términos de: • Eficacia en los tiempos de ejecución.• Aplicación de la Metodología de desarrollo.• Navegabilidad del sitio web.• Creatividad.• Funcionalidad.

2. PROYECTO

Conceptos Fundamentales de la Web

Documents

Transcript of Conceptos Fundamentales de la Web