
- INTRODUCCI�N
- Una p�g. WEB es un documento que se puuede gestionar a trav�s de un servidor, en estructuras cliente-servidor, redes de �rea local ( LAN ) y comerciales de servicios internacionales de redes.
- Se gestiona a trav�s del HTML ( Hyper Text Markup Language ). Existen en el mercado algunas herramientas para facilitar la edici�n de estos documentos, entre ellas HOT METAL, HOT DOG, Internet Assistant for WORD 2.0., etc...
- Para crear un documento en Word, lo crreamos normal. Despu�s lo guardamos con el tipo de documento HTML Document, y queda con extensi�n HTM. Para saber si tenemos instalada aplicaci�n y utilizarla pinchamos el icono
- VER / HTML Source -> Se visualiza el ttexto editado con Word pero con todas las etiquetas incluidas por defecto, entonces personalizaremos el documento con las etiquetas necesarias que no han sido incluidas. Cuando est� editado el documento, para ver el aspecto en la WEB tenemos la opci�n preview.
- PARTES DE UNA P�G WEB
- El documento como tal, lo delimitan 2 etiquetas :< HTML > Documento < / HTML >
- Partes del documento :
- CABECERA : < HEAD > Cabeceras < / HEADD >
< TITLE > Texto < / TITLE > Para poner t�tulo a la ventana
< BASE > ( Atributos ) < / BASE > Propiedades de una parte o elemento del documento que gestionan unas determinadas etiquetas.
HREF = "URL" -> Referencia a la p�gina base en la que nos hemos
basado.
FILE : -> Referencia a un archivo
URL ( Localizador Uniforme de Recursos ) 3 grupos :
- Protocolo servidor
- Archivos si son de un entorno LAN o moonopuesto
- Comerciales de servicios internacionalles de redes.
< ISINDEX > < / ISINDEX > Cuando el WEB tiene una conexi�n a una base de datos en la que el navegaste puede realizar b�squedas.
< LINK > < / LINK > Especifica si la p�gina tiene alguna relaci�n de enlace con el que se especific� en su atributo HREF = "URL" y que tipo de relaci�n existe por medio los atributos :
REF = " Relaci�n "
REV = " Relaci�n " Quien enlaza conmigo
P�gina actual � Con la que enlazo � REF
Relaciones : NEXT � REF = "NEXT" El documento que he referenciado en HREF va detr�s del m�o.
REV = "NEXT" � Soy yo qui�n sigue al documento
PREVIOUS � Contrario a NEXT
PARENT � Documento padre
MADE � Documento que me ha hecho.
< META > Informaci�n adicional de otros componentes de la p�g < / META >
- CUERPO : < BODY > Cuerpo de la p�g. < / BODY >
- Titulares, encabezados : < Hn > Texto < / Hn > � Es un estilo que jerarquiza el texto con tama�os, valor entre 1-6 ( 1 el m�s grande ).
- P�rrafos : < P > P�rrafo < / P > � No reconoce tabulaciones< PRE > P�rrafo < / PRE > � Conserva el aspecto original, con tab.
- Listas :
- No ordenadas �
Los elementos de la lista aparecen con una tab. a la derecha y un bolo.
- Ordenadas �
Los elementos aparecen igual que antes pero con numeraci�n
- Listas de definici�n � Definici�n de tterminos.
- Comentarios : No son visibles en el WEEB, solo son para el programador
- Enfasis : Negrita
It�lica
Subrayado
Aumenta el tama�o fuente en It�lica y Negrita
- Separadores entre texto : Lineas Horizzontales
- Atributos : ALIGN = LEFT, CENTER, RIGHHT
WIDTH = Pixels ( Pueden ser decimales, por defecto, p�g. WEB )
SIZE = 1, �, 1/3
NOSHADE � Linea sin sombrear, si este atributo parece hundida
- Hiperenlaces : Son enlaces a partes deel documento u otras p�ginas. 3 tipos :
- De propia p�gina : > Ayuda
Ayuda en linea
- A otra p�gina local : Ver fotos
- A una p�g. de otro servidor : Yahoo!
- TABLAS :
- Est�n compuestas de un t�tulo
- Filas
TH � Guardan datos para encabezados.
TD � Guardan datos para las filas.
EJEMPLO:
- Una celda puede dividirse en m�s colummnas :
propiedad COLSPAN ; Ejemplo :
- Atributos para TABLE :
BORDER = Valor en pixels � especifica el ancho del borde para la tabla y sus celdas.
ALIGN = " TOP, BOTTOM, LEFT, RIGHT, CENTER "
WIDTH = Valor � Anchura de la tabla , si no se especifica se ajusta a las entradas.
Valor = 1 � Ancho de la p�gina.
Valor = 0,5 � Media p�gina.
Valor, 0,75 � � de la P�gina.
- Atributos para CAPTION :
ALIGN = " TOP, BOTTOM, LEFT, RIGHT, CENTER "
- Atributos para TR :
ALIGN = " TOP, BOTTOM, LEFT, RIGHT, CENTER "
- Atributos para TH, TD :
ALIGN = " TOP, BOTTOM, LEFT, RIGHT, CENTER "
WIDTH = Pixels
COLSTAR = N� Columna ( columna en la que debe comenzar )
COLSPAN = N� Columnas ( que se tienen que expandir )
ROWSPAN = N� de filas
VALIGN = La alineaci�n del valor o contenido de la celda, pero haciendo referencia al
ajuste vertical.
"TOP", "BOTTOM", "MIDDLE", "BASE LINE"
- FORMULARIOS :
- Sirven para enviar informaci�n al servvidor. Se introducen en la p�gina WEB mediante :
- Atributos para FORM :
Obligatorio y necesario : ACTION "URL" ( Servidor y aplicaci�n )
METHOD = " GET " � Lee informaci�n del servidor.
" POST " � Env�a por correo.
- Atributos para INPUT :
TYPE = " Palabra clave " � Tipo de control para entrada
- Palabras clave :
" TEXT " � Formato texto, tambi�n n�meros.
" KEYBOARD " � Caracteres o recuadro de texto.
" CHECKBOX " � Casilla de verificaci�n.
" RADIO " � Botones circulares, solo una opci�n de todas.
" SUBMIT " � Bot�n para pulsar sobre �l, que env�a el FORM al URL de
ACTION.
" RESET " � Visualiza un bot�n y si se pulsa, lipia el contenido del formulario.
" NAME " � Es el nombre que se da al control de entrada para referenciarlo en
macros.
VALUE � Para controles del formulario de tipo asterisco.
VALUE = * Texto.
Checked ( devuelve verdadero o falso ).
� Cadena de texto
CHECKED � Sirve para los CHECKBOX o RADIO, si se le da esta propiedad ser� el
que est� marcado por defecto.
SIZE = N� ( N�mero de caracteres que admite como m�ximo los controles INPUT de
tipo TEXT y KEYBOARD.
MAXLENGTH = N� ( N�mero de caracteres para cuadros de texto, en los que se
introducen valores password, que son de tipo text y password )
- Atributos para SELECT : Permite incluiir en sus etiquetas asociadas OPTION, distintas opciones para que puedan ser elegidas una o varias de ellas. Los atributos para esta etiqueta son :
SIZE = " MULTIPLE " � Permite que se puedan escoger m�s de una de las opciones de
la lista desplegable.
NAME = " Id. de control "
OPTION SELECTED � Opci�n seleccionada por defecto
- Atributos para TEXTAREA : Es un cuadroo para poder introducir texto de m�s de 1 linea, y tiene como propiedades :
NAME
ROWS = N� de filas
COLUMNS = N� de Columnas
1.-El lenguaje del Hipertexto:HTML
Seguro que has o�do hablar mucho sobre ello y todav�a no se te ha quedado muy claro en que consiste el misterioso lenguaje HTML que sirve para realizar esas atractivas p�ginas web que tanto te gustar�a visitar en Internet.
De momento te sigue pareciendo chino...pero no lo es.Se trata de un sistema de marcas que permite enlazar al mismo tiempo texto,sonidos y gr�ficos dentro del mismo documento,con otros dentro del servidor o incluso con otros servidores WWW.Es decir,es un editor para convinar textos,im�genes e incluso sonido y ah�ra tambi�n im�genes en movimiento.Es,en definitiva,la forma de manejar y presentar la informaci�n en la Red.
Para escribir documentos de hipertexto se ha desarrollado un nuevo formato de datos o lenguaje llamado Hyper Text Markup Language (HTML).Este lenguaje permite dar indicaciones precisas al programa cliente de c�mo debe presentares el documento en pantalla o al sel impreso.Por ejemplo,se puede se�alar que determinados textos deben ser escritos en negrilla,o en un tipo de letra m�s grande,cuales son los encabezamientos y t�tulos,etc...Tambi�n se pueden indicar d�nde se debe insertar una imagen en el texto o cualquier otro objeto multimedia,o informar en qu� fichero del servidor se encuentra �ste.
Escribir un documento de hipertexto usando HTML,no es en realidad una tar�a dif�cil.
1.2-Un poco de historia:
Hasta ahora,para editar p�ginas en HTML ten�amos una serie de aplicaciones que nos facilitavan la tarea.Dos tipos de editores permiten crear este tipo de hipertexto:un primer grupo,que s�lo combina sus elementos para crear las p�ginas.Y un segundo grupo,que hacen la funci�n de traductores y se encargan de pasar de un formato espec�fico de procesador de texto a HTML.
Las herramientas de edicci�n sencilla de HTML,adem�s de exigirnos un conocimiento de las diferentes tags,para crear p�ginas en la World Wide Web,nos limitan mucho la utilizaci�n de numerosos recursos.Por ello,las primeras p�ginas en Internet presentaban una apariencia muy sencila y pr�cticamente sin ning�n atractivo para el navegante.
En cambio,los traductores han supuesto un gran avance para los creadores de p�ginas web,puesto que,partiendo de cualquier procesador de texto podemos convertirlo de forma autom�tica en formato HTML.Las limitaciones segu�an siendo bastantes,puesto que hab�a ciertos elementos como formularios eletr�nicos y lenguaje JAVA que no pod�an incluirse(ni que decir tiene el sonido o la imagen en movimiento).
Todas estas herramientas HTML a las que hemos hecho referencia formar�n,en poco tiempo,parte de la historia de la edici�n de p�ginas web,gracias de FrontPage 97,que nos permite crear p�ginas con amplias posibilidades de dise�o y de inserci�n de elementos que hasta ahora ning�n conversor pod�a realizar.Sin duda,FrontPage ha sup�esto toda una revoluci�n.
1.3-Reglas b�sicas para la confecci�n de doumentos HTML:
Un documento HTML es simplemente un fichero de texto ASCII,en el que se incluye el texto que se desea mostrar en pantalla.Adem�s del texto,deben introducirse ciertos comandos o "marcas"(Tags) que indicar�n al browser c�mo se debe visualizar el documento en el monitor.A trav�s de los tags se definen los distintos elementos que componen la imagen.
Los tags se escriben encerrados entre los s�mbolos "<" y ">",y usualmente los comandos van por parejas,como veremos despu�s.
Por ejemplo,si se desea que un texto aparezca en negrita,debe escribirse el comando el principio de ses texto,y el comando al final.
Si quiere que el siguiente texto se vea en negrita:
Viaje por el mundo con WWW
En el documento HTML,esto se escribe con caracteres ASCII de la siguiente forma:
Viaje por el mundo con WWW
Atributos
E94
E95
E96 VENTAS
80
90