PDF de programación - Creación de páginas WEB

Imágen de pdf Creación de páginas WEB

Creación de páginas WEBgráfica de visualizaciones

Publicado el 16 de Noviembre del 2019
234 visualizaciones desde el 16 de Noviembre del 2019
3,0 MB
99 paginas
Creado hace 15a (25/11/2004)
Creación de páginas Web

D. José Ramón Balsas Almagro

D. Juan Ruiz de Miras

jrbalsas@ujaen.es

demiras@ujaen.es

D. Víctor Manuel Rivas Santos

vrivas@ujaen.es

Departamento de Informática

Universidad de Jaén

Creación de páginas WEB

1. Introducción

1.1 Redes de ordenadores

 Una red de ordenadores es un

sistema de comunicación que
conecta ordenadores entre sí

 Según su extensión se pueden

clasificar en tres tipos:

 Redes de área Local o LAN
 Redes de área

metropolitana o MAN

 RIUJA

 Redes de área amplia o

WAN

 RedIris

Curso de Creación de Páginas Web - Depto. de Informática

3

1.2 Rediris

Curso de Creación de Páginas Web - Depto. de Informática

4

1.3 ¿Qué es Internet?

 Internet es una Red de redes de ordenadores

interconectadas entre sí

 Los equipos que interconectan las redes se denominan

enrutadores, pasarelas (del inglés routers/gateways)

 Es una red heterogénea

 Diferentes tecnologías de transmisión de datos
 Diferentes tipos de ordenadores
 Diferentes tipos de Sistemas Operativos

 Sin embargo, todos los ordenadores utilizan el mismo

“lenguaje” para comunicarse:
 El Protocolo TCP/IP

R

Red 2

R

Red 4

R

Red 1

R

Red 3

Curso de Creación de Páginas Web - Depto. de Informática

5

1.4 Acceso a Internet

 Conexión para particulares

 RTC, RDSI
 ADSL
 Cable
 LAN conectada a Internet

 Adaptador de acceso al medio
 Modem, tarjeta ethernet, etc..

 Sistema Operativo que utilice el protocolo TCP/IP
 Software para acceso a servicios

 Navegadores
 Clientes de correo
 Etc.

Curso de Creación de Páginas Web - Depto. de Informática

6

1.5 Direcciones IP

 Todo ordenador conectado a Internet debe tener una dirección IP que

lo identifique unívocamente

 Las direcciones IP son asignadas en bloques por organismos

internacionales a diferentes organizaciones y empresas

 Cada organización distribuye las IP entre los ordenadores que posee
 Estructura

 Formato de una dirección IP: 150.214.178.11
 Las direcciones se organizan en grupos que se asignan a cada red

 Una máscara de red permite indicar cuales son las direcciones que

conectada a Internet

pertenecen a la misma red

 Tipos de máscaras:

 Clase A: 255.0.0.0, aprox 16777216
 Clase B: 255.255.0.0, aprox 65535 direcciones IP
 Clase C: 255.255.255.0, aprox 256 direcciones IP

 Ejemplo:

 Red: 150.214.178.0
 Máscara: 255.255.255.0
 Direcciones de red: 150.214.178.1-150.214.178.254

Curso de Creación de Páginas Web - Depto. de Informática

7

1.6 Servicios en Internet

 Internet presenta una organización cliente/servidor

 Un Servidor es un ordenador que ofrece algún servicio a otros

equipos de la red

 Ejemplos de servicios

 WWW
 Correo
 IRC

 El Servidor y el Cliente utilizan un protocolo para transferir la

información a través de Internet

 Un Cliente es un ordenador que se conecta a un servidor para

acceder a un servicio

 El Cliente debe disponer del software que utilice el protocolo

adecuado para acceder a un servicio concreto

 Ejemplos de software cliente

 Internet Explorer
 Netscape Navigator
 Outlook Express
 Messenger

Curso de Creación de Páginas Web - Depto. de Informática

8

1.7 El servicio de nombres de
dominio

 Para acceder a un ordenador debemos conocer su dirección IP
 El servicio de nombres de dominio (DNS) permite asignar un nombre a

cada dirección IP

 Tiene una estructura jerárquica

 Dominios de primer nivel: com, net, org, es, fr, de
 Dominios de segundo nivel: ujaen.es, ugr.es, ibm.com
 Dominios de tercer o mayor nivel
 A cada IP se le asigna un nombre dentro de un dominio concreto

 www.ujaen.es  150.214.170.105
 batman.ujaen.es  150.214.178.11

 Los nombres de dominio son gestionados por organismos nacionales
 Cada organización tiene su propio servidor/es de nombres de dominio

donde asigna una IP a cada una de sus máquinas

 Un ordenador conectado a Internet deberá conocer la dirección IP de un

servidor de nombres para que le resuelva los nombres de dominio

Curso de Creación de Páginas Web - Depto. de Informática

9

1.8 La World Wide Web

Curso de Creación de Páginas Web - Depto. de Informática

10

1.8 La World Wide Web

 Más conocida por WWW o Web
 Servicio basado en la transferencia de documentos hipermedia a través de Internet:

 Páginas de Hipertexto en formato HTML



Imágenes

 Sonido
 Aplicaciones
 etc.

 Utiliza el protocolo HTTP (Hypertext Transfer Protocol)


Los contenidos son referenciados por direcciones URL (Universal Resource Locator)
 Ejemplo: http://www.ujaen.es/sci/redes/index.html

 Estructura de un URL

 Protocolo:
 Nombre de la máquina:
 Recurso

http://
www.ujaen.es
/sci/redes/index.html

 Un navegador es un programa que permite acceder a recursos en servidores Web,

descargarse documentos utilizando protocolo HTTP y mostrarlos adecuadamente
 Habitualmente, los navegadores también soportan otros protocolos de Internet

 FTP, Correo, News, etc.

Curso de Creación de Páginas Web - Depto. de Informática

11

1.9 Arquitectura del servicio WEB

 http://www.ujaen.es/sci/redes/index.html

4

Solicitud http

1

Cliente

(navegador)

/sci/redes/index.html

6

Respuesta http

Servidor

WEB

Nombre servidor
wwwdi.ujaen.es

2

Servidor
de nombres

(DNS)

3

Contenido de index.html
Dirección IP
150.214.178.11

5

Index.html

Curso de Creación de Páginas Web - Depto. de Informática

12

1.10 El protocolo FTP

 File Transfer Protocol
 Es un protocolo para el envío/descarga de ficheros a

través de Internet

 A grandes rasgos, el protocolo FTP es más adecuado

que el protocolo HTTP en los siguientes casos:
 Transferencia de archivos de tamaño elevado
 Envío de archivos al servidor (http es utilizado
generalmente para descargas de información)

 Suele ser el mecanismo utilizado para colocar

archivos en un servidor Web

Curso de Creación de Páginas Web - Depto. de Informática

13

1.10 El protocolo FTP

 Requisitos para acceder a un servidor FTP

 Una vez conectados podremos crear directorios y copiar archivos

arrastrando hacia/desde la ventana de conexión

Curso de Creación de Páginas Web - Depto. de Informática

14

 Cliente FTP
 Nombre del servidor
 Cuenta de usuario y contraseña
 Directorio de trabajo

 Clientes FTP

 Internet Explorer
 WFTP

 Acceso desde Internet Explorer
 ftp://<usuario>@<servidor_ftp>
 El servidor nos solicitará la contraseña
 Ejemplo:

ftp://paco@www4.ujaen.es/
 ftp://paco@www4.ujaen.es/

1.11 Servicio de páginas Web
personales de la UJA

 La Universidad de Jaén proporciona alojamiento Web en el

servidor

www4.ujaen.es
www4.ujaen.es

 El contenido del Web debe ser enviado por ftp
 La cuenta de usuario y la contraseña coincide con la cuenta

de correo electrónico

 El directorio de trabajo es public_html
public_html
 El sitio web es accesible mediante la URL

http://www4.ujaen.es/~usuario
http://www4.ujaen.es/~usuario

 El usuario dispone de 10MB de espacio de almacenamiento
 Más información

http://www.ujaen.es/sci/redes/web/hospedaje/hospedajepp.html

Curso de Creación de Páginas Web - Depto. de Informática

15

Creación de Páginas Web

2. HTML

El lenguaje HTML

 Una página Web es un fichero de texto

 Sólo es necesario un editor de texto para generarla
 Posteriormente el Navegador de páginas web las

interpreta

 Nombres de ficheros:

 Recomendaciones: minúsculas; usar solo letras y números;

sin espacios en blanco (sustituir por guión bajo); no usar eñes ni
caracteres acentuados.

 Extension .html

 Lenguaje de marcas hipertexto

 Existen marcas (o etiquetas o tags) que definen

estructura y tipografía

Curso de Creación de Páginas Web - Depto. de Informática

17

2.1 Estructura Básica

 La forma más básica de una página es:
<HTML>
<HEAD>
<TITLE>El título de mi página</TITLE>
</HEAD>
<BODY bgcolor="lightblue">

El cuerpo de mi página, lleno de texto, imágenes y etiquetas

</BODY>
</HTML>
 Cada etiqueta suele ir “cerrada” por su “anti-

etiqueta”

 Algunas etiquetas pueden llevar atributos

que modifiquen su comportamiento

Curso de Creación de Páginas Web - Depto. de Informática

18

2.1.1 Formato de párrafo:
<P>...</P>

<HTML>
<HEAD>
<TITLE>Ejemplo de párrafo</TITLE>
</HEAD>
<BODY>
<P>
Este es el primer párrafo de nuestra página... ¿qué alineación tendrá por

defecto?

</P>
<P align=”right”>

Este es un párrafo alineado a la derecha. Puede servir para poner la

fecha.

</P>
</BODY>
</HTML>

Curso de Creación de Páginas Web - Depto. de Informática

19

2.1.2 Formato de cabeceras:
H1, H2, H3, H4, H5, H6

<HTML>
<HEAD>
<TITLE>Ejemplo de Cabeceras</TITLE>
</HEAD>
<BODY>
<H1>Ejemplo de Cabeceras</H1>
<H2>Esta es la cabecera H2</H2>
<H3>Esta es una cabecera H3</H3>
<H2>Esto vuelve a ser una cabecera H2</H2>
<H4>Finalmente, esto es una cabecera H4</H4>
</BODY>
</HTML>

Curso de Creación de Páginas Web - Depto. de Informática

20

2.1.3 Formato de texto: <B>,
<EM>, <U>, <SUB>
<P>
Adicionalmente, <U>se puede

subrayar un texto</U> e
incluso <B><U>mezclar varios
formatos</U></B>, o ponerlo
en <SUB>subíndice</SUB>
o.<SUP>superíndice</SUP>

</P>
</BODY>
</HTML>

<HTML>
<HEAD>
<TITLE>Ejemplo de Formato de

Texto</TITLE>

</HEAD>
<BODY>
<P>
<B>Esta frase</B> comienza
con las primeras palabras en
<B>negrita</B>. Continúa con
<I>algunas palabras en
cursiva</I>, que en la mayor
parte de navegadores también
<EM>se puede poner
así</EM>.

</P>

Curso de Creación de Páginas Web - Depto. de Informática

21

2.1.4 Formato de texto:
<FONT>...</FONT>

<HTML>
<HEAD>
<TITLE>Ejemplo de Formato de

Texto con FONT</TITLE>

<P>

</HEAD>
<BODY>
<P>
<FONT SIZE=”+2”

COLOR=”blue”>Ejemplo de
formato de texto usando
FONT</FONT> (Nótese que NO
produce un salto de línea).

</P>

<FONT SIZE=”-2”>Se pueden

mezclar <FONT
COLOR=”#ff0000”>varios
font</FONT> uno dentro
de otro.</FONT>.

</P>
</BODY>
</HTML>

Curso de Creación de Páginas Web - Depto. de Informática
  • Links de descarga
http://lwp-l.com/pdf16922

Comentarios de: Creación de páginas WEB (0)


No hay comentarios
 

Comentar...

Nombre
Correo (no se visualiza en la web)
Valoración
Comentarios
Es necesario revisar y aceptar las políticas de privacidad