Prof. Garca Sebastin A.
La world wide web - www
La Web es una red de recursos de informacin. La Web se basa en tres pilares: El concepto de URL/URI El protocolo HTTP El lenguaje HTML
Tipos de informacin (Dinmica)
Una URI -Uniform Resource Identifier- es un mecanismo por el cual se identifica todo recurso accesible en la web. Una URL -Uniform Resource Locator- permite ubicar un recurso a travs de su ubicacin. Tpicamente una URL se compone de: El esquema o protocolo utilizado para acceder al recurso El nombre de dominio de la mquina que almacena el recurso El nombre del recurso mismo dado como un camino dentro de la mquina (recurso)
protocolo://dominio/recurso
URL encoding
Las URLs se transmiten en ASCII. Algunos caracteres deben convertirse. Ejemplos: /Clase 1/EjemplosClase1/Ejemplo con enlaces.html ../Clase%201/EjemplosClase1/Ejemplo%20con%20enlaces.html
Protocolo HTTP
Una transaccin HTTP consta de 4 pasos: inicio conexin - solicitud - respuesta - cierre conexin Protocolo sin estado Clientes web: Firefox, IE, Chrome, Opera, .... Servidores web: Apache, IIS, Nginx, etc, ..
Protocolo HTTP
Algunos tipos de mensajes Solicitudes GET: retorna la informacin que est identificada por la URI-solicitada. HEAD: retorna la informacin del header del servidor. POST: en general se utiliza para la entrega o envo de formularios que son completados en forma interactiva por un usuario. Esta es la nica solicitud que enva un cuerpo en el mensaje. Respuestas El servidor retorna un cdigo que indica el estado de la solicitud (por ejemplo:200 y el recurso)
Protocolo HTTP
Diferencias entre GET y POST
Mensaje HTTP con GET: GET /index.php?nombre=pepe&seccion=1 HTTP/1.0 Host: www.servidor.com User-Agent: Mozilla/4.5 [en] Accept: image/gif, image/jpeg, text/html Accept-language: en Accept-Charset: iso-8 Mensaje HTTP con POST:
POST /index.php HTTP/1.0 Host: www.servidor.com User-Agent: Mozilla/4.5 [en] Accept: image/gif, image/jpeg, text/html Accept-language: en Accept-Charset: iso-8859-1 nombre=pepe&seccion=1
Preguntas ?
La WEB
Arquitectura
Definicin de URL/URI
Protocolo HTTP
Lenguaje HTML
El lenguaje HTTP
HTML - HyperText Markup Language- especifica el formato de las pginas web, separando el contenido de las pginas de su formato de presentacin. Fue creado en los laboratorios CERN por Tim Berners-Lee. Define un conjunto de smbolos (etiquetas o tags) que especifican la estructura lgica de un documento y de todos sus componentes. Es independiente de la plataforma. Su cdigo es interpretado por los clientes web.
Formato general
Indica el tipo de documento HTML o XHTML para validar la sintaxis
Inicio del documento
Encabezado
Cuerpo
Fin del documento
HTML Sintaxis General
La clusula DOCTYPE: Primera lnea del documento Indica la forma en que se validar el documento Ejemplos:
Elementos y etiquetas
Una etiqueta puede tener asociada una etiqueta de cierre: ... Hay elementos vacos: Pueden tener uno o ms atributos:
El encabezado
Delimitado por y Algunas componentes... : Corresponde al ttulo de la pgina. : Se usa para incluir las especificaciones de estilo para los elementos de la pgina. : Indica una relacin entre el documento y algn otro objeto de la WEB. : Meta-informacin sobre el documento
El encabezado
: Este elemento es usado para identificar meta-informacin sobre el documento, como por ejemplo el autor o palabras claves que podrn ser luego utilizadas por buscadores para mejorar la calidad de los resultados en las bsquedas. Ejemplo:
El encabezado
Campos meta (cont.) Robots de bsquedas... O http-equiv permite predeterminar el dilogo entre cliente y servidor
El encabezado
El documento tiene una estructura y una forma de visualizacin Estructura: usando las etiquetas HTML ms apropiadas. Visualizacin: usando hojas de estilo http://www.csszengarden.com/tr/espanol
El cuerpo
Delimitado por y Encabezados: 6 encabezados definidos con un estilo predefinido: ..,.., ...., .. Prrafos: Se delimitan con ... Comentarios: Imgenes:
El cuerpo
Hiperenlaces Forma General: texto Rutas absolutas y relativas .. .. ..
Entidades HTLM
Se las utiliza para representar smbolos especiales que nos son representados de la misma manera en todos los set de caracteres: smbolos matemticos, caracteres griegos, letras acentuadas, etc. Forma general: &nombreEntidad; Ejemplos: & (&) - () - < () -" () ... () - () -
Otros elementos bsicos
Listas: ... - ... Cada tem: ..
Otros elementos bsicos
Se utiliza notacin RGB. Forma general: #RRGGBB
Otros elementos bsicos Tablas: ...
Enc1 Celda 1
Formularios
: Permite definir y agrupar una serie de campos que forman el formulario. Algunos atributos... action: Especifica la URI donde ser enviado el formulario. method: Especifica la forma en que se transferirn los datos: get y post
..
Formularios
Si en el formulario se definen campos nombre y seccion, por ejemplo
Mensaje HTTP con GET: GET /index.php?nombre=pepe&seccion=1 HTTP/1.0 Host: www.servidor.com User-Agent: Mozilla/4.5 [en] Accept: image/gif, image/jpeg, text/html Accept-language: en Accept-Charset: iso-8
Mensaje HTTP con POST: POST /index.php HTTP/1.0 Host: www.servidor.com User-Agent: Mozilla/4.5 [en] Accept: image/gif, image/jpeg, text/html Accept-language: en Accept-Charset: iso-8859-1 nombre=pepe&seccion=1
GET: Debera usarse cuando el formulario no tiene efectos secundarios, por ejemplo en una bsqueda.
POST: Debera usarse en formularios que modifican una base de datos o la suscripcin a un servicio.
Formularios
Elementos input: Presenta un atributo que indica el tipo de elemento de entrada: Campos de texto: type=text: type=password: type=hidden: Casilla de seleccin: type =checkbox type =radio Botones: type =reset type =submit type =button
Formularios
Elemento Elementos y
Formularios
Elemento Algunas opciones...
rows: Nmero de lneas de texto del rea. cols: Nmero de columnas de texto del rea.
Elementos y Algunas opciones de select ...
multiple: Permite seleccionar ms de un tem del men. size: Especifica el nmero de tems visibles en la lista de opciones.
Algunas opciones de option ... value: Valor de la opcin a ser enviado al servidor. selected: Especifica qu opcin es seleccionada por defecto. Si no se especifica se selecciona la primer opcin
Top Related