etiquetas básicas para la creación de páginas web

Etiquetas básicas para la creación de páginas Web.

No estan todas las etiquetas, sobre todo tomando en cuenta que cada día se incorporan nuevos programas para la trabajar en la red. Sin embargo tienes aqui todas las etiquetas básicas. No intentes aprendertelas de memoria, te recomiendo que la imprimas y que la utilizes para perfeccionar el trabajo realizado con tú programa de creación de Web. Recuerda que para crear páginas Web de forma profesional debes combinar varios programas, ya verás que cuando te familiarizes con la etiquetas "Tags" todo será mucho más comprensible.

<HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY></BODY> </HTML>

ESTRUCTURA BÁSICA

<P> PARRAFO<H1></H1> hasta <H6></H6>

CABECERAS DE MAYOR A MENOR

<CENTER></CENTER> CENTRADO<HR> RAYA HORIZONTAL<HR WIDTH=..%> ANCHURA %<HR WIDTH=..> ANCHURA PIXELES<HR WIDTH=..% ALIGN=LEFT> IZQUIERDA<HR WIDTH=..% ALINGN=RIGHT> DERECHA<HR SIZE=..> ESPESOR<HR NOSHADE> LINEA SOLIDA<BR> SEPARA LOS PARRAFOS<BR><P> PARA DEJAR ESPACIO EN BLANCO<STRONG></STRONG> OSCURECE EL TEXTO<B></B> NEGRITA<I></I> CURSIVA<PRE></PRE> PREFORMATEADO

<TT></TT> APARIENCIA DIFERENTE DEL PARRAFO

<BLOCKQUOTE></BLOCKQUOTE> CITA TEXTUAL<SUB></SUB> FORMULAS MATEMATICAS<UL></UL> <LI> LISTAS DESORDENADAS

<OL></OL> <LI> LISTAS ORDENADAS

<DL></DL> <DT> <DD> LISTAS DE DEFINICIÓN

<!.. ..> COMENTARIOS NO VISIBLEStodo tipo de ENLACES ENLACES

<A HREF="....">---</A> ENLACES

1

<A HREF="#.....">---</A> ENLACES EN UNA MISMA PAG<A NAME="......"> DONDE QUEREMOS EL ENLACE

<A HREF="....html"> (texto de enlace) </A> ENLACES CON OTRA PAG NUESTRA

<A HREF="....html# (alinear) "> (texto de enlace) </A> ENLACE CON UN SITIO CONCRETO DE OTRA

<A NAME="alinear"></A> PAG NUESTRA

"SUBDIR/...html" ENLACE ANTERIOR EN UN SUBDIRECTORIO

<A HREF="http://...../"> (texto de enlace) </A> ENLACE CON UNA PAG. FUERA DE NUESTRO SISTEMA

<A HREF="mailto:(email)"> (texto del enlace) </A> CORREO ELECTRONICOINSERTAR IMAGENES E IMAG. DE ENLACE

<IMG SRC="...gif"> PARA CARGAR UNA IMAGEN EN MI DIRECTORIO

<IMG SRC="...gif" ALT="..." PARA LOS QUE NO VEN IMAGENES VEN EL TITULO

<IMG SRC="..gif" ALIGN=TOP> TITULAR ALINEADO ARRIBA<IMG SRC="...gif" ALIGN=MIDDLE> TITULAR ALINEADO EN MEDIO<IMG SRC="....gif" ALIGN=BOTTOM> TITULAR ALINEADO ABAJO

<A HREF="...html"><IMG SRC="....gif"></A>ENLACE A OTRA PAG NUESTRA CON UNA IMAGEN EN EL MISMO DIRECTORIO

<A HREF="...html"><IMG SRC="...gif" BORDER=0></A> LO MISMO,PERO SIN BORDE EN LA IMAGEN

<A HREF="...gif"><IMG SRC="...gif"></A> ENLACE ENTRE DOS IMAGENES<A HREF="...gif"> (texto de enlace) </A> enlace con texto< < > > & & " " á á é é í í ó ó ú ú Á Á É É Í Í Ó Ó Ú Ú ñ ñ Ñ Ñ ü ü Ü Ü ¿ ¿ ¡ ¡

CARACTERES ESPECIALES

<FONT SIZE=..>......</FONT> <FONT SIZE=-..>.....</FONT>

tamaño de la fuente

2

<FONT SIZE=+..>.....</FONT>

<BASEFONT SIZE=..> fuente base:se coloca despúes de body

<FONT FACE="(tipo de fuente">......</FONT>

<FONT FACE="Impact, arial">...</FONT>se coloca una fuente o alternativas

<BODY BGCOLOR="#......"> Fondos con nº hexadecimales<BODY BGCOLOR=.....> Fondos nombres de colores en ingles<BODY BGCOLOR="#......" TEXT="#......" LINK="#......" VLINK="#......" ALINK="#......">

colores del texto y de los enlaces con nº hexadecimales

<BODY BGCOLOR=...... TEXT=...... LINK=...... VLINK=...... ALINK=......>

colores del texto y de los enlaces con nombres de colores en ingles

<BODY BACKGROUND=".....GIF"> <BODY BACKGROUND=".....JPG"> fondos con una imagen

<BODY BACKGROUND=".....JPG" BGCOLOR="#......" " TEXT="#......" LINK="#......" VLINK="#......" ALINK="#......">

Etiqueta completa con nº hexadecimales

<BODY BACKGROUND=".....JPG" BGCOLOR=TEXT=...... LINK=...... VLINK=...... ALINK=......>

Etiqueta completa con nombres de colores en ingles

<FONT COLOR="#FF0000">.......</FONT> cambio de color de una parte del texto con nº hexadecimales

<FONT COLOR=.......>.......</FONT>cambio de color de una parte del texto con nombres de colores en ingles

COLORES#FF0000 ROJO RED AZUL MARINO NAVY #00FF00 VERDE GREEN CHOCOLATE CHOCOLATE #0000FF AZUL BLUE CREMA CLARO NAVAJO WHITE #FFFFFF BLANCO WHITE AZUL CLARO CYAN #000000 NEGRO BLACK GRIS GRAY #FFFF00 AMARILLO YELLOW GRIS CLARO GRAY70 GRIS MEDIO GRAY40 GRIS OSCURO GRAY10 MAGENTA MAGENTA NARANJA ORANGE ROSA PINK ROSA FUERTE HOTPINK SIENA SIENNA TOMATE TOMATO VERDE HIERBA FORRESTGREEN VERDE OLIVA OLIVEDRAB<IMG SRC="....GIF" ALIGN=LEFT> <IMG SRC="....GIF" ALIGN=RIGHT>

PARA ALINEAR LA IMAGEN CON RESPECTO AL TEXTO

<IMG SRC="....jpg" ALIGN=LEFT> <IMG SRC="....jpg" ALIGN=RIGHT> POSICIONAMIENTO

<BR CLEAR=LEFT> MARGEN IZQUIERDO DE LA IMAGEN

<BR CLEAR=RIGHT> (A LA DERECHA) CON RESPECTO A LA IMAGEN

<BR CLEAR=ALL> MARGEN LIBRE A AMBOS LADOS

<BR> SALTA EL MARGEN HASTA DEBAJO DE LA IMAGEN

<IMG SRC=".....gif"> WIDTH=.... HEIGHT= DIMENSIONANDO LA IMAGEN<A HREF=".....GIF"> <IMG SRC=".....GIF" WIDTH=... HEIGHT=....></A> THUMBNAIL

3

TABLAS<TABLE BORDER></TABLE> ETIQUETA GENERAL<TR></TR> FILAS<TD></TD> CELDAs<CAPTION></CAPTION> TITULAR<TABLE BORDER=..></TABLE> ESPESOR<TH></TH> CELDAS DE CABECERA<TABLE BORDER=..> <TR><TD><IMG SRC=".....gif"></TD></TR>........ </TABLE>

EJEMPLO DE COMO SE COLOCA UNA IMAGEN EN UNA TABLA

<TABLE BORDER> <TR><TD><A HREF=".....html">....</A></TD> </TR> </TABLE>

ENLACE CON UN TEXTO EN UNA TABLA

POSICIONAMIENTO DE UNA CELDA<TD ALIGN=CENTER>....</TD> AL CENTRO<TD ALIGN=RIGHT>.....</TD> A LA DERECHA<TD <ALIGN=LEFT>.....</TD> A LA IZQUIERDA

ALINEAMIENTO DE UNA CELDATD VALIGN=TOP>......</TD> ARRIBA<TD VALIGN=BOTTOM>...</TD> ABAJO

DIMENSIONES DE LA TABLA<TABLE WIDTH=..%> PORCENTAJE<TABLE WIDTH=..> PIXELES<TABLE HEIGHT=..> PIXELES<TABLE HEIGHT=..%> PORCENTAJE

CELDAS QUE ABARCAN A OTRAS<TD COLSPAN= ..>......</TD> COLUMNAS<TD ROWSPAN=..>..........</TD> FILAS

COLOR DE FONDO EN LAS TABLAS O EN LAS CELDAS

<TABLE BORDER BGCOLOR="#......"></TABLE> COLOR DE LA TABLA EN Nº HEXADECIMALES

<TABLE BORDER BGCOLOR=......></TABLE> COLOR DE LA TABLA CON nombres de colores en ingles

<TD BGCOLOR="#......"></TD> COLOR DE LA CELDA EN Nº HEXADECIMALES

<TD BGCOLOR=......></TD> COLOR DE LA CELDA CON nombres de colores en ingles

IMAGENES DE FONDO EN LAS TABLASTABLE BORDER BACKGROUND="....jpg"></TABLE> IMAGEN DE LA TABLATABLE BORDER BACKGROUND="....gif"></TABLE> IMAGEN DE LA TABLA<TD BACKGROUND="....jpg"></TD> IMAGEN DE LA CELDA<TD BACKGROUND="....gif"></TD> IMAGEN DE LA CELDA

<TH BACKGROUND="....jpg"></TH> IMAGEN DE LA CELDA DE CABECERA

<TH BACKGROUND="....gif"></TH> IMAGEN DE LA CELDA DE CABECERA

4

SEPARACIÓN ENTRE LAS CELDAS DE UNA TABLA<TABLE BORDER CELLSPACING=..></TABLE> <TABLE BORDER=.. CELLSPACING=..>

SEPARACIÓN ENTRE LAS CELDAS DE UNA TABLA

SEPARACIÓN ENTRE EL BORDE Y EL CONTENIDO DENTRO DE LAS CELDAS

<TABLE BORDER CELLPADDING=SEPARACIÓN ENTRE EL BORDE Y EL CONTENIDO DENTRO DE LAS CELDAS

<TABLE BORDER=.. CELLSPACING=.. CELLPADDING=..> ETIQUETA COMPLETA, SE RECOMIENDA

FORMULARIOS<FORM ACTION="mailto:[email protected]" METHOD="POST" ENCTYPE="TEXT/PLAIN"> (Resto de tags) </FORM>ACTION: acción a efectuar

METHOD="POST" que los datos sean enviados inmediatamente

ENCTYPE="TEXT/PLAIN" las respuestas las recibimos como un fichero de texto

INTRODUCCIÓN POR MEDIO DE TEXTO (1 LINEA)<FORM ACTION="mailto:[email protected]" METHOD="POST" ENCTYPE="TEXT/PLAIN"> aqui va el texto

<BR><INPUT TYPE="Text" NAME="...."> </FORM>

Lo que se pone aqui es la referencia de lo que recibirimos

INPUT TYPE el tipo de introducción

NAME la referencia para cuando recibimos el mensaje

<FORM ACTION="mailto:[email protected]" METHOD="POST" ENCTYPE="TEXT/PLAIN"> <BR><INPUT TYPE="Text" NAME="(Lo que se pone aqui es la referencia de lo que recibirimos)" SIZE= "." MAXLENGTH="."> </FORM>SIZE longitudMAXLENGTH numero de caracteres<FORM ACTION="mailto:[email protected]" METHOD="POST" ENCTYPE="TEXT/PLAIN"> (aqui va el texto) <BR><INPUT TYPE="password" NAME="(Lo que se pone aqui es la referencia de lo que recibirimos)" SIZE= "." MAXLENGTH="."> </FORM>

password: asteriscos

INTRODUCCIÓN POR MEDIO DE TEXTO (múltiples líneas).<FORM ACTION="mailto:[email protected]" METHOD="POST" ENCTYPE="TEXT/PLAIN"> (aqui va el texto que la gente puede escribir) <BR><TEXTAREA NAME=".." ROWS="..." COLS="..."> </TEXTAREA> </FORM>TEXTAREA etiqueta principalROWS nº de filasCOLS nº de columnas

INTRODUCCIÓN POR MEDIO DE MENUS<FORM ACTION="mailto:[email protected]" METHOD="POST" ENCTYPE="TEXT/PLAIN">

5

(texto en preguntas) <BR><SELECT NAME="(texto que pregunta)"> <OPTION>..... <OPTION>..... <OPTION>etc </SELECT> </FORM>SELECT NAME etiqueta generalOPTION tantas como queramos<FORM ACTION="mailto:[email protected]" METHOD="POST" ENCTYPE="TEXT/PLAIN"> (texto en preguntas) <BR><SELECT NAME="(texto que pregunta)" MULTIPLE SIZE="."> <OPTION>..... <OPTION>..... <OPTION>etc </SELECT> </FORM>

MULTIPLE SIZE se veran tantas opciones como queramos

FORMULARIOS DE CONFIRMACIÓN<FORM ACTION="mailto:[email protected]" METHOD="POST" ENCTYPE="TEXT/PLAIN"> <INPUT TYPE="checkbox" NAME="Lista"> (por ej: Si, deseo ser incluido en la lista de correo) </FORM>

<FORM ACTION="mailto:[email protected]" METHOD="POST" ENCTYPE="TEXT/PLAIN"> <INPUT TYPE="checkbox" NAME="Lista" CHECKED> (por ej: Si, deseo ser incluido en la lista de correo) </FORM>

BOTONES DE RADIO<FORM ACTION="mailto:[email protected]" METHOD="POST" ENCTYPE="TEXT/PLAIN"> (pregunta) <BR><INPUT TYPE="radio" NAME="...." VALUE="...." CHECKED>..... <INPUT TYPE="radio" NAME="...." VALUE="....">.... <INPUT TYPE="radio" NAME="...." VALUE="....">.... </FORM>

BOTONES DE ENVIO Y DE BORRADOFORM ACTION="mailto:[email protected]" METHOD="POST" ENCTYPE="TEXT/PLAIN"> (escribimos lo que quieras que aparezca) <BR><INPUT TYPE="Text" NAME="(Lo que se pone aqui es la referencia de lo que recibirimos)"> <P><INPUT TYPE="submit" VALUE="Enviar datos"> <P><INPUT TYPE="submit" VALUE="Borrar datos"> </FORM>

MAPAS

<MAP NAME="...."> ETIQUETA DE APERTURA Y NOMBRE DEL MAPA

<AREA SHAPE="RECT" COORDS="..,..,..,.." HREF="....html"> PRIMERA ZONA ACTIVA CON SUS COORDENADAS Y EL ENLACE

<AREA SHAPE="DEFAULT" NOHREF> AREA COMPLETA DEL MAPA CON

6

SU FORMA RECTANGULAR E INDICANDO LA ZONA NO ACTIVA

</MAP> ETIQUETA DE CIERRE

<IMG SRC="......gif" USEMAP="#...">

PARA SOLICITAR AL SERVIDOR LA IMAGEN E INDICA LA SENSIBLILIDAD DEL RATON

ENLACES ALTERNATIVOS MAPAS

<FONT SIZE=-..> REDUCIENDO EL TEXTO PARA HACERLO MENOS ANTIESTETICO

<A HREF="...html">(TEXTO DE ENLACE) </A> </FONT>

ESTO SE DEBE HACER A CONTINUACIÓN DEL MAPA, PARA LOS QUE NO VEAN EL MAPA

ZONAS ACTIVAS EN FORMA DE CIRCULOS O POLIGONOS

<AREA SHAPE="CIRCLE" COORDS="y,x,r," HREF="....">

ZONA ACTIVA CIRCULAR CONOCIENDO LAS COOODENADAS DE SU CENTRO (X,Y) Y LA LONGITUD DE SU RADIO (r)

<AREA SHAPE="POLYGON" COORDS="x.,y.,x.,y.,..." HREF="...."> POLIGONOFRAMES

<FRAMESET COLS="..%, ..%"> ETIQUETA BASE MÁS EL % DE C/ FRAMES EN COLUMNAS

<FRAMESET ROWS="..%, ..%"> FILAS<FRAME SRC="...html"> CONTENIDO DE C/ FRAME Y<FRAME SRC=".......html" NAME="...."> SE DEFINE EL DOC PRINCIPAL</FRAMESET> ETIQUETA DE CIERRE

DOCUMENTO HTML DE CADA FRAME

<A HREF="....html" TARGET="....">...</A>SE INDICA EL ENLACE Y QUE AL SER ACTIVADO SE CARGRE EN EL FRAME PRINCIPAL

<NOFRAMES></NOFRAME> <BODY></BODY> PARA LO QUE NO SOPORTAN FRAMES

ETRUCTURA DE UN FRAME DOCUMENTO DE DEFINICIÓN

<HTML> <HEAD> <TITLE>......</TITLE> </HEAD> <FRAMESET COLS="..%, ..%"> <FRAME SRC="...html" NAME="..."> </FRAMESET> </HTML>

FRAMESET:DE UTILIZA EN LUGAR DE BODY <FRAME SRC="...html"> COLS:COLUMNAS DE FRAMES COLS="..%, ..%":PORCENTAJE DE C/FRAME(se puede hacer en pixe) ROWS:FILAS DE FRAMES FRAME SRC:CONTENIDO DE C/ FRAME NAME:DOC PRINCIPAL

DOCUMENTO HTML DE CADA FRAME<HTML> <HEAD>

TARGET:para que al ser activado el enlace no se cargue en el propio

7

<TITLE>(INDICE)</TITLE> </HEAD> <BODY (demas tags)> <P><A HREF="...html" TARGET="....">...</A> <P><A HREF="...html" TARGET="....">...</A> <P></BODY> </HTML>

frame, sino en otro, por (Demás etiquetas, enlaces, imagenes, etc).ej: en el principal

NAVEGADORES QUE NO SOPORTAN FRAMES<HTML> <HEAD> <TITLE>......)</TITLE> </HEAD> <FRAMESET COLS="..%, ..%"> (ROWS) <FRAME SRC="...html"> <FRAME SRC="...html" NAME="..."> <NOFRAMES> <BODY> (Aqui va lo que los navegadores que no soportan frames pueden ver, enlaces se recomienda) </BODY> </NOFRAMES> </FRAMESET> </HTML>

ATRIBUTOS DE LA ETIQUETA FRAMESET-FRAMES SIN BORDE<HTML> <HEAD> <TITLE>......)</TITLE> </HEAD> <FRAMESET FRAMEBORDER=0 FRAMESPACING=0 BORDER=0 COLS=".%,.%"> <FRAME SRC="...html"> <FRAME SRC="...html" NAME="..."> <NOFRAMES> <BODY> (Aqui va lo que los navegadores que no soportan frames pueden ver, enlaces se recomienda) </BODY> </NOFRAMES> </FRAMESET> </HTML>FRAMEBORDER delimita el borde de separaciónFRAMESPACING huecos de separación (EXPLORER)BORDER huecos de separación (NETSCAPE)

ATRIBUTOS DE LA ETIQUETA FRAMESRC= dirección para el enlaceNAME= nombre de la ventana principalMARGINWIDTHnº controla el ancho de los margenesMARGINHEIGT nº controla la altura de los margenesSCROLLING= yes/no/auto barra deslizadora

NORESIZE= para que no se pueda redimensionar la ventana

FRAMESBORDER= no elimina el borde en un frame

8

EL ATRIBUTO TARGET

TARGET="_blank" Hace que se abra una nueva copia del navegador

TARGET="_self" Hace que el enlace se cargue en el propio frame

TARGET="_top" el enlace se cargue a pantalla completa

FRAMES ANIDADOS DENTRO DE OTROS FRAMESHTML> <HEAD> <TITLE>(pag con fila sup. y dos columnas inferiores)</TITLE> </HEAD> <FRAMESET ROWS =".%,*> <FRAME SRC="(doc. columna izquierda)"> <FRAME SRC="(doc. columna derecha)"> </FRAMESET> </HTML>

SONIDOS<BGSOUND SRC="(fichero de sonido)" LOOP=(nº)> EXPLORER

LOOP nº de veces que de debe ejecutar el fichero

LOOP= infinite infinitoLOOP se ejecuta una sola vez<EMBED SRC="(fichero de sonido)" WIDTH=.. HEIGHT=..> NESTCAPEWIDTH anchura de la consolaHEIGHT altura de la consolaSe pueden agregar los siguientes atributos:AUTOSTART="true" arranca automaticamenteLOOP="true" se ejecuta ininterrumpidamenteHIDDEN="true" consola invisible

COMBINADO PARA EXPLORER Y NESTCAPE<BGSOUND SRC="...mid"> <EMBED SRC="....mid" HIDDEN="true"> SE EJECUTARÁ UNA SOLA VEZ

<BGSOUND SRC="...mid" LOOP= infinite> <EMBED SRC="....mid" WIDTH=.. HEIGHT=.. AUTOSTART="true" LOOP="true" HIDDEN="true"

PARA QUE SE EJECUTE INDEFINIDAMENTE

ACTIVACIÓN DEL SONIDO POR EL PROPIO USUARIO<A HREF="....mid">mus</A><A HREF="....wav"><IMG SRC="...gif"></A>TEXTO EN MOVIMIENTO MARQUESINAS

ETIQUETA BÁSICA<MARQUEE>(texto que se desplaza)</MARQUEE>

ATRIBUTOS

<MARQUEE WIDTH=.. HEIGHT=..>....</MARQUEE> ANCHURA Y ALTURA DE LA MARQUESINA

ALIGN modifica el alineamiento del texto que rodea y puede ser

9

<MARQUEE WIDTH=.. HEIGHT=.. ALIGN=TOP>.....</MARQUEE> ARRIBA<MARQUEE WIDTH=.. HEIGHT=.. ALIGN=MIDDLE>.....</MARQUEE> EN MEDIO<MARQUEE WIDTH=.. HEIGHT=.. ALIGN=BOTTOM>.....</MARQUEE> ABAJO

BEHAVIOR de que manera se va a efectuar el desplazamiento

<MARQUEE BEHAVIOR=SCROLL> aparece por un lado y desaparece por el otro

<MARQUEE BEHAVIOR=SLIDE> aparece por un lado y se para en el otro

<MARQUEE BEHAVIOR=ALTERNATE> se desplaza a un lado y a otro sin desaparecer

BGCOLOR COLOR DE FONDO DE LAS MARQUESINAS

<MARQUEE BGCOLOR="#......"> fondo en nº hexadecimales<MARQUEE BGCOLOR= fondo nombres colores<MARQUEE DIRECTION=RIGHT> DIRECTION:derecha<MARQUEE DIRECTION=LEFT> izquierda<MARQUEE SCROLLAMOUNT=..> SCROLLAMOUNT<MARQUEE SCROLLDELAY=..> SCROLLDELAY<MARQUEE LOOP=..> LOOP<MARQUEE HSPACE=..> HSPACE<MARQUEE VSPACE=..> VSPACE

FUENTES DENTRO DE LAS MARQUESINAS<FONT FACE="Impact"> <MARQUEE (demas tags)> (Marquesina) </MARQUEE> </FONT>

MARQUESINA DENTRO DE UNA TABLA<TABLE BORDER=..> <TR><TD> <MARQUEE>(texto que se desplaza)</MARQUEE> </TD></TR> </TABLE>

TEXTO EN MOVIMIENTO CON UN GIF ANIMADO.SE CREA EL TEXTO CON COREL . MONTAMOS LA SECUENCIA CON COREL . SE LE AÑADE UN LOOP PARA REPETIR LA SECUENCIA

TEXTO EN MOVIMIENTO CON JAVASCRIPT<HTML> <HEAD> <TITLE>....</TITLE> <SCRIPT LANGUAGE="JavaScript"> (aqui va colocado el script) </SCRIPT> </HEAD> <BODY>.......</BODY> </HTML>

1º COMO INCLUIRLO EN HTML:

2º SCROLL EN LA BARRA DE ESTADO:<SCRIPT LANGUAGE="JavaScript">

10

</SCRIPT>

<BODY onLoad="scroll(); "> NOTA IMPORTANTE: DENTRO DE LA ETIQUETA BODY SE AÑADE:

SCROLL EN UNA VENTANA<SCRIPT LANGUAGE="JavaScript">  </SCRIPT>

<BODY onLoad="scroll(); "> NOTA IMPORTANTE: DENTRO DE LA ETIQUETA BODY SE AÑADE

<FORM NAME=`frm`> <INPUT TYPE="Text" NAME=`w` SIZE=64> </FORM>

.Las etiquetas para la ventana del formulario:

PUBLICACIÓN Y PROMOCIÓN DE UNA PAGINA WEBA) PUBLICACIÓN EN: -Servidores de instituciones oficiales y academicas -Proovedores comerciales de acceso a Internet -Ciertos servidores que conceden espacio gratuito

B) COMO SE ENVIAN LAS PAG AL SERVIDOR: Generalmente se hace utilizando un programa de FTP

C) PROMOCIÓN DE UNA PAG: -Colocarla en nuestro email -dar de alta a nuestra pag en sitios Web especializados: los hay organizados como directorios y tambien estan los motores de busqueda.

D) CONSEJOS PARA FACILITAR LA LABOR DE LOS MOTORES DE BUSQUEDA: -Utilizar palabras clave dentro de la etiqueta TITLE -Utilizar etiquetas META: se coloca en la zona entre HEAD

<META NAME="description" CONTENT="(titulos apropiados en

11

español e ingles)"> .CONTENT: ES LO QUE PRESENTARÁ EL MOTOR DE BUSQUEDA

<META NAME="Keywords" CONTENT="(lo que se verá, palabra clave)">NOTA: LOS MOTORES BUSCAN LAS PALABRAS QUE ENCUENTRAN AL PRINCIPIO

Utilizar el atributo ALT

Poner en resumen del contenido de la pag en el comienzo del texto. Los motores utilizan las 25 primeras palabras de una pag, por tanto conviene hacer enfasis en el principio de nuestra pag

E) SISTEMAS DE BUSQUEDA EN ESPAÑOL Hay que darse de alta uno por uno

F) SISTEMAS DE BUSQUEDA EN INGLES

1. Por medio de formularios -Registro múltiple -Buscadores de tipo general -Buscadores de empresas 2. Registro en buscadores que estan organizados como directorios, pro ej: Yahoo 3. Registro mediante el envio de un email

CONTADORES DE VISITAS1. COMO FUNCIONA UN CONTADOR Si se quiere poner un contador en una pag se debe preguntal el proveedor: - Si tiene instalado un programa que gestione los contadore de los usuarios - En caso afirmativo, cual es la etiqueta concreta 2. SERVIDORES PUBLICOS DE CONTADORES En caso negativo se puede recurrir a otros servidores que se dedican a esto 3. ESTADISTICAS DE LAS VISITAS NEDSTAT España proporciona este servicio

Codificación de colores

En HTML, los colores se definen mediante tres números hexadecimales que representan los tonos rojo, azul y verde, usando la codificación RGB) del color elegido. Esta es la sintaxis para codificar un color en HTML:color="#RRGGBB"RR, GG y BB representan, cada uno, un número hexadecimal entre 00 y FF para el rojo, el verde y el azul respectivamente. Con esta sintaxis, se pueden utilizar más de 16 millones de colores en las páginas Web. Sin embargo como no todos los navegadores reconocen los colores del mismo modo, W3C recomienda usar los colores a continuación, que han recibido nombres específicos. Por lo tanto, puede (y se aconseja) representar los colores de esta forma:

color="color_name"

12

Nombre del color Código RGB

Aliceblue Aliceblue #F0F8FF

Antiquewhite Antiquewhite #FAEBD7

Aqua Aqua #00FFFF

Aquamarine Aquamarine #7FFFD4

Azure Azure #00FFFF

Beige Beige #F5F5DC

Bisque Bisque #FFE4C4

Black Black #000000

Blanchedalmond Blanchedalmond #FFEBCD

Blue Blue #0000FF

Blueviolet Blueviolet #8A2BE2

Brown Brown #A52A2A

Burlywood Burlywood #DEB887

Cadetblue Cadetblue #5F9EA0

Chartreuse Chartreuse #7FFF00

Chocolate Chocolate #D2691E

Coral Coral #FF7F50

Cornflowerblue Cornflowerblue #6495ED

Cornsilk Cornsilk #FFF8DC

Crimson Crimson #DC143C

Cyan Cyan #00FFFF

Darkblue Darkblue #00008B

Darkcyan Darkcyan #008B8B

Darkgoldenrod Darkgoldenrod #B8860B

Darkgray Darkgray #A9A9A9

Darkgreen Darkgreen #006400

Darkkhaki Darkkhaki #BDB76B

Darkmagenta Darkmagenta #8B008B

Darkolivegreen Darkolivegreen #556B2F

Darkorange Darkorange #FF8C00

Darkorchid Darkorchid #9932CC

13

Darkred Darkred #8B0000

Darksalmon Darksalmon #E9967A

Darkseagreen Darkseagreen #8FBC8F

Darkslateblue Darkslateblue #483D8B

Darkslategray Darkslategray #2F4F4F

Darkturquoise Darkturquoise #00CED1

Darkviolet Darkviolet #9400D3

Deeppink Deeppink #FF1493

Deepskyblue Deepskyblue #00BFFF

Dimgray Dimgray #696969

Dodgerblue Dodgerblue #1E90FF

Firebrick Firebrick #B22222

floralwhite floralwhite #FFFAF0

forestgreen forestgreen #228B22

fuchsia fuchsia #FF00FF

gainsboro gainsboro #DCDCDC

ghostwhite ghostwhite #F8F8FF

gold gold #FFD700

goldenrod goldenrod #DAA520

gray gray #808080

green green #008000

greenyellow greenyellow #ADFF2F

honeydew honeydew #F0FFF0

hotpink hotpink #FF69B4

indianred indianred #CD5C5C

indigo indigo #4B0082

ivory ivory #FFFFF0

khaki khaki #F0E68C

lavender lavender #E6E6FA

lavenderblush lavenderblush #FFF0F5

lawngreen lawngreen #7CCMC00

lemonchiffon lemonchiffon #FFFACD

14

lightblue lightblue #ADD8E6

lightcoral lightcoral #F08080

lightcyan lightcyan #E0FFFF

lightgoldenrodyellow lightgoldenrodyellow #FAFAD2

lightgreen lightgreen #90EE90

lightgrey lightgrey #D3D3D3

lightpink lightpink #FFB6C1

lightsalmon lightsalmon #FFA07A

lightseagreen lightseagreen #20B2AA

lightskyblue lightskyblue #87CEFA

lightslategray lightslategray #778899

lightsteelblue lightsteelblue #B0C4DE

lightyellow lightyellow #FFFFE0

lime lime #00FF00

limegreen limegreen #32CD32

linen linen #FAF0E6

magenta magenta #FF00FF

maroon maroon #800000

mediumaquamarine mediumaquamarine #66CDAA

mediumblue mediumblue #0000CD

mediumorchid mediumorchid #BA55D3

mediumpurple mediumpurple #9370DB

mediumseagreen mediumseagreen #3CB371

mediumslateblue mediumslateblue #7B68EE

mediumspringgreen mediumspringgreen #00FA9A

mediumturquoise mediumturquoise #48D1CC

mediumvioletred mediumvioletred #C71585

midnightblue midnightblue #191970

mintcream mintcream #F5FFFA

mistyrose mistyrose #FFE4E1

moccasin moccasin #FFE4B5

navajowhite navajowhite #FFDEAD

15

navy navy #000080

oldlace oldlace #FDF5E6

olive olive #808000

olivedrab olivedrab #6B8E23

orange orange #FFA500

orangered orangered #FF4500

orchid orchid #DA70D6

palegoldenrod palegoldenrod #EEE8AA

palegreen palegreen #98FB98

paleturquoise paleturquoise #AFEEEE

palevioletred palevioletred #DB7093

papayawhip papayawhip #FFEFD5

peachpuff peachpuff #FFDAB9

peru peru #CD853F

pink pink #FFC0CB

plum plum #DDA0DD

powderblue powderblue #B0E0E6

purple purple #800080

red red #FF0000

rosybrown rosybrown #BC8F8F

royalblue royalblue #4169E1

saddlebrown saddlebrown #8B4513

salmon salmon #FA8072

sandybrown sandybrown #F4A460

seagreen seagreen #2E8B57

seashell seashell #FFF5EE

sienna sienna #A0522D

silver silver #C0C0C0

skyblue skyblue #87CEEB

slateblue slateblue #6A5ACD

slategray slategray #708090

snow snow #FFFAFA

16

springgreen springgreen #00FF7F

steelblue steelblue #4682B4

tan tan #D2B48C

teal teal #008080

thistle thistle #D8BFD8

tomato tomato #FF6347

turquoise turquoise #40E0D0

violet violet #EE82EE

wheat wheat #F5DEB3

white white #FFFFFF

whitesmoke whitesmoke #F5F5F5

yellow yellow #FFFF00

yellowgreen yellowgreen #9ACD32

17

etiquetas básicas para la creación de páginas web

Documents