Web dinámica

Estructura de un documento HTML
Cada documento HTML tiene asociada una dirección URL (Localizador uniforme de recursos) al que se accede mediante el protocolo HTTP http://personales.unican.es/gutierjm
La estructura de un documento HTML es sencilla:
< HTML>
< !– Documento HTML de prueba –>

< HEAD>
< TITLE> Prueba < /TITLE>
< /HEAD>

< BODY>
El navegador interpreta y
visualiza el contenido
< /BODY>

< /HTML>

Comandos HTML
El lenguaje HTML posee una serie de marcas/comandos encerradas entre los signos < y > (signo de marca). Los navegadores ignoran cualquier marca que carezca de sentido y la tratan como texto.
En el nombre del comando no se distingue el uso de mayúsculas y minúsculas y los cambios de línea y espacios son ignorados al visualizar el contenido.
Existen dos tipos de comandos HTML:
Comandos con finalizador.Prueba de < B>texto en negrita< /B>
Comandos sin finalizador. Por ejemplo:< IMG SRC="Imagen.gif">

Algunos comandos admiten parámetros: < IMG SRC="Imagen.gif" ALIGN="RIGHT">

Formularios. Interacción con el servidor
La información es enviada a un CGI (Common Gateway Interface) para su procesamiento.
delimitado por los comandos < FORM> < /FORM>. El comando < FORM> admite un parámetro ACTION, cuyo valor es el URL del CGI.
Cada campo se define utilizando el comando < INPUT> y puede ser de diferentes tipos, dependiendo del valor de TYPE: text: campo de texto. button: botón. radio: botón de radio. checkbox: caja de selección. submit: botón para el envío. reset: borrado.

NAME nombre que utilizará el CGI para referirse al campo.  
VALUE utilizado para dar al campo valores por defecto.
SIZE establece el tamaño del campo (número de caracteres)
MAXSIZE indica el número máximo de caracteres que puede recibir el campo.
 

Ej. de Formulario
< html>< head>< title>Formulario< /title>< /head>< body>< H1>Datos personales< /H1>< FORM ACTION="http://servidor/Directorio/Nombre.cgi">Nombre < INPUT TYPE="text" NAME="Campo1" SIZE=25> Teléfono < INPUT TYPE="text" NAME="Campo2" SIZE=10> < BR>Domicilio < INPUT TYPE="text" NAME="Campo3" SIZE=43> < BR>Estado civil: < INPUT TYPE="radio" NAME="ec" VALUE="S">Soltero< INPUT TYPE="radio" NAME="ec" VALUE="C">Casado< INPUT TYPE="radio" NAME="ec" VALUE="D">Divorciado< INPUT TYPE="radio" NAME="ec" VALUE="V">Viudo < BR>< BR>Estudios realizados:< SELECT NAME="Estudios"> < OPTION>Sin estudios < OPTION SELECTED>Primarios < OPTION>Bachillerato < OPTION>Universitarios< /SELECT>< INPUT TYPE="checkbox" NAME="Cliente">Cliente actual< BR>< BR>Observaciones:< TEXTAREA NAME="Observ" ROWS=3 COLS=35>< /TEXTAREA>< BR>< BR>< INPUT TYPE="submit" VALUE="Enviar">< INPUT TYPE="reset" VALUE="Borrar">< /FORM>< /body>< /html>
ACTION="mailto:gutierjm@unican.es"
METHOD="POST“
ENCTYPE="text/plain"

XML: Esquema para datos Meteorológicos
< ?xml version="1.0" encoding="UTF-8"?>
< Class xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:noNamespaceSchemaLocation="meteo.xsd">
< Stream model="Wave model">
< Version value="4096">
< Type type="Forecast">
< Date>1967-08-13< /Date>
< Time>12:00< /Time>
< Step>24< /Step>
< Number>0< /Number>
< Level type="Pressure level">1000< /Level>
< Parameter table="ECMWF">Z< /Parameter>
< /Type>
< /Version>
< /Stream>
< /Class>
XML Instance
XML Schema

XML: Fuentes de información
http://wwws.sun.com/software/xml/
http://www.oasis-open.org/cover/sgml-xml.html

SVG. Scalable Vector Graphics
< ?xml version="1.0" encoding="iso-8859-1"?>
< !DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
< svg width= "500" height="500" viewBox="-100 -100 200 200" xmlns="http://www.w3.org/2000/svg">
< !–Imprimimos los patrones [5537]"–>
< g style="stroke-width:0.5; fill:blue; shape-rendering:default">
< circle cx="-26.4095" cy="6.19866" r="0.5"/>
< circle cx="-24.9492" cy="13.0801" r="0.5"/>
< circle cx="-47.9709" cy="63.9941" r="0.5"/>
En ocasiones, los formatos gráficos de mapas de bits, o comprimidos, no resultan apropiados para mostar información en la Web.
Ejemplo svg.

MathML. Mathematica Markup Languaje
La notación matemática es de un
extremado rigor y está libre de ambigüedad.

MathML permite codificar objetos matemáticos definiendo tanto la notación que representa al objeto matemático, como la estructura del mismo objeto:

Marca de presentación / estructura.
Marca de contenido.
MathML Interface. HTML4.0, etc.
Contenido
Estructura

Hojas de estilo CSS
Con el HTML se intentó desde un principio la definición de estilos lógicos que se centrasen más en el contenido de la información que en su presentación.
El gran éxito de Internet motivó una evolución del HTML centrada en mejorar su presentación.
Hemos llegado a un HTML demasiado complejo para sus objetivos iniciales y en muchos casos incompatible entre los principales navegadores.
Las hojas de estilo vienen a intentar volver a separar en un documento el contenido del estilo físico.
CSS son las siglas de "Cascade StyleSheet" y se trata de una especificación sobre los estilos físicos aplicables a un documento HTML, trata de dar la separación definitiva de la estructura y la presentación del documento.
La finalidad de las hojas de estilo es crear unos estilos físicos, separados de las etiquetas HTML, y aplicarlos en los bloques de texto en los que se quieran aplicar, en lugar de cómo parámetros de las etiquetas.