diseño de un sitio web

7/30/2019 Diseo de un sitio Web

1/23

Notas de la asignatura Desarrollo de Aplicaciones Web


2/23

Contenido

Requerimientos para publicar un sitio Web

Conceptos de dominio, IP y URL

Registro de Dominios

Registrador de Dominios

Hosting

Tipos de Hosting

Infraestructura Web

Tipos de Aplicaciones Web

Procesamiento de pginas Web estticas

Procesamiento de pginas Web dinmicas

HTML, XHTML, XML


3/23

Requerimientos para publicar un sitioWeb

1. Registrar el

dominio del sitio

Web

2. Adquirir y

configurar la

infraestructuraWeb para alojar

el sitio Web

3. Disear el

Layout del sitio,as como el

Mapa del sitio.

4. Programar losarchivos HTML y

disear elwebart. As

como las bases

de datos si se

requiere

5. Publicar los

documentos

HTML y verificarsu

funcionamiento


4/23

Conceptos de dominio, IP y URL

Una direccin IP es una secuencia de nmeros que identifica a un nodo dentro de uma

red que utiliza el protocolo IP (Internet Protocol)

Los nodos se conectan entre s en Internet mediante sus respectivas direcciones IP. Sin

embargo, a los seres humanos nos es ms cmodo utilizar otra notacin ms fcil de

recordar, como los nombres de dominio, la traduccin entre unos y otros se resuelve

mediante los servidores de nombres de dominio o DNS.

Por lo tanto, un nombre de dominio es nombre que identifica un nodo conectado aInternet, sin estos, los usuarios tendran que acceder a cada servicio web utilizando ladireccin IP del nodo, por ejemplo en lugar de www.yahoo.com, tendra que escribir:209.191.93.52

La URL es el Localizador Uniforme de Recursos, y es la identificacin de cada uno de losdocumentos de un sitio web, no confundir con dominio. Por ejemplo: dominio es:http://ecommerceutt.webatu.com y una URL es:http;//ecommerceutt.webatu.com/sitios.html


5/23

Registro de dominios

Elegir un dominio.

Verificar la disponibilidaddel nombre de dominio

deseado en algnregistrador.

Ingresar los datospersonales.

Elegir la cantidad de tiempoque el dominio

permanecer registrado.

Pagar el dominio,normalmente con tarjetade crdito (o tambin por

transferencia bancaria)

Una vez comprado, eldueo del dominio debe

configurarlo con la URL a lacual redireccionar, IP del

servidor al que encontrarmediante la DNS, servidor

DNS usada por este.

El dueo del dominio debeesperar un tiempo para queel dominio sea reconocidoen todos los servidores de

Internet.

El registrador contacta conInterNIC y realiza el proceso

de forma transparente parael registrante.

Se avisa al registrante queel dominio fue registrado.

El nuevo dominio funciona,y resuelve a la IP apropiada

en el servidor DNS usado,poco a poco.

La pgina ya es accesiblemediante un nombre de

dominio desde cualquiercomputadora.


6/23

Registrador de Dominios Un registrador de dominios es una empresa que vende dominios de

Internet. Permiten que un individuo o empresa pueda pagar una cuotaanual a cambio de tener un nombre de dominio, como .com, .es, .org, .net ymuchos otros.

Una empresa de registro de dominios ha de estar acreditada por ICANNpara poder venderlos o formar parte de una cadena de distribucin. ICANNes el organismo que controla los 13 servidores raz (root servers), y portanto tiene el control de factode todo el sistema de nombres de dominio.

Cada registrador puede poner unas normas distintas respecto a qudominios permite registrar. Por ejemplo, algunos impiden usar palabras quese refieran a poltica, religin, obscenidades, o marcas que puedan violar lapropiedad intelectual.

Adems, pueden tener otras normas o restricciones locales. Por ejemplo,

muchos registradores permiten usar ms caracteres que los que ofrece elASCII original. Como curiosidad, y a fecha de febrero de 2006, la ee no sepermite en los .es (esto cambi a partir del ao 2007, ahora se permiten losdominis multilinges), pero s en los .cl, .com, y otros; en general, en todoslos que permiten el uso de Nombres de dominio internacionalizados(IDN).

En Mxico, los Registradores de Dominio se encuentran listados enhttp://www.registry.mx/jsf/rar_list/search/search.jsf


7/23

Hosting

El web hosting o alojamiento web es el servicio que provee a los usuarios de Internet unsistema para poder almacenar informacin, imgenes, vdeo, o cualquier contenidoaccesible va web.

Es una analoga de "hospedaje o alojamiento en hoteles o habitaciones" donde uno ocupa

un lugar especfico, en este caso la analoga alojamiento web o alojamiento de pginasweb, se refiere al lugar que ocupa una pgina web, sitio web, sistema, correo electrnico,

archivos etc. en internet o ms especficamente en un servidor que por lo general hospeda

varias aplicaciones o pginas web.

Las compaas que proporcionan espacio de un servidor a sus clientes se suelendenominar con el trmino en ingls web host.


8/23

Tipos de hosting

Generalmente agregan publicidad en los sitios y tienen unespacio y trfico limitadoGratuito

En este servicio se alojan clientes de varios sitios en un mismoservidor, es econmico debido a la reduccin de costos al

compartir el servidor con varios usuarios.

La desventaja es la disminucin del desempeo del servidor.

Compartido

Este servicio est diseado para personas que venden el

servicio de hospedaje a otras personas.

Cuenta con gran cantidad de espacio y dominios disponibles

para cada cuenta.

Reseller

Un servidor dedicado es una computadora que se utiliza

especficamente para alojamiento web.Su desventaja es el costo del servicio.Dedicado Est basado en las tecnologas ms innovadoras que permiten a un gran

nmero de mquinas actuar como un sistema conectadas a un grupo demedios de almacenamiento .

La seguridad de un sitio web alojado en la nube est garantizada por

numerosos servidores en lugar de slo uno.

Cloud Hosting


9/23

Infraestructura Web

La Infraestructura Web est conformada por elHardware y Software para alojar el sitio Web.Existen diversos paradigmas de desarrollo queutilizan distintas plataformas de desarrollo. La combinacin ms importante es:

Otra combinacin es:


10/23

Tipos de aplicaciones Web

Una aplicacin Web es

un conjunto de pginasWeb estticas y

dinmicas.

Una pgina Webesttica es aqulla queno cambia cuando un

usuario la solicita: el

servidor Web enva lapgina al navegador

Web solicitante sin

modificarla.

Por el contrario, el

servidor modifica laspginas Web dinmicas

antes de enviarlas al

navegador solicitante.

La naturaleza cambiante

de este tipo de pgina

es la que le da elnombre de dinmica.


11/23

Tipos de aplicaciones Web

Web esttica:

Todos los usuarios recibenexactamente el mismo contenidocuando acceden al sitio Web.

Web Dinmica:

Cada usuario recibe contenidopersonalizado cuando accede alsitio Web.


12/23

Procesamiento de pginas Web estticas

Un sitio Web esttico consta de unconjunto de pginas y de archivos HTML

relacionados alojados en un equipo que

ejecuta un servidor Web.

Un servidor Web es un software que

suministra pginas Web en respuesta a laspeticiones de los navegadores Web. Lapeticin de una pgina se genera cuando el

usuario hace clic en un vnculo de unapgina Web, elige un marcador en unnavegador o introduce una URL en el

cuadro de texto Direccin del navegador.

El contenido final de una pgina Webesttica lo determina el diseador de la

pgina y no cambia cuando se solicita la

pgina.

El navegador Web solicita la pgina esttica.

El servidor localiza la pgina.

El servidor Web enva la pgina alnavegador solicitante.


13/23

Procesamiento de pginas Webdinmicas

Cuando un servidor Web recibe una peticin para mostrar una

pgina Web esttica, el servidor la enva directamente al

navegador que la solicita. Cuando el servidor Web recibe unapeticin para mostrar una pgina dinmica, sin embargo,

reacciona de distinta forma: transfiere la pgina a un software

especial encargado de finalizar la pgina. Este softwareespecial se denomina servidor de aplicaciones.

El servidor de aplicaciones lee el cdigo de la pgina, finaliza

la pgina en funcin de las instrucciones del cdigo y elimina

el cdigo de la pgina. El resultado es una pgina esttica queel servidor de aplicaciones devuelve al servidor Web, que a su

vez la enva al navegador solicitante. Lo nico que elnavegador recibe cuando llega la pgina es cdigo HTML puro


14/23

Procesamiento de pginas Web

dinmicas

1. El navegador Web solicitala pgina dinmica.

2. El servidor Web localiza lapgina y la enva al servidorde aplicaciones.

3. El servidor de aplicacionesbusca instrucciones en la

pgina y la termina.

4. El servidor de aplicaciones

pasa la pgina terminada alservidor Web.

5. El servidor Web enva lapgina finalizada al navegador

solicitante.


15/23

Creacin de pginas Web dinmicas

La creacin de una pgina dinmica implica, en primer lugar,escribir el cdigo HTML

Y aadir los scripts o etiquetas del lado del servidor al cdigoHTML para crear la pgina dinmica.

La utilizacin de un lenguaje basado en scripts se decide enfuncin de la tecnologa de servidor disponible en el servidor.

Un script o archivo de rdenes es un programa usualmentesimple que por lo regular se almacena en un archivo de texto.


16/23

Creacin de pginas Web dinmicas

La utilizacin de un lenguaje basado en etiquetas oen scripts se decide en funcin de la tecnologa deservidor disponible en el servidor.:

Tecnologa de servidor Lenguaje

ColdFusion ColdFusion Markup Language

(CFML)

Active Server Pages (ASP)

JSP

Java Server Pages (Sun)

VBScript

JavaScript

JavaScript, Java

PHP- MySQL PHP


17/23

Ejemplo de aplicacin de una pgina Web dinmica:

acceso a Base de datos.

1. El navegadorWeb solicita la

pgina dinmica.

2. El servidor Weblocaliza la pgina y

la enva al servidorde aplicaciones.

3. El servidor deaplicaciones buscainstrucciones en la

pgina.

4. El servidor deaplicaciones enva la

consulta alcontrolador de la

base de datos.

5. El controladorejecuta la consulta

en la base de datos.

6. El juego deregistros se

devuelve alcontrolador.

7. El controladorpasa el juego de

registros al servidorde aplicaciones.

8. El servidor deaplicaciones inserta

los datos en una

pgina y luego pasa lapgina al servidor

Web.

9. El servidor Webenva la pgina

finalizada alnavegadorsolicitante.


18/23

HTML y XHTML

HTML: HyperText Markup Language(Lenguaje de Marcado de Hipertexto)

Es usado para describir la estructura y elcontenido de un texto, as como paracomplementar el texto con objetos talescomo imgenes. HTML.

Se escribe en forma de etiquetas,

rodeadas por . HTML tambin puede describir, hasta un

cierto punto, la apariencia de un documento,y puede incluir un script(por ejemploJavaScript), el cual puede afectar elcomportamiento de navegadores web y otrosprocesadores de HTML.

XHTML: eXtensible HyperText MarkupLanguage (Lenguaje de Marcado deHipertexto Extensible).

Es una versin ms estricta y limpia de HTML, que nace precisamente con el objetivo deremplazar a HTML ante su limitacin de usocon las cada vez ms abundantes

herramientas basadas en XML . XHTML extiende HTML 4.0 combinando la

sintaxis de HTML, diseado para mostrardatos, con la de XML, diseado para describirlos datos.

XHTML, al estar orientado al uso de unetiquetado correcto, exige una serie derequisitos bsicos a cumplir en lo que acdigo se refiere. Entre estos requisitos

bsicos se puede mencionar unaestructuracin coherente dentro deldocumento donde se incluiran elementoscorrectamente anidados, etiquetas enminsculas, elementos cerradoscorrectamente, atributos de valoresentrecomillados, etc.


19/23

Diferencias entre HTML y XHTML Los documentos deben estar bien formados:

Los nombres de atributos y elementos deben ir en minsculas:

Los elementos que no estn vacios necesitan etiquetas de cierre:

Los valores de las etiquetas deben ir siempre entre comillas: Todos losvalores de los atributos deben ir entre comillas, incluso aquellos que seannumricos.


20/23

XML

XML: eXtensibleMarkupLanguage('lenguaje de marcado extensible'). Es un metalenguaje extensible de etiquetas desarrollado por el World Wide Web

Consortium (W3C), permite definir la gramtica de lenguajes especficos.

XML no es realmente un lenguaje en particular, sino una manera de definir lenguajespara diferentes necesidades.Algunos de estos lenguajes que usan XML para sudefinicin son XHTML, SVG, MathML.

XML no ha nacido slo para su aplicacin en Internet, sino que se propone como unestndar para el intercambio de informacin estructurada entre diferentesplataformas. Se puede usar en bases de datos, editores de texto, hojas de clculo ycasi cualquier cosa imaginable.

XML es una tecnologa sencilla que tiene a su alrededor otras que la complementan yla hacen mucho ms grande y con unas posibilidades mucho mayores. Tiene un

papel muy importante en la actualidad ya que permite la compatibilidad entresistemas para compartir la informacin de una manera segura, fiable y fcil.


21/23

CSS

(Cascading Style Sheets)Hojas de estilo en cascada.

Es un lenguaje usado para definir la presentacin deun documento estructurado escrito en HTML o XML

(y por extensin en XH La informacin de estilo puede ser adjuntada como

un documento separado o en el mismo documentoHTML. En este ltimo caso podran definirse estilos

generales en la cabecera del documento o en cadaetiqueta particular mediante el atributo "style".TML)


22/23

Tipos de Hojas de Estilo CSS proporciona tres caminos diferentes para aplicar las reglas de estilo a una pgina Web:

Una hoja de estilo externa, es una hoja de estilo que est almacenada en un archivo diferente alarchivo donde se almacena el cdigo HTML de la pgina Web. Esta es la manera de programar mspotente, porque separa completamente las reglas de formateo para la pgina HTML de la estructurabsica de la pgina:

Una hoja de estilo interna, que es una hoja de estilo que est incrustada dentro de un documentoHTML. (Va a la derecha dentro del elemento .) De esta manera se obtiene el beneficio deseparar la informacin del estilo del cdigo HTML propiamente dicho. Se puede optar por copiar lahoja de estilo incrustada de una pgina a otra (esta posibilidad es difcil de ejecutar si se desea paraguardar las copias sincronizadas). En general, la nica vez que se usa una hoja de estilo interna, escuando se quiere proporcionar alguna caracterstica a una pgina Web en un simple fichero, porejemplo, si se est enviando algo a la pgina Web.

Un estilo en lnea (inline) es un mtodo para insertar el lenguaje de estilo de pgina directamentedentro de una etiqueta HTML. Esta manera de proceder no es totalmente adecuada. El incrustar ladescripcin del formateo dentro del documento de la pgina Web, a nivel de cdigo, se convierte enuna manera larga, tediosa y poco elegante de resolver el problema de la programacin de la pgina.Este modo de trabajo se podra usar de manera ocasional si se pretende aplicar un formateo conprisa, al vuelo. No es todo lo claro o estructurado que debera ser, pero funciona. ste es el mtodorecomendado para maquetar correos electrnicos en HTML.


23/23

Ms sobre CSS

http://en.wikibooks.org/wiki/Cascading_Style_Sheets

http://www.csszengarden.com/
http://en.wikibooks.org/wiki/Cascading_Style_Sheetshttp://www.csszengarden.com/http://www.csszengarden.com/http://en.wikibooks.org/wiki/Cascading_Style_Sheetshttp://en.wikibooks.org/wiki/Cascading_Style_Sheets

diseño de un sitio web

Documents