Monografias.com > Sin categoría
Descargar Imprimir Comentar Ver trabajos relacionados

Programación web interactiva (página 2)




Enviado por Pablo Turmero



Partes: 1, 2

Monografias.com

Historia de HTML (cont.)
Tim Berners-Lee: Consorcio de la Web Mundial
Hojas de estilo en cascada CSS
Posibilidad de añadir abstracciones arbitrarias a HTML
Nueva subserie de SGML: Lenguaje de Marcado extendido XML
Principales ventajas de SGML
Sencillez de la Web
XHTML: HTML definido en términos de XML

Monografias.com

Conceptos básicos
HTTP
Protocolo simple de transferencia de documentos e információn del Web
Se realiza la conexión
El cliente solicita un documento
Nombre
Directorio
El servidor localiza el documento y lo envía al cliente
Se cierra la comunicación

Monografias.com

Conceptos básicos
HTTP

Monografias.com

Conceptos básicos
HTML
Lenguaje de descripción de documento hipertexto
Permite la definición de ligas que conducen a otros documentos
Locales
Remotos
Permite la inclusión de elementos de formato y multimedia

Monografias.com

Conceptos básicos
Localizador Universal de Recursos URL
Los documentos en el Web son recursos
Páginas
Imágenes
Sonidos
Pueden estar en diferentes:
Directorios
Computadoras
Redes locales
Dominios
Países
El URL establece una referencia completa

Monografias.com

Conceptos básicos
URL
http://www.utm.mx/z/home.html
protocolo
servidor
dominio
directorio
archivo
extensión

Monografias.com

Conceptos básicos
Formas de URL, basados en HTTP
http://www.utm.mx/z/index.html
http://www/z/home.html
http://www.utm.mx/z
http//www.utm.mx/~zarza/home.html
/z/home.html
pato.html
aves/pato.html
aves

Monografias.com

Conceptos básicos
Otras formas de URL
ftp://ftp.utm.mx
mailto:zarza@mixteco.utm.mx
news:comp.sys.mac
gopher://gopher.utm.mx

Monografias.com

Conceptos básicos
Servidor de Web
Programa que corre en una computadora conectada en la red que soporta el protocolo HTTP para entregar páginas a los clientes
Prácticamente cualquier computadora que se pueda conectar a la red puede contener un servidor

Monografias.com

Conceptos básicos
Página
Archivo escrito en HTML para presentar información
Puede contener ligas a otras páginas, o en general, a cualquier URL
Puede ser ubicado en un servido, y tener un URL asociado para ser referenciado desde cualquier parte de la Internet

Monografias.com

Conceptos básicos
Hipertexto
Sistema contenedor de documentos de texto que incluyen referencias que conducen a otros textos relacionados con el texto indicado en la referencia
Hipermedia=hipertexto+multimedia
Sistema hipertexto con soporte a diversos medios, como imágenes, video, animaciones y sonidos

Monografias.com

HTML

Monografias.com

HTML: páginas básicas
Marcas
Delimitadoras
< nombre_marca>contenido< /nombre_marca>
Puntuales
< nombre_marca>
Puntuales tipo XHTML
< nombre_marca/>
Con argumentos
< nombre_marca dato="valor">
< nombre_marca dato="valor">
contenido
< /nombre_marca">

Monografias.com

HTML: páginas básicas
Páginas bien formadas
No se traslapan
< b>< em>texto< /b>con formato< /em>
Las marcas están completas
< nombre_marca>contenido< /nombre_marca>
Hay una marca global
< html>todo el contenido< /html>
Todo contenido pertenece a alguna marca que lo define
< p>Texto< /p>

Monografias.com

HTML: páginas básicas
Versión, marca global, encabezado y cuerpo
< !DOCTYPE HTML PUBLIC
"-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
< html>
< head>contenido del encabezado< /head>
< body>contenido del cuerpo< /body>
< /html>
Encabezado
< title>nombre_ventana< /title>

Monografias.com

HTML: páginas básicas
Párrafos y jerarquía de títulos
< h1>Título principal< /h1>
< p>Texto introductorio< /p>
< h2>Primer tema< /h2>
< p>Texto sobre el primer tema< /p>
< h2>Segundo tema< /h2>
< p>Texto sobre el segundo tema< /p>
Titulo principal
Texto introductorio
Primer tema
Texto sobre el primer tema
Segundo tema
Texto sobre el segundo tema

Monografias.com

HTML: páginas básicas
Separadores y formato básico
Separador
< hr>
Salto de línea
< br>
Negritas
< b>< /b>
Cursivo
< em>< /em>
Centrado
< center>< /center>

Líneasiguiente linea

Negritas
Cursivo
Centrado

Monografias.com

HTML: páginas básicas
¡Es preferible usar CSS!
Colores y fondo
< bodybackground="url de imagen"bgcolor="color"text="color"link="color"vlink="color"alink="color">

Monografias.com

HTML: páginas básicas
Código de color
Por nombre
black
white
Blue
Por valor (hexadecimal)
#rrggbb
Cada valor va desde 00 hasta ff

Monografias.com

HTML: páginas básicas
Listas
Numeradas
< ol>< li>primer elemento< /li>< li>segundo elemento< /li>< /ol>
No numeradas
< ul>< li>primer elemento< /li>< li>segundo elemento< /li>< /ul>

1. primer elemento
2. segundo elemento

primer elemento
segundo elemento

Monografias.com

HTML: páginas ligadas
Mismo documento
< a name="pato">< /a>
< a href="#pato">mensaje liga< /a>
Mismo servidor
< a href="otro.html">mensaje liga< /a>
< a href="directorio/otro.html">mensaje liga< /a>
Diferente servidor
< a href="http://www.utm.mx/aves/pato.html">
< a href="http://www.utm.mx/aves/pato.html#cuac">

Monografias.com

HTML: páginas con diferentes medios
Imágenes: gif, jpg y png (y svg)
< img src="url de imagen"
alt="texto alterno">
Sonidos: wav, ra y mp3
< a href="sonido.wav">
Video: avi, mov y qt
< a href="video1.avi">

Monografias.com

HTML: botones
< a href="url">< img src="foto.jpg">< /a>

Monografias.com

HTML: mapas (¿obsoleto?)
< img src="url de imagen"
usemap="#mapa" border="0">
< map name="mapa">
< area
shape="rect"
coords="10,10,20,20"
href="url_destino"
alt="texto alterno">
< /map>

Monografias.com

HTML: páginas con diferentes medios
Sonidos en la misma página (¿obsoleto?)
Explorer:
< bgsoundsrc="cancion.wav"loop="true">
Firefox:
< embedsrc="cancion.wav"width=146height=55autostart="true"loop="true"hidden="true">

Monografias.com

HTML: tablas
Tablas: permiten la definición de estructuras rectangulares
< table border="1">
< tr>
< td>uno< /td>< td>dos< /td>
< /tr>
< tr>
< td>tres< /td>< td>cuatro< /td>
< /tr>
< /table>

Monografias.com

HTML: tablas, colspan
< table border="1">
< tr>
< td colspan="2">uno< /td>
< /tr>
< tr>
< td>tres< /td>< td>cuatro< /td>
< /tr>
< /table>

Monografias.com

HTML: tablas, rowspan
< table border="1">
< tr>
< td rowspan="2">uno< /td>< td>dos< /td>
< /tr>
< tr>
< td>cuatro< /td>
< /tr>
< /table>

Monografias.com

HTML: tablas, encabezados
< table border="1">
< tr>
< th>uno< /th>< th>dos< /th>
< /tr>
< tr>
< td>tres< /td>< td>cuatro< /td>
< /tr>
< /table>

Monografias.com

HTML: tablas, bordes y espacios
¡Usar CSS!
< table>

< table border="4">

cellpadding="10"
cellspacing="10"

Monografias.com

HTML: tablas, textos y alineación
¡Usar CSS!
< td>Hola,< br>que tal< /td>
< tr align="center">
< td align="right">
< td valign="top">
< td valign="middle">
< td valign="bottom">

Monografias.com

HTML: tablas anidadas
< table border="1">
< tr>
< td>uno< /td>< td>dos< /td>
< /tr>
< tr>
< td>tres< /td>
< td>
< table border="1">
< tr>< td>uno< /td>< td>dos< /td>< /tr>
< tr>< td>tres< /td>< td>cuatro< /td>< /tr>
< /table>
< /td>
< /tr>
< /table>

Monografias.com

HTML: tablas con ancho fijo
< tableborder="1"width="50%">
< table
border="1"
width="200">
< td width="80%">

Monografias.com

HTML: tablas con encabezados
< table border="1">
< caption align="top">Titulo< /caption>
< tr>
< td>uno< /td>< td>dos< /td>
< /tr>
< tr>
< td>tres< /td>< td>cuatro< /td>
< /tr>
< /table>

Monografias.com

HTML: tablas con bordes
frame=
void: Sin lados (default)
above: Lado superior
below: Lado inferior.
hsides: Lados superior e inferior
vsides: Lados derecho e izquierdo
lhs: A mano izquierda únicamente
rhs: A mano derecha únicamente
box: Los cuatro lados externos
border: Los cuatro lados externos

Monografias.com

HTML: tablas con reglas
rules=
none: Sin reglas (default)
rows: Las reglas aparecerán entre los renglones
cols: Las reglas aparecerán entre las columnas
all: Las reglas aparecerán entre las columnas y los renglones

Monografias.com

HTML: frames
Múltiples páginas en una ventana
Control de despliegue
Contenido dinámico
Información estructurada

Monografias.com

HTML: frames
Página descriptora de contenido
< html>
< head>< title>Titulo< /title>< /head>
< frameset rows="80,20">
< frame src="cabeza.html">
< frame src="cuerpo.html">
< noframes>
< p>Tu navegador no despliega frames< /p>< /noframes>
< /frameset>
< /html>

Monografias.com

HTML: frames
< head>< title>Titulo< /title>
< /head>
< frameset rows="100,*" border="0">
< frame scrolling="auto"
src="cabeza.html"
name="mensajes"
noresize>
< frame scrolling="yes" src="cuerpo.html">
< /frameset>

Monografias.com

HTML: frames anidados
< frameset cols="100,*">
< frame src="menu.html">
< frameset rows="80,20">
< frame src="cabeza.html">
< frame src="cuerpo.html">
< /frameset>
< /frameset>

Monografias.com

HTML: frames destino
Se puedes especificar un frame como destino
< a href="bienvenida.html"target="mensaje">
Mensaje de Bienvenida
< /a>

Monografias.com

HTML: frames destino
Existen varios destinos reservados:
_blank
Enviar a una ventana nueva
_self
Enviar al mismo frame donde se encuentra la liga
_parent
Enviar a la ventana padre, es decir, a donde se encuentra el frameset que define al frame donde se encuentra la liga
_top
Enviar a la ventana principal

Monografias.com

HTML: frames en línea
< p>A continuación, un iframe:< /p>
< iframe src="iframe.html" width="200" height="400" scrolling="auto" frameborder="1">

Monografias.com

HTML: actualización automática
Permite la actualización de una página o redireccionar después de un tiempo
< head>
< meta http-equiv="Refresh" content="15; URL=http://www.utm.mx">
< /head>

Partes: 1, 2
 Página anterior Volver al principio del trabajoPágina siguiente 

Nota al lector: es posible que esta página no contenga todos los componentes del trabajo original (pies de página, avanzadas formulas matemáticas, esquemas o tablas complejas, etc.). Recuerde que para ver el trabajo en su versión original completa, puede descargarlo desde el menú superior.

Todos los documentos disponibles en este sitio expresan los puntos de vista de sus respectivos autores y no de Monografias.com. El objetivo de Monografias.com es poner el conocimiento a disposición de toda su comunidad. Queda bajo la responsabilidad de cada lector el eventual uso que se le de a esta información. Asimismo, es obligatoria la cita del autor del contenido y de Monografias.com como fuentes de información.

Categorias
Newsletter