Guia Introduccion HTML

SERVICIO NACIONAL DE APRENDIZAJE SENA Versión: 02
SISTEMA INTEGRADO DE GESTIÓN

Fecha: Agosto 4 al 16/2015
Procedimiento Ejecución de la Formación Profesional Integral
GUÍA DE APRENDIZAJE Código: F004-P006-GFPI
Listas
Con frecuencia se usan listas en los documentos. El lenguaje HTML incorpora unas listas con
viñetas sencillas o también letras o números. Para dar más vistosidad a las páginas, se suelen
emplear también imágenes que se colocan delante de cada párrafo. Vamos a ver algunas de las
posibilidades que tenemos.
Listas con viñetas desordenadas
He aquí el ejemplo más sencillo de una de estas listas:
escribimos en html se verá como

<ul>
 Primer término de la lista
<li>Primer término de la lista
 Segundo término
<li>Segundo término
 Tercer término
<li>Tercer término
</ul>
Como ves, la lista se declara con la etiqueta <UL> y finaliza con el cierre de la misma </UL>.
También podemos modificar las viñetas por medio del atributo TYPE= circle,
disc o square (círculo, disco o cuadrado) y añadir sublistas.

<ul>  Primer término de la lista
<li type= disc>Primer término de la lista o Sublista
<ul>
o Otro elemento
<li>Sublista
<li>Otro elemento
o Segundo término
</ul>
<li type=circle>Segundo término
 Tercer término
<li type=square>Tercer término
</ul>
Otro atributo interesante es compact para reducir el espacio entre los elementos
Listas con viñetas ordenadas
Estas listas se caracterizan porque aparecen números o ciertos caracteres que ordenan sus
elementos. La etiqueta usada es <OL> junto con su correspondiente de cierre </OL>. El
atributo TYPE toma ahora los valores 1, a, A, i, I. Un ejemplo de estas listas es el siguiente
Página 1 de 38
GUÍA DE APRENDIZAJE Fecha: Agosto 4 al
SISTEMA INTEGRADO DE GESTIÓN 16/2014
Proceso Gestión de la Formación Profesional Integral
Procedimiento Ejecución de la Formación Profesional Integral Código: F004-P006-GFPI

<ol type=i>
i. Primer término de la lista
<li >Primer término de la lista
ii. Segundo término
<li >Segundo término
iii. Tercer término
<li>Tercer término
iv. Cuarto
<li>Cuarto
v. Quinto
<li>Quinto
</ol>
Listas de definición
Estas listas se forman con el elemento que se define y su definición. Las etiquetas
son <DL> y </DL> para la lista y <dt> y <dd> para los elementos y sus definiciones. Un
ejemplo:

<dl>
<dt >Término 1º Término 1º
<dd>Definición del elemento 1º Definición del elemento 1º
<dt>Término 2º Término 2º
<dt>Término 3º Término 3º
</dl>
Formatos del texto
El texto del documento se puede modificar de muchas formas, vamos a ver las más usuales:
Títulos
Los títulos o encabezamientos se emplean al comienzo de una sección. Las etiquetas que se
usan son:
Etiqueta Se ve
<h1> Título </h1> Título
Página 2 de 38

Estilos de fuentes
Como ves en la tabla es muy sencillo conseguir los efectos deseados, solamente tienes que
colocar el texto entre las etiquetas adecuadas.
Etiqueta Se ve
 <B>Texto en Negrita</b>  Texto en Negrita
 <I>Itálica</i>  Itálica
 <B><I>Negrita e Itálica</i></b>  Negrita e Itálica
 <U>Subrayado</u>  Subrayado Solo Explorer
 <EM>Enfatizado</em>  Enfatizado
 <STRONG>Fuerte</strong>  Fuerte
 Code Texto
 <CODE>Code Texto</code>
 Citation Text
 <CITE> Citation Text</cite>
 Keyboard Text
 <KBD>Keyboard Text</kbd>  Sample Text
 <SAMP>Sample Text</samp>  Teletype Text
 <TT>Teletype Text</tt>  Variable Element Text
 <VAR>Variable Element Text</var>
 Texto grande
 <BIG>Texto grande</big>
 Texto pequeño
 <SMALL>Texto pequeño</small>  Solo Explorer
Subíndice
 <SUB>Subindice</SUB>  Solo Explorer
Superíndice
 <SUP>Superíndice</SUP>  Texto intermitente Solo
 <BLINK> Texto intermitente</blink> Netscape
 <STRIKE>Texto tachado</STRIKE>  Texto tachado
Algunas etiquetas funcionan solamente con alguno de los navegadores, tenlo en cuenta si
las usas.
Tamaño de fuentes
El tamaño de las fuentes se puede especificar de dos maneras, una de ellas por medio de un
número del 1 al 7 (de más pequeño a más grande) del siguiente modo
Página 3 de 38
<font size=1> Esta es la letra más pequeña que se puede conseguir </font>
que se verá como
Esta es la letra más pequeña que se puede conseguir
Otra forma es por medio de una referencia relativa:

<font size="+1"> Esto es igual que poner size=4 </font>
que se ve como
Esto es igual que poner size=4
El tamaño por defecto es el 3
Tipos de fuentes
El tipo de fuente es un atributo de FONT y tiene la siguiente sintaxis

<font face="Courier">Eso se verá en la fuente Courier</font>
que se ve como:
Eso se verá en la fuente Courier
Color de las fuentes
Es otro atributo de FONT. Mira en la página de colores para saber cómo se especifican

los colores. La sintaxis es la siguiente:
<font size=2 face="MS Sans Serif" color="navy">Como ves se pueden poner varios
atributos separados por un espacio</font>
que se verá así:
Como ves se pueden poner varios atributos separados por un espacio
Párrafos y bloques
Para definir y separar bloques de texto se emplean una serie de etiquetas que definen los
párrafos, texto preformateado o bloques con significado especial como direcciones o citas.
Etiquetas de bloques:
<P> Se utiliza para que los párrafos queden separados por una línea en blanco. Si solo quieres
escribir un punto y aparte debes usar <BR>. Las marcas inicial y final son <P> y </P>. La
etiqueta <P> admite los atributos:
ALIGN="left" , ALIGN="right" , ALIGN="center" y ALIGN="justify" para alinearlo a la izquierda, a la

derecha, centrarlo o justificarlo totalmente. Por defecto está alineado a la izquierda.
Página 4 de 38
<PRE> El texto insertado entre las marcas <PRE> y </PRE> será visualizado por el navegador

respetando el formato con el que fue escrito en el fichero fuente HTML. Esta etiqueta es muy útil
para escribir más de un espacio o para hacer pequeñas tablas
<ADDRESS> empleada para indicar que un texto representa una dirección o una firma.
Generalmente se presenta en cursiva y tabulado.
<BLOCKQUOTE> Se representa con tabulaciones a la izquierda y derecha. Toda los párrafos de

esta página están entre las etiquetas <BLOCKQUOTE> y </BLOCKQUOTE>, de ese modo se
consigue que el texto se presente con márgenes a ambos lados.
<BR> Este elemento sólo tiene marca inicial e indica un salto de línea, es decir un punto y aparte
sin separar el párrafo. Esta etiqueta no tiene su correspondiente de cierre
<HR> Se emplea para representar una línea horizontal. Tampoco tiene pareja de cierre. Se
pueden emplear los atributos
ALIGN="left" , ALIGN="right" , para alinearla a la izquierda o a la derecha. Por defecto aparece

centrada
WIDTH="66%" SIZE="3", para especificar el ancho en % y el alto en píxels
COLOR="#0000FF" , para especificar el color
Imágenes
La etiqueta para incluir una imagen es la siguiente:
<IMG SRC="URL"> (no tiene etiqueta de cierre)
donde URL es la dirección de la imagen. La URL puede ser relativa o absoluta. Unos ejemplos
aclararán este concepto:
<IMG SRC="gifs/nido.gif"> se verá como: . Esta es una dirección relativa.
<IMG SRC="http://spaceart.com/solar/raw/sat/saturn4.jpg"> insertaría en el lugar del

documento donde hubieras puesto la etiqueta una bonita foto de Saturno con dos de sus lunas
(Tetis y Dione), siempre que estuvieras conectado a Internet. Esta es una dirección absoluta, ya
que la dirección no depende del directorio donde esté ubicada la página que la contiene.
Página 5 de 38
Atributos de IMG
Los atributos de la imagen pueden ser los siguientes:
ALT="Texto que aparece al situar el cursor sobre la imagen"

También muestra este mismo texto en caso de que el navegador no cargue la
imagen.
ALIGN=
Nos indica la posición de la imagen respecto del texto. Después del signo igual,
pueden ir los valores:
TOP si queremos que el texto esté alineado con la parte superior de la imagen
MIDDLE alinea el texto con la parte central de la imagen
BOTTOM alinea el texto con la parte inferior de la imagen
LEFT alinea la imagen a la izquierda de la página forzando la colocación del texto
en la parte derecha y arriba
RIGHT alinea la imagen en la derecha de la página forzando la colocación del
texto en la parte izquierda y arriba.
Si se quiere interrumpir el proceso de rellenado del texto a los lados de la imagen, para
que salte hasta debajo de ella, es decir, dejar un espacio en blanco parcialmente, se
pueden emplear las siguientes extensiones de la etiqueta <br>:
<br clear =left > Busca el primer margen libre (clear) a la izquierda.
<br clear = right> Busca el primer margen libre a la derecha.
<br clear =all > Busca el primer margen libre a ambos lados.
WIDTH=80, HEIGTH=100
Indican la anchura y altura de la imagen en píxels, en este caso 80x100 píxels.
Si especificamos las dimensiones de las imágenes, las páginas se cargan más

rápido, debido a que el navegador reserva el espacio para ellas y sigue cargando
el texto
BORDER=2
Añade un borde, a modo de marco, a la imagen. En este caso de 2 píxels.
HSPACE=10 , VSPACE=15
Especifican el espacio horizontal y vertical que separa la imagen del texto que la
rodea, en este caso 10 píxels horizontales y 15 verticales
Formatos de imágenes
Existen muchos formatos para guardar imágenes que tienen diferentes extensiones bmp, tiff, dib,
wmf, etc. En internet se usan básicamente dos: GIF y JPG. Ambos formatos comprimen las
imágenes para reducir su tamaño, de este modo se asegura una transferencia más rápida por la
red. Esto es importante, ya que si la imagen se tarda en cargar, es posible que el visitante de
nuestra pàgina la abandone por ello. En los casos en que es necesario poner una imagen con
una resolución elevada para ver los detalles, es mejor colocar una imagen pequeña y usarla
como enlace que nos conduzca a la imagen final. De ese modo el visitante ya sabe la imagen
que va a cargar y puede ser más paciente.
Página 6 de 38
Esto se hace como vimos en la página de enlaces

<a href="URL de la imagen final"><img src="URL de la imagen que se ve con la página"></a>
Formato GIF
El formato GIF usa 256 colores y se emplea sobretodo con imágenes pequeñas como iconos. No
se suele usar con fotos porque da más calidad el formato JPG. Aunque el formato GIF no tiene
pérdidas de calidad en la compresión, es decir muestra la imagen tal como es en formato bmp
por ejemplo, pero reduciendo su tamaño considerablemente.
Tiene dos características que lo hacen muy atractivo para el diseño de las páginas Web.
Una de ellas, es que uno de sus colores se puede hacer transparente (en el subformato

Gif89a), no mostrándose en la pantalla. Si se elige el color que bordea el motivo principal da la
sensación de que la imagen tiene la forma de ese motivo ( en realidad todas las imágenes son
rectangulares). Puedes ver ese efecto en las pequeñas imágenes que adornan este manual.
Para hacer transparente un color hay que usar editores de imágenes, como por ejemplo:
LView en http://www.lview.com (Shareware, 21 días de prueba, 1.36 Mb)

Paint Shop Pro en http://www.jasc.com (Shareware, 30 días, 3.1 Mb)
o el más profesional Adobe Photoshop
Otra característica, es que se pueden ensamblar varias imágenes, que se muestran como
si fuera una sola, de modo que da la sensación de movimiento. Estas imágenes se
llaman Gifs animados y como ves también se pueden hacer transparentes. Hay programas
específicos para hacer Gifs animados, algunos son:
GIF Construction Set en http://www.mindworkshop.com/alchemy/gifcon.html (1.46 Mb,

Shareware)
WWW Gif Animator en http://stud1.tuwien.ac.at/~e8925005/ (277 Kb, Shareware)
También puedes encontrar imágenes ya creadas de todos los tipos en algunas páginas de
Internet, que son como bibliotecas de imágenes. Puedes mirar en
Icon Bazaar (http://www.iconbazaar.com/)
Rose's Backgrounds Archive (http://www.wanderers2.com/rose/animate.html)
Free graphics wonderland (http://www.jetlink.net/~gini/)
Rainfrog's Web Art (http://www.rainfrog.com/webart)
Fairy's Free Icons (http://www.dewa.com/freeicon)
GIF Animation Designs (http://www.webpromotion.com/stock.html
Icon Gallery (http://cool.deu.net/galerie/icon/menue_noframe.htm)
Over the Rainbow (http://www.geocities.com/SiliconValley/Heights/1272/rainbow.html)
Formato JPG
Página 7 de 38
El formato JPG usa 16.7 millones de colores, por lo que se emplea con imágenes de alta
resolución. Con este formato se obtiene un grado de compresión más alto que con
el GIF y además ésta se puede regular: Cuanto mayor sea la compresión, más pérdida
de calidad, respecto de la imagen original. De hecho cada vez que abrimos y guardamos
de nuevo una imagen en formato JPG, distorsionamos un poco la imagen.
Todas las fotos de buena calidad usan este formato.
Imágenes entrelazadas (GIF) y progresivas (JPG)
Cuando se carga una imagen normal en el navegador, éste va mostrándola de arriba a abajo . Se
puede conseguir que se visualize por capas. En la primera capa vemos la imagen de un modo
borroso y luego se va haciendo cada vez más nítida. Esto tiene la ventaja de que se da uno
cuenta enseguida, del tema de la imagen y si no es lo que buscas, puedes interrumpir la
descarga. Se puede conseguir en los dos formatos y es una característica muy conveniente en
las imágenes web
Ejemplos
Esta imagen tiene los atributos: align=left , hspace=10 ,

width=250 , hight=170 , border=1 , alt="Mono" y como
quiero que después de estos comentarios el texto salte
debajo de la imagen escribo:
<br clear=all>
Como ves, ésto está debajo de la foto
Esta otra tiene los

atributos: align=right , hspace=1 ,
border=5 , alt=" Aguila"
width=250 , height=165. También debería de escribir <br clear=all > para
que el final de página aparezca en su sitio. Como no lo hago queda a la
izquierda de la imagen. Fíjate en el borde
Multimedia
Página 8 de 38
De un modo similar a como se inserta una imagen se puede insertar un fichero de sonido o de
vídeo.
Sonido de fondo al cargar la página
En este caso la etiqueta depende del navegador, ya que se implementa de forma diferente en el
Explorer y el Netscape. Los formatos más usados son mid (para temas musicales sin
voces) , wav y au.
Netscape
La etiqueta básica para que se cargue el fichero de música con la página, sin intervención del
usuario, es en Netscape (siendo obligatorio especificar el tamaño):
<EMBED SRC="gifs/derroche.mid" WIDTH=144 HEIGHT=30>
En Netscape se verá para WIDTH=160 HEIGHT=70 como:
La etiqueta EMBED tiene multitud de atributos, he aquí algunos.
AUTOSTART= FALSE (por defecto) y TRUE. Este último hace que suene inmediatamente

después de cargar la página sin necesidad de pulsar el botón.
HIDDEN=TRUE, oculta la consola y sólo tiene este valor . Como no se podría activar el sonido
pulsando el botón, suene al cargar la página
LOOP=FALSE ,TRUE(por defecto),N para oir el fichero una vez, infinitas o el número que
especifiquemos en N
CONTROLS=SMALLCONSOLE, aparece una consola pequeñita
Si pones esta etiqueta, las versiones más recientes del Explorer (desde la 4.0) también la
interpretan correctamente, salvo LOOP. El Explorer lee el fichero una vez para LOOP=0 y lo
repite indefinidamente para N igual a otro valor cualquiera.
Explorer
El Explorer ofrece menos posibilidades para manejar estos ficheros. La etiqueta básica para que
se cargue la música con la página es:
Página 9 de 38
<BGSOUND SRC="fichero de sonido" LOOP= n ó INFINITE>
donde n es el número de veces que se oye el fichero: 1, 2, 3 ... o infinitas
Recuerda que sólo funciona en el Explorer
Sonido de fondo en los dos navegadores
Si deseas que suene la música al cargar la página con los dos navegadores debes escribir las
etiquetas para ambos.
Es decir debes poner:
<bgsound src="../gifs/houston.mid">
<embed src="../gifs/houston.mid" Hidden="true" >
para que suene una vez
o bien:
<BGSOUND SRC="../gifs/cantina.wav" LOOP=infinite>

<EMBED SRC="../gifs/cantina.wav" WIDTH=200 HEIGHT=55 AUTOSTART="true" LOOP="true"
HIDDEN="true">
para que se ejecute indefinidamente.
Aquí tienes algunos ejemplos de páginas con sonidos. Una vez cargadas utiliza el botón derecho
del ratón para ver el código fuente (el origen en Netscape).
 Página que carga sonido de fondo ( mid ) en los dos navegadores

(suena una sola vez)
 Página que carga sonido de fondo ( wav ) en los dos navegadores (se
repite una vez tras otra)
Sonido desde un enlace en la página
Si no quieres que se cargue la música con la página, algo que llega a resultar bastante pesado a
veces, debes poner un enlace al fichero de sonido, lo que funciona con ambos navegadores:
Netscape y Explorer.
Escucha Derroche de Ana Belén
También puedes poner cualquier otro tipo de ficheros de sonido, como mp3, que comprime hasta
12 veces la música, sin pérdida apreciable de calidad.
Página 10 de 38
Vídeo
El gran problema de los ficheros de vídeo es su

tamaño, ya que unos pocos segundos pueden
representar varios Mb (mega bytes) de tamaño.
Probablemente en el futuro se irá generalizando su
uso, ya que aumentará la velocidad en la Red. Los
formatos que se emplean son
variados: avi, mpeg, ram, mov, etc, que pueden
reproducir a la vez sonido y vídeo.
Los ficheros avi y mpeg se reproducen con el
Reproductor Multimedia de Windows, pero los demás
necesitan visores propios que se deben instalar
previamente. Por ejemplo los ficheros ram se
visualizan con Real Player, los mov con Quick Time,
etc.
Son los llamados plug-in
En Netscape, la etiqueta es muy parecida a la de
sonido, siendo obligatorio especificar también las dimensiones:
<EMBED SRC="video.avi" HEIGHT=300 WIDTH=400 AUTOSTART=false LOOP=false>
En explorer debes llamar al fichero con un enlace
<A HREF="gifs/jordan.avi">Mira el vídeo de Jordan</A>
lo que abrirá el programa asociado al tipo de vídeo elegido cuando lo pulses. En el Netscape
también puedes hacer esto mismo.
Si quieres probar aquí tienes un bonito aterrizaje del Columbia (para verlo necesitas estar
conectado a internet y ojo que son 708 KB)
STS-87 Columbia Landing (240x180 MPEG 708K)
Una tabla básica
Las tablas se usan con profusión en las páginas Web, muchas veces debido a que son el
único instrumento con el que se cuenta, para asegurarse que las cosas estarán en su
sitio. Para definir una tabla se usan las etiquetas:
Página 11 de 38
<TABLE> y </TABLE> son las etiquetas donde está contenida la tabla

<TR> y </TR> son las etiquetas que indican el comienzo y fin de una fila (<th> y </th> si
es una fila de cabecera)
<TD> y </TD> señalan una celda.
La tabla se va definiendo declarando una fila y a continuación las celdas que contiene
esa fila, luego otra fila y sus celadas, etc. No es necesario que todas las filas contengan
el mismo número de celdas.
La tabla (2x2) más sencilla que podemos hacer es la siguiente
Escribimos: Visualizamos
<TABLE >
<TR>
<TD>1 </TD> <TD> 2 </TD>
12
</TR> <TR>
34
<TD>3 </TD> <TD> 4</TD>
</TR>
</TABLE>
El resultado no es muy brillante, pero vamos a ir viendo las distintas posibilidades que tenemos
para mejorarlo.
Atributos de la etiqueta TABLE
Todos los atributos son opcionales
BORDER="4". Indica el tamaño del borde en píxels, en este caso 4. Si no se indica nada carece
de borde
WIDTH="5" o WIDTH="50%". Es el ancho de la tabla, puede especificarse en valor absoluto (5
píxels) o como un porcentaje (50% del ancho disponible)
CELLSPACING="2". Es el espacio entre las celdas, por defecto es 2
CELLPADDING="5". Es el espacio entre el contenido de las celdas y el borde de las mismas, por
defecto es 1
ALIGN=" left", "right", "center". Alinea la tabla a la izquierda , derecha o en el centro.
Otro ejemplo
<TABLE BORDER="3" CELLSPACING="5" 1 2
WIDTH="150"> 3 4
<TR>
<TD>1 </TD> <TD> 2 </TD>
Página 12 de 38
</TR> <TR>
<TD>3 </TD> <TD> 4</TD>
</TR>
</TABLE>
Atributos de las etiquetas de fila y celda
Las etiquetas que soportan las filas y las celdas son
WIDTH="30". Ancho de toda la fila o celda. También se puede dar en %

ALIGN=" left", "right", "center". Alinea el contenido a la izquierda, derecha o centro
VALIGN="top" , "middle" o "bottom". Alinea el contenido verticalmente arriba, en medio o abajo
BGCOLOR="#AACCEE". Pone un fondo del color especificado a la celda o fila
COLSPAN=3. Especifica el número de columnas que abarca la fila
ROWSPAN=2. Especifica el número de filas que abarca la columna
Tercer ejemplo. Fijate en la etiqueta TH, que sustituye a TR, resalta su contenido con negrita,
por eso se usa para los títulos
<TABLE BORDER="3" CELLSPACING="5"
WIDTH="200">
<TH COLSPAN=2 BGCOLOR="#6D8FFF> Este es el Este es el título
título</TH>
<TR align="center"> Esta es la celda
Esta es de la
<TD>Esta es la celda de la 1ª fila y de la 1ª columna</TD> de la 1ª fila y
1ª fila y de la
<TD> Esta es de la 1ª fila y de la 2ª columna</TD> de la 1ª
</TR> 2ª columna
columna
<TR BGCOLOR="#6D8FFF>
<TD>Esto está con un fondo azul</TD> Esto está con Y esto
<TD align="right" valign="bottom">Y esto también</TD> un fondo azul también
</TR>
</TABLE>
Como ves, se pueden ir modificando los comandos básicos para obtener la tabla que deseemos.
Es frecuente no escribir las etiquetas de cierre de fila y celda, los navegadores presentan la
tabla igual y nos ahorramos unas cuantas pulsaciones de teclas.
Otros usos de las tablas
Como dijimos, las tablas son a veces la mejor manera de asegurarnos que cada cosa esté en su
sitio. En esos casos toda la página es una tabla invisible y los distintos elementos aparecen
colocados en el sitio exacto mediante el uso de filas, columnas, sus dimensiones y alineamientos,
el espacio entre las mismas, etc.
Normalmente el ancho de esas tablas es de alrededor de 600 píxels para que la presentación
Página 13 de 38
sea similar en todos los monitores. Hay muchos ejemplos de este uso, sobretodo en las páginas
diseñadas por profesionales, observa sino la de El Pais o la de Microsoft
Como inconvenientes señalar que las tablas impiden el deslizamiento uniforme de la ventana,
cuando se desplaza con la barra y el tamaño de la página aumenta considerablemente.
Mapas sensibles
Los mapas sensibles son imágenes que presentan múltiples enlaces según la zona donde se
sitúe el cursor. Para conseguir esto se divide la imagen en zonas mediante las coordenadas de
las mismas.
Procedimiento
Primero conseguimos una imagen y la declaramos como mapa, en este caso con el nombre
de directorio
<IMG SRC="gifs/mapa.gif USEMAP="#directorio">
Abrimos el mapa recién creado
<MAP NAME="directorio">
Definimos las zonas del mapa y los enlaces que le asignamos a cada una.
<AREA SHAPE="forma de la zona" COORDS="coordenadas" HREF="URL asignada"

ALT="comentario">
Cerramos el mapa
</MAP>
Valores de SHAPE y COORDS
Los valores que pueden tomar la forma y las coordenadas son:
RECT. Rectángulo o cuadrado
COORDS="x,y,u,v" donde x,y son las coordenadas del vértice superior izquierdo del rectángulo y
u,v es el vértice inferior derecho. El origen de coordenadas 0,0 es el vértice superior izquierdo
Página 14 de 38
CIRCLE. Círculo
COORDS="x,y,z", donde x,y es el cetro de la circunferencia y z el radio
POLY. Línea poligonal cerrada
COORDS="X,x, Y,y, Z,z...,X,x", donde los pares X,x, Y,y, etc representan los vértices del
polígono. El primero coincidirá con el último.
DEFAULT. La zona no referenciada anteriormente
Para hallar las coordenada necesitarás un editor de imágenes, como los señalados en la página
de imágenes. Si te empeñas también puedes hacerlo a ojo, siempre que la imagen no sea muy
complicada, ya que cuando pulsas la zona en el navegador aparece definida un instante.
Ejemplo
Vamos a crear un mapa sensible con una imagen capturada del explorador de Windows95. Para
hacerlo pulsa la tecla Imprimir Pantalla (Print Screen SysRq) y luego pega la imagen capturada
con cualquier editor de imágenes. El Paint que viene con Windows 95 y 98 no vale ya que,
aunque captua la pantalla, luego no puedes guardar la imagen en formato gif o jpg. Usa el
Adobe Photoshop, el Paint Shop Pro o el Corel.
Vamos a crear un mapa que nos podría servir como menú en la página principal.
Para conseguir el mapa de la izquierda hemos escrito
<IMG SRC="gifs/mapa.gif" USEMAP="#directorio" ALIGN="left" HSPACE=20>

<MAP NAME="directorio">
<AREA SHAPE="RECT" COORDS="0,0,94,22" HREF="colores.htm">
<AREA SHAPE="RECT" COORDS="0,22,94,39" HREF="comienzo.htm">
<AREA SHAPE="RECT" COORDS="0,39,94,56" HREF="enlaces.htm">
<AREA SHAPE="RECT" COORDS="0,56,94,73" HREF="estructura.htm">
<AREA SHAPE="RECT" COORDS="0,73,94,90" HREF="formatos.htm">
<AREA SHAPE="RECT" COORDS="0,90,94,107" HREF="imagenes.htm">
<AREA SHAPE="RECT" COORDS="0,107,94,124" HREF="index.htm">
<AREA SHAPE="RECT" COORDS="0,124,94,141" HREF="listas.htm">
<AREA SHAPE="RECT" COORDS="0,141,94,158" HREF="mapas.htm">
<AREA SHAPE="RECT" COORDS="0,158,94,175" HREF="publicar.htm">
<AREA SHAPE="RECT" COORDS="0,175,94,192" HREF="tablas.htm">
<AREA SHAPE="RECT" COORDS="0,175,94,214" HREF="frames.htm">
</MAP>
No te asustes con tanto número, fíjate en las regularidades que presentan. La 1ª columna y la 3ª
indican donde empieza y donde acaba horizontalmente. La 2ª y la 4ª lo hacen en sentido vertical.
Página 15 de 38
Cualquiera de los programas citados anteriormente te indican las coordenadas de cualquier

punto de una imagen.
Fíjate también que la etiqueta inicial <IMG SRC...> es una etiqueta de imagen y como tal acepta
todos sus atributos.
Formularios
¿Cómo se hace un formulario?
He aquí los elementos básicos para la realización de un formulario
Abrir y cerrar un formulario
<FORM ACTION="mailto:tulogin@tuservidor.pntic.mec.es" METHOD="post"

ENCTYPE="text/plain">
...
</FORM>
Entre las etiquetas anteriores deben ir todas las etiquetas que generan los botones, casillas,
campos, etc. y también todas las etiquetas de HTML que permitan dar forma al formulario (tablas,
colores, etc)
El atributo ACTION nos indica la dirección de correo a la cual se van a enviar los datos del
formulario. Así pues debes sustituir tulogin@tuservidor.pntic.mec.es por tu dirección de correo.
Los atributos METHOD y ENCTYPE indican cómo se transferirán los datos (post, correo) y la

codificación del texto
El atributo HIDDEN no mostrará el campo en la página web, aunque sí enviará su contenido.
Entrada de texto de una línea
Página 16 de 38
<INPUT TYPE="text" SIZE="25" NAME="Nombre">
Esta etiqueta produce un campo similar al que se muestra debajo, para introducir texto (en este
caso el nombre), de una longitud de 25 caracteres.
Cuando nos llegue al buzón de correo el texto de este campo aparecerá asociado a la palabra
que pongamos en NAME (en este caso a Nombre)
Puede incluirse otro atributo opcional VALUE="Pon aquí tu nombre", en este caso
aparecería Pon aquí tu nombre dentro del campo
Entrada de texto de varias líneas
<TEXTAREA NAME="comentario" ROWS=3 COLS=50>
Introduzca aquí sus comentarios
</TEXTAREA>
Este código produciría el siguiente resultado:
Lista de opciones o menú desplegable
<SELECT NAME="estudios">
<OPTION SELECTED> ESO
<OPTION> Bachillerato
<OPTION> Ciclos Formativos
<OPTION> Garantía Social
</SELECT>
Que produciría un campo similar al siguiente:
ESO

donde ESO aparece seleccionada por defecto.
Una variante de las listas de opciones son los menús con barras de desplazamiento
Página 17 de 38
<SELECT NAME="americanos" SIZE=6> <OPTION>España

<OPTION>México
<OPTION>Argentina
<OPTION>Costa Rica
<OPTION>Panamá
<OPTION>Belice
<OPTION>Honduras
<OPTION>Bolivia
<OPTION>Chile
<OPTION>Paraguay
</SELECT>
que da como resultado una entrada del tipo
España
México
Argentina
Costa Rica
Panamá
Belice
Si en la etiqueta <SELECT ...> introducimos el atributo MULTIPLE: nos está permitido efectuar
selecciones múltiples.
<SELECT NAME="menu" SIZE=6 MULTIPLE>
Casillas de verificación o Checkboxes
< INPUT TYPE="checkbox" NAME="nivel" VALUE="eso"> ESO <BR>

< INPUT TYPE="checkbox" NAME="nivel" VALUE="bachiller"> Bachillerato <BR>
< INPUT TYPE="checkbox" NAME="nivel" VALUE="primaria"> Primaria <BR
Nos permite elegir entre varias posibilidades una o más casillas. Recibiremos como dato el valor
de la casilla señalada, asociada en este caso a nivel. Produciría un resultado como el siguiente:
ESO
Bachillerato
Primaria
Botones de radio o de opción
Página 18 de 38
< INPUT TYPE="radio" NAME="sexo" VALUE="hombre" CHECKED> Hombre

< INPUT TYPE="radio" NAME="sexo" VALUE="mujer" > Mujer
Similar al anterior, con la diferencia de que solo nos permite seleccionar una de las opciones
mostradas, se utiliza para mostrar opciones excluyentes entre si. Luce como:
Hombre
Mujer
Botones envío y borrado
Se utilizan las siguientes etiquetas para hacer los botones de Enviar y Borrar
< INPUT TYPE="submit" VALUE="Enviar">
< INPUT TYPE="reset" VALUE="Borrar">
Producirán uno botones como estos:
Enviar Borrar
Cuando presionemos "Enviar" se transferirá el contenido de los campos a la dirección de correo

indicada, por lo que necesitamos estar conectados a Internet para comprobarlo.
Si presionamos Borrar se borrará el contenido de los campos
Ejemplo
Sustituye los campos necesarios para colocarlo en tu página
<form action="mailto:tu@direccion.es" method="post" enctype="text/plain">

<center><table bgcolor="#cccccc" border="0" cellpadding="6"
cellspacing="0" width="400">
<tr>
<td align="right" valign="top"><b>Nombre</b></td>
<td><input type="text" size="25" name="Nombre"> </td>
</tr>
<tr>
<td align="right" valign="top"><b>E-mail</b></td>
<td><input type="text" size="25" name="e-mail"> </td>
</tr>
<tr>
Página 19 de 38
<td align="right" valign="top"><b>Especialidad</b></td>

<td><input type="text" size="25" name="Especialidad"> </td>
</tr>
<tr>
<td align="right" valign="top"><b>Centro de destino</b></td>
<td><input type="text" size="25" name="Centro"> </td>
</tr>
<tr>
<td align="right" valign="top"><b>Provincia</b></td>
<td><input type="text" size="25" name="Provincia"> </td>
</tr>
<tr>
<td align="right" valign="top"><b>Pulsa una vez</b> <b>></b> </td>
<td align="center"> <input
type="submit" name="Enviar datos" value=" Enviar "><input type="reset" value="Borrar"
name="B1"> </td>
</tr>
</table>
</center>
</form>
Pulsa aquí para ver cómo queda
Colores
Los colores se forman a partir de tres básicos, que son el rojo, verde y azul. La intensidad
de cada componente se expresa como un número hexadecimal del 00 al FF (del 0 al 255 en base
diez)
Los números hexadecimales, se forman utilizando 16 dígitos (en lugar de los diez de la
numeración decimal habitual o dos en la binaria). Estos dígitos son: 0 1 2 3 4 5 6 7 8 9 A B C D E
F
Así:, por ejemplo, el color rojo se representa como #FF0000, porque tiene el toda la
intensidad de rojo y nada de verde y azul.
Los colores basicos son:

#FF0000 - Rojo
#00FF00 - Verde
#0000FF - Azul
Página 20 de 38
Otros colores son:

#FFFFFF - Blanco
#000000 - Negro
#FFFF00 - Amarillo
Para hacer un color más oscuro, reduce la intensidad del componente, dejando los otros
dos iguales. Así, el rojo (#FF0000) se hace más oscuro así: #CC0000, #990000, #660000,
#330000 etc
Para hacer que un color más pastel, simplemente variar los otros dos colores dejando
igual el principal. Así, el rojo (#FF0000) se hace más claro asi: #FF3333, #FF6666, #FF9999,
#FFCCCC etc
Ejemplo 1: <FONT SIZE=+2 COLOR=#FF00FF>Esto esta en color fucsia</FONT>
Ejemplo 2: Este color es #C1E1F8
Paleta de colores
16 Colores estandar (4 bits)

BLACK NAVY BLUE TEAL AQUA
SILVER GRAY YELLOW GREEN OLIVE LIME
RED MAROON WHITE FUCHSIA PURPLE
256 Colores RGB (8 bits)

FF3300 CC3300 FF9999 FFCCCC 990033
RED FF3333 CC3333 FFCC99 CC0066 993300 MAROON
FF0000 FF0033 CC0033 FF9966 FF6699 660000 990000
000000 CC0000 663333 990066 330000
33FF33 66FF66 99FF99 CCFFCC
LIME 00CC00 009900 OLIVE 006600 003300 GREEN
66FF00 00CC00 009900 66FF00 006600 003300 00FF00
009900 006600 66FF00 009900
Página 21 de 38
00FFFF 3333FF 6666FF 9999FF

AQUA 33FFFF 66FFFF TEAL 99FFFF CCFFFF BLUE
00FFFF CCCCFF 0000CC 008080 000099 000099 0000FF
CCCCFF 000066 000033 000099
00CCCC 009999 006666 003333
FFFF33 FFFF66 FFFF99 FFFFCC
YELLOW
CCCC00 999900 666600 333300
FF33FF FF66FF FF99FF FFCCFF
FUCHSIA
CC00CC 990099 660066 330033
7D337D 7D667D 7D997D 7DCC7D
TEAL
E100E1 CC00CC AF00AF 990099
FF3300 FF3333 FF3366 FF3399 FF33CC FF33FF
FFCC00 FFCC33 FFCC66 FFCC99 FFCCCC FFCCFF
FFFF00 FFFF33 FFFF66 FFFF99 FFFFCC FFFFFF
CC0000 CC0033 CC0066 CC0099 CC00CC CC00FF
CCCC00 CCCC33 CCCC66 CCCC99 CCCCCC CCCCFF
CCFF00 CCFF33 CCFF66 CCFF99 CCFFCC CCFFFF
990000 990033 990066 990099 9900CC 9900FF
993300 993333 993366 993399 9933CC 9933FF
996600 996633 996666 996699 9966CC 9966FF
999900 999933 999966 999999 9999CC 9999FF
99CC00 99CC33 99CC66 99CC99 99CCCC 99CCFF
99FF00 99FF33 99FF66 99FF99 99FFCC 99FFFF
666600 666633 666666 666699 6666CC 6666FF
669900 669933 669966 669999 6699CC 6699FF
336600 336633 336666 336699 3366CC 3366FF
Página 22 de 38
339900 339933 339966 339999 3399CC 3399FF

006600 006633 006666 006699 0066CC 0066FF
009900 009933 009966 009999 0099CC 0099FF
663300 663333 663366 663399 6633CC 6633FF
660000 660033 660066 660099 6600CC 6600FF
333300 333333 333366 333399 3333CC 3333FF
003300 003333 003366 003399 0033CC 0033FF
330000 330033 330066 330099 3300CC 3300FF
000000 000033 000066 000099 0000CC 0000FF
Diccionario de Términos de Internet
A B C D E F G H I J L M N O P R S T U V W X Z
A
Analógico.- Representación de la información mediante una señal que varía de tamaño o
intensidad constantemente. (Lo contrario a digital).
Ancho de banda.- Cantidad de información que puede transmitirse a través de una conexión por
unidad de tiempo. Se suele medir en bits por segundo.
Página 23 de 38
ANSI.- (American National Standards Institute) Organismo americano dedicado a la

normalización. Por lo que nos ocupa, desarrolló un standard para representación de información
en la pantalla, en el terminal. Una BBS en modo ANSI o modo terminal, sería en modo texto.
APPLET.- Aplicacion escrita en JAVA y compilada.
ARPANET.- Advanced Research Projects Agency Network. Red de la Agencia de Proyectos de

Investigación Avanzada. Red militar Norteamericana a traves de lineas telefónicas de la que
posteriormente derivó Internet.
Archie.- Protocolo que sirve para localizar un archivo en algún servidor FTP. También suelen
llevar este nombre los programas que utilizan el protocolo.
ASCII.- American Standard Code for Information Interchange. Estandar Americano para
Intercambio de Informacion. La tabla basica de caracteres ASCII esta compuesta por 128
caracteres incluyendo simbolos y caracteres de control. Existe una version extendida de 256
Asíncrona.- Tipo de comunicación donde cada byte se transmite del emisor al receptor de modo
independiente. Es la que utilizan los módems, por ejemplo.
ASN.- Autonomus System Number. Número de sistema autónomo. Grupo de Routers y redes
controlados por una única autoridad administrativa.
ATM.- Asyncronous Transmision Mode. Modo de Transmisión Asíncrona. Sistema de tranmision

de datos usado en banda ancha para aprovechar al maximo la capacidad de una linea. Se trata
de un sistema de conmutacion de paquetes que soporta velocidades de hasta 1,2 Gbps.
Autopista de la información.- Expresión que acuñó Al Gore, vicepresidente de EE.UU.,

refiriéndose a Internet en especial, pero que engloba todos los servicios Online.
Subir
B
Backbone.- Línea de alta velocidad o conjunto de conexiones que distribuyen el tráfico de
paquetes a otras de menor capacidad, por ello suelen ser troncales.
Baudio.- Número de veces por segundo que la señal portadora cambia de valor. Se suele
confundir con los bps. Un ejemplo para clarificarlo : Un módem de 14.400 bps puede estar
funcionando a 1800 baudios, ya que es capaz de codificar 8 bits en cada cambio de valor de la
señal.
BBS.- (Bulletin Board System) Traducido, en ocasiones, como tablero electrónico. Es un sistema
Página 24 de 38
informático que ofrece una serie de servicios a sus usuarios : mensajería electrónica, ficheros,
teleconferencias, información, etc.
Binhex.- (BINary HEXadecimal). Algoritmo que permite codificar información binaria en formato
ASCII de siete bits (el que utilizan los PCs). Se emplea en el correo electrónico para los
caracteres especiales como letras acentuadas, la ñ, etc. Hay que recordar que el ASCII está
basado en el inglés.
BIOS.- Basic Input Output System. Sistema Básico de Entrada/Salida. Programa residente
normalmente en Eprom que controla la iteracciones básicas entre el hardware y el Software.
BIT.- (Binary Digit). Digito Binario. Unidad mínima de información, puede tener dos estados "0" o
"1".
Bookmark.- Marca. Anotación normalmente de una dirección WWW o URL que queda archivada
para su posterior uso.
Bps.- (Bits por segundo) Unidad de medida para la transmisión de información.
Browser.- Término aplicado normalmente a los programas que permiten acceder al servicio
WWW.
Subir
C
Cadena de inicialización.- En inglés "Init String". Grupo de órdenes que envía el programa de
comunicaciones al módem a fin de configurarlo.
Callback.- Sistema muy empleado en E.E.U.U. para llamadas internacionales consistente en

( previo abono) llamar a un Tlf. indicar el número con el que queremos contactar y colgar.
Posteriormente se recibe una llamada que nos comunica con el número deseado.
Carrier.- Operador de Telefonía que proporciona conexion a Internet a alto nivel.
Caudal.- Cantidad de ocupacion en un ancho de banda. Ej. En una linea de 1Mbps. puede haber
un caudal de 256Kbps. con lo que los 768Kbps. restantes de el ancho de banda permanecen
desocupados.
Cracker.- Individuo con amplios conocimientos informaticos que desprotege/piratea programas o

produce daños en sistemas o redes.
Chat.- Conversación electrónica en tiempo real a través de teclado y monitor. Puede
Página 25 de 38
establecerse entre 2 o más usuarios. En castellano se puede ver traducido como

teleconferencia.
CD.- Compact Disc. Disco Compacto. Disco Optico de 12 cm de diametro para almacenamiento
binario. Su capacidad "formateado" es de 660 Mb. Usado en principio para almacenar audio.
Cuando se usa para almacenamiento de datos genéricos es llamado CD-ROM.
CGI.- Common Gateway Interface. Interface de Acceso Común. Programas usados para hacer
llamadas a rutinas o controlar otros programas o bases de datos desde una página Web.
También pueden generar directamente HTML.
Ciberespacio.- Conjunto de todos los servicios telemáticos existentes, entre los cuales destaca
especialmente Internet.
CIR.- Commited Information Rate. Es el Caudal mínimo de información que garantiza el operador
telefónico al cliente (normalmente el proveedor de acceso) el resto del ancho de banda esta pues
sujeto al estado de la red y las necesidades del operador telefónico.
Cliente-servidor.- Arquitectura de comunicación remota entre programas. El cliente solicita datos

al servidor y los ejecuta. No es necesario que estén ejecutándose los dos a la vez. Se utiliza en
Internet, Eudora, por ejemplo, es un programa-cliente para recoger, enviar y gestionar correo
electrónico.
Conferencia o fórum.- Área de una BBS o servicio telemático que versa sobre un tema. Se
dejan mensajes públicos, que lee toda persona que se baja la conferencia.
COOKIE.- Pequeño trozo de datos que entrega el programa servidor de HTTP al navegador
WWW para que este lo guarde. Normalmente se trata de informacion sobre la conexion o los
datos requeridos, de esta manera puede saber que hizo el usuario en la ultima visita.
Correo electrónico.- (e-mail) Intercambio de mensajes entre usuarios de una red de

ordenadores, sea por cable (LAN, etc) o telemática (Internet, Compuserve, etc). En principio, sólo
es texto y de carácter privado. Pero a los mensajes se les puede vincular ficheros de cualquier
tipo y enviarlos juntos. Para poder enviar o recibir correo en Internet necesitamos un buzón o
dirección electrónica.
Subir
D
DialUp.- Acción de llamar un módem a otro módem a través de la RTC (Red Telefónica
Conmutada, la que usamos todos).
Página 26 de 38
Digital.- Representación de información de modo binario (2 estados). Es la que utilizan los

ordenadores.
DNS.- (Domain Name Service) Servicio que traduce los nombres como platea.pntic.mec.es a su
verdadero identificativo o dirección IP 193.144.238.1, y viceversa.
Domain.- Dominio. Sistema de denominacion de Hosts en Internet. Los dominios van separados
por un punto y jerarquicamente estan organizados de derecha a izquierda. ejp: pntic.mec.es
Dominio.- Permite identificar un ordenador o conjunto de ellos. Este nombre está estructurado
siguiendo una jerarquía. por ejemplo : mail.intercom.es. Mail = servidor de correo, intercom
=empresa y es= España.
Download.- Literalmente "Bajar Carga". Se refiere al acto de transferir un fichero/s desde un

servidor a nuestro ordenador. En español: " bajarse un programa ".
DUPLEX.- Capacidad de un dispositivo para operar de dos maneras. En comunicaciones se

refiere normalmente a la capacidad de un dispositivo para recibir/transmitir. Existen dos
modalidades HALF-DUPLEX: Cuando puede recibir y transmitir alternativamente y FULL-
DUPLEX cuando puede hacer ambas cosas simultaneamente.
DVD.- Digital Video Disk. Nuevo estandar en dispositivos de almacenamiento masivo con formato
de CD pero que llega a 17 GB de capacidad.
Subir
E
E-ZINE.- Electronic Magazine. Revista Electrónica. Cualquier revista producida para su difusión
por medios informáticos, pricipalmente por Internet.
E-mai.-l Electronic Mail. Correo Electrónico. Sistema de mensajeria informática similar en

muchos aspectos al correo ordinario pero muchisimo mas rapido.
Subir
F
FAQ.- (Frequently Asked Questions). Documento que recoge las preguntas más frecuentes sobre
un tema y, por supuesto, las respuestas.
Página 27 de 38
FAT.- File Allocation Table. Tabla de Localizacion de Ficheros. Sistema de organización de

ficheros en discos duros. Muy usado en PC.
FDDI.- (Fiber Distributed Data Interface) Norma que permite transferir datos a través de fibra
óptica a altísima velocidad (100 Mbps).
Finger.- Protocolo que permite saber quién está registrado en un ordenador de Internet, o quien
está conectado. Por razones de seguridad puede estar desactivado.
Frame.- Estructura. Tambien trama de datos. En Browsers de WWW como Netscape se refiere a
una estructura de sub-ventanas dentro de un documento HTML.
Frame Relay.- Protocolo de enlace mediante circuito virtual permanente muy usado para dar
conexion directa a Internet.
FTP.- (File Transfer Protocol). Protocolo empleado para la transferencia de ficheros en una red
TCP/IP. Requiere de identificación del usuario. En Internet hay los FTP anónimos, donde el
usuario utiliza el genérico "anonymous" y como password su dirección electrónica. También se
llama así el programa cliente para este servicio (ejemplo : CuteFTP), aunque los navegadores
como Netscape también pueden utilizar este servicio en la mayoría de los servidores FTP.
Subir
G
Gateway.- Elemento hardware y/o software con capacidad para traducir un protocolo de alto nivel
a otro.
GIF.- Graphics Interchange Format. Formato Grafico de Intercambio.
GIX.- Global Internet Exchange. Intercambio Global Internet.
GMT.- Greenwich Mean Time. Hora de Referencia de Greenwich. Equivalente a UT.
GSM.- Global System Mobile comunications. Sistema Global de Comunicaciones Moviles.

Sistema digital de telecomunicaciones pricipalmente usado para telefonia movil. Existe
compatibilidad entre redes por tanto un telefono GSM puede funcionar teóricamente en todo el
mundo. En EEUU esta situado en la banda de los 1900MHZ y es llamado DCS-1900.
GT.- Global Time. Tiempo Global. Sistema horario de referencia en Internet.
GUI.- Graphic User Interface. Interface Gráfico de Usuario.
Página 28 de 38
Gateway.- Prueta de Acceso. Dispositivo que permite conectar entre si dos redes normalmente
de distinto protocolo o un Host a una red. En Español: Pasarela.
Gopher.- Protocolo para navegar y buscar información organizada jerárquicamente y presentada

en modo texto.
Subir
H
Hacker.- Experto en informática capaz de de entrar en sistemas cuyo acceso es restringido. No
necesariamente con malas intenciones.
Hayes.- Marca de módems y lenguaje de comandos para manejar los módems. La mayoría de
modelos son compatibles con éste y es reconocido como estándar del mercado.
Header.- Cabecera. Primera parte de un paquete de datos que contiene información sobre las
caracteristicas de este.
Hit.- Literalmente "golpe". Se usa para referirse a cada vez que un link es pulsado en una página
WEB.
Homepage.- Página principal o inicial de un sitio WEB.
Host.- Ordenador que gestiona servicios para ser utilizados por el resto de máquinas conectadas
a la red. En un host encontraremos ficheros, servidores de correo, de Webs, etc, etc.
HTML.- HyperText Markup Language. Lenguaje de Marcas de Hypertexto. Lenguaje para

elaborar paginas Web actualmente se encuentra en su versión 4. Fue desarrollado en el CERN.
Gracias a él ves esta página.
HTTP.- HyperText Transfer Protocol. Protocolo de Tranferencia de Hypertexto. Protocolo usado

en la WWW para transmitir páginas Web.
Host.- Ordenador conectado a Internet. Ordenador en general. Literalmente anfitrión.
Subir
Página 29 de 38
Iberpac.- Red de Telefonica para la transmisión de datos en forma de paquetes,(normalmente en

X-25) principalmente de uso corporativo.
Ibernet.- Red española gestionada por telefónica con protocolo IP. Es la subred Internet
española.
Infovía.- Servicio de Telefónica, con contenidos y proveedores de información en línea. Una de

las características más importantes es que llamando al 055 se paga tarifa de llamada local,
¡¡desde cualquier lugar o pueblo de España !!. A través de Infovía se puede entrar en Internet y
este es el medio más habitual (tarifas: horario normal > 139 ptas/hora y horario reducio > 106
ptas/hora )
Internet.- INTerconnected NETworks. La red de redes.
INTRANET.- Se llaman asi a las redes tipo Internet pero que son de uso interno, por ejemplo, la
red corporativa de una empresa que utilizara protocolo TCP/IP y servicios similares como WWW.
IP address.- Expresión compuesta por cuatro números separados por puntos y que designan de
manera unívoca a un ordenador en la Internet. Para que no sea un caos, estos números los
coordina una sociedad llama InterNIC. IP (Internet Protocol) es el protocolo que permite
conectarse dos ordenadores.
IRC.- Internet Relay Chat. Canal de Chat de Internet. Sistema para transmisión de texto
multiusuario a traves de un servidor IRC. Usado normalmente para conversar on-line tambien
sirve para tranmitir ficheros.
ISDN.- Integrated Services Digital Network. Red Digital de Servicios Integrados. En español
RDSI.
ISP.- Internet Service Provider. Proveedor de Servicios Internet.
Subir
J
JAVA.- Lenguaje de programacion orientado a objeto parecido al C++. Usado en WWW para la
telecarga y telejecucion de programas en el ordenador cliente. Desarrollado por Sun
microsystems.
JAVASCRIPT.- Programa escrito en el lenguaje script de Java que es interpretado por la

aplicacion cliente, normalmente un navegador (Browser).
Página 30 de 38
JPEG.- Join Photograph Expert Group. Union de Grupo de Expertos Fotográficos. Formato
gráfico con pérdidas que consigue elevados ratios de compresión.
Subir
L
LAN.- (Local Área Network) Red de Área Local. Como su nombre indica, es una red de
ordenadores de tamaño pequeño/medio localizada en un edificio (como máximo). Se conectan
los ordenadores a través de tarjetas de red, y las arquitecturas más conocidas son Ethernet y
Token-Ring.
Link.- Enlace. Unión. Se llama asi a las partes de una página WEB que nos llevan a otra parte de
la misma o nos enlaza con otro servidor.
Línea dedicada.- Línea telefónica que une permanentemente dos puntos. Ofrecen una mayor
velocidad que un módem (64 kbps, 256 kbps... hasta Gbps)... una de sus variantes es la más
conocida y utilizada por los proveedores de Internet : la línea punto a punto.
Linux.- Version Shareware del conocido systema operativo Unix. Es un sistema multitarea
multiusuario de 32 bits para PC.
Login.- Nombre o identificativo de usuario en un sistema remoto. También log in : acción de

conectarse a un ordenador.
Subir
M
Mailing list.- Direcciones de correo electrónico donde puedes suscribirte a recibir noticias sobre
determinados temas. Se utiliza el e-mail para recoger y mandar las noticias. Las más populares
listas de correo las encontraremos por listserv.
Majornet.- Red de correo entre las BBS que corren bajo el software WorldGroup o The Major
BBS (ambos de Galacticomm). Internet no es la única red de correos... también es muy conocida
y de ámbito mundial : Fidonet (Fido en la jerga de los cibernautas).
MIME.- (Multipurpose Internet Mail Extensions). Extensiones Multipropósito que permiten que
cuando enviemos un e-mail con un fichero binario vinculado, éste fichero llegue en su formato
original. (ver Uuencode/Uudecode).
Página 31 de 38
MMX.- Multi Media eXtensions. Extensiones Multimedia. Juego de instrucciones extra que
incorporan los nuevos microprocesadores Pentium orientado a conseguir una mayor velocidad de
ejecución de aplicaciones que procesan o mueven grandes bloques de datos
Módem.- (Modulador, DEModulador) Periférico que permite transmitir datos entre dos
ordenadores a través de una línea telefónica. Hoy en día, por precio y características, se
recomiendan los módems de alta velocidad, de 14400 bps en adelante. También la mayoría
tienen las normas para envío y recepción de fax.
MPEG.- Motion Pictures Expert Group. Grupo de Expertos en Imagen en Movimiento. Formato
gráfico de almacenamiento de video. Utiliza como el JPEG compresión con perdidas alcanzando
ratios muy altos.
MS-DOS.- Microsoft Disk Operating System. Sistema Operativo en Disco de Microsoft. Sistema
operativo muy extendido en PC del tipo de linea de comandos.
MTU.- Maximum Transmission Unit. Unidad Maxima de Transmision. Tamaño máximo de

paquete en protocolos IP como el SLIP.
Subir
N
Navegador.- Aplicado a los programas usados para conectarse al servicio WWW: Netscape
Comunicator, Internet Explorer, Mosaic, Opera
NET.- Red
Netiquette.- Etiqueta de la RED. Formas y usos comunes para el uso de los servicios de
Internet. Las normas de educación de los usuarios de Internet.
Netizen.- Ciudadano de la Red.
Netscape.- El nombre del navegador más utilizado de la red. Otros navegadores son : Mosaic, el
Internet Explorer y Opera
NEWS.- Noticias. Servicio de Internet con una estructura de "tablon de anuncios" dividido en
temas y paises en los que los usuarios con intereses comunes dejan o responden a mensajes
relacionados con el mencionado grupo.Tienen sus propios servidores, su propio protocolo
(NNTP) y sus propios programas-clientes (el más conocido : Free Agent).
Newsgroups.- Los distintos grupos de noticias de las News
Página 32 de 38
Nick.- Nombre o pseudónimo que utiliza un usuario de IRC.
Nodo.- Por definicion punto donde convergen mas de dos lineas. A veces se refiere a una única
máquina en Internet.
Subir
O
OEM.- Original Equipament Manufactured. Manufactura de Equipo Original. Empresa que compra
un producto a un fabricante y lo integra en un producto propio. Todos los fabricantes por ejemplo,
que incluyen un Pentium en su equipo actuan como OEM.
Offline.- Modo de interactuar con los servicios Online (BBS, Internet, etc), de tal manera que en
el disco local tenemos la información que necesitamos, la manipulamos sin necesidad de estar
conectados y la enviamos cuando queremos. Nuestra BBS se puede configurar para trabajar
Offline, Eudora y FreeAgent no necesitan estar conectados para leer el correo o las news, ni para
redactar mensajes.
OS2.- Operating System 2. Sistema operativo de 32 bits multitarea creado por IBM. Creado para
PC con entorno gráfico de usuario. La version actual es la 4 la cual soporta ordenes habladas y
dictado.
Subir
P
Paquete.- Cantidad minima de datos que se transmite en una red o entre disposi tivos. Tiene una
estructura y longitud distinta segun el protocolo al que pertenezca. Tambien llamado TRAMA.
PGP.- Pretty Good Privacity. Paquete de encriptacion basado en clave publica escrito por Phil
Zimmerman.
Phracker.- Pirata informatico que se vale de las redes telefonicas para acceder a otros sistemas
o simplemente para no pagar telefono.
PING.- Packet INternet Groper. Rastreador de Paquetes Internet. Programa utilizado para
comprobar si un Host esta disponible. Envia paquetes de control para comprobar si el host esta
activo y los devuelve.
Página 33 de 38
POP.- (Post Office Protocol). Es el que se utiliza para configurar los servidores de correo.
Nuestro POP server es el encargado de recibir el correo.
PPP.- (Point to Point Protocol). Protocolo de bajo nivel que permite transferir paquetes de
información a través de una línea asíncrona o síncrona. Es capaz de optimizar el uso de la línea
mediante conexión y desconexión dinámica, es la conexión más rápida para Internet y la utilizada
por casi todos los proveedores. El PPP es el programa que llama por teléfono, como puede ser el
Trumpet Winsock, el ConfigPPP del MacOS o el Acceso Telefónico a Redes de Windows 95
(Tipo de Servidor PPP).
Protocolo.- Conjunto de normas técnicas que regulan las comunicaciones entre ordenadores.
Proveedor.- Empresa que está conectada con una línea de alta velocidad a Internet, y que
permite el acceso a sus usuarios mediante módem, líneas dedicadas, etc. También puede
ofrecer servicios como servidor de ficheros, de páginas Web, asesoría sobre comunicaciones,
etc.
PROXY.- Servidor Cache. El Proxy es un servidor de que conectado normalmente al servidor de

acceso a la WWW de un proveedor de acceso va almacenando toda la informacion que los
usuarios reciben de la WEB, por tanto, si otro usuario accede a traves del proxy a un sitio
previamente visitado,recibira la informacion del servidor proxy en lugar del servidor real.
Puerto.- Todas las conexiones y diálogos TCP/IP se llevan a cabo sobre estos, y cada protocolo
para su uso tiene definido un puerto estándar.
Subir
R
RDSI.- (Red Digital de Servicios Integrados) Red que da soporte a varios canales digitales. La
RDSI básica tiene 2 de 64 kbps y uno de 16 kbps para señales de control. Ideal para imagen,
sonido y multimedia.
Router.- Dispositivo físico o lógico que permite encaminar la conexión entre redes TCP/IP, es el
encargado de que los paquetes de información lleguen a su destino.
RWIN.- Receive Window. Ventana de recepcion. Parametro de TCP que determina la cantidad
máxima de datos que puede recibir el ordenador que actúa como receptor.
Subir
Página 34 de 38
S
Servidor.- Ordenador que suministra información a otros ordenadores, los cuales ejecutan los
programas clientes.
SLIP.- (Serial Line Internet Protocol) Protocolo que permite transferir paquetes TCP/IP, permite
sólo transmisión asíncrona, direcciones IP, no tiene detección de errores y está menos
optimizado que el PPP.
SMTP.- (Simple Mail Transfer Protocol) Protocolo para transferir correo electrónico a través de
Internet.
SNMP.- (Simple Network Management Protocol) Protocolo que se encarga del direccionamiento
de red, se utiliza para grandes redes.
SysOp.- (System Operator) Persona responsable de la configuración, mantenimiento,

actualización y seguridad de un sistema telemático.
Subir
T
TCP/IP.- (Transmission Control Protocol/Internet Protocol) Conjunto de protocolos de bajo nivel
(IP, TCP, UDP, ICP, RARP, etc) que permiten el funcionamiento de Internet.
Telemática.- De Telecomunicaciones e Informática. Se refiere a las comunicaciones por

ordenador.
Telnet.- Protocolo y programas que permite la conexión remota a otro ordenador. Igual que FTP,
viene del UNIX (sistema operativo multitarea y multiusuario).
Time-out.- Parametro que indica a un programa el tiempo máximo de espera antes de abortar
una tarea o función. Tambien mensaje de error.
TTL.- Time To Live.Tiempo de Vida. Contador interno que incorporan los paquetes Multicast y
determinan su propagacion.
Subir
U
Página 35 de 38
UART.- (Universal Asynchronous Receiver/Transmitter) Circuito integrado en el módem o en la

controladora del puerto de comunicaciones que pasa los datos del ordenador al módem (de
digital y paralelo a analógico y serial) y viceversa.
UNIX.- Sistema operativo multitarea, multiusuario. Gran parte de las caracteristicas de otros
sistemas mas conocidos como MS-DOS estan basadas en este sistema muy extendido para
grandes servidores. Internet no se puede comprender en su totalida sin conocer el Unix, ya que
las comunicaciones son una parte fundamental en Unix.
URL.- (Uniform Resource Locator) Denominador y dirección de los recursos de Internet.

Ejemplos : http ://www.intercom.es o ftp://ftp.funet.fi
USB.- Universal Serial Bus. Bus Serie Universal.
UUCP.- (Unix to Unix Copy Program) Protocolo de AT&T para transferir archivos entre máquinas
UNIX. Muy utilizado para copiar news y correo electrónico, aunque tiende a desaparecer y queda
reservado a uso local.
Subir
V
Veronica.- (Very Easy Rodent Oriented Net-wide Index to Computerized Archives) Localizador
de servidores Gopher.
VR.- Virtual Reality. Realidad Virtual.
VRML.- (Virtual Reality Markup Language) Lenguaje para representar mundos virtuales en 3D a
través de Internet. Hace falta el programa cliente adecuado para visualizarlos e interactuar con
ellos.
Subir
W
WAIS.- (Wide Area Information Servers) Se trata de un método de búsqueda indexada de
información (texto, gráficos, sonido). El resultado de la búsqueda muestra una lista de artículos
ordenada por el grado de similitud con el ítem buscado.
WAN.- (Wide Área Network) Red de ordenadores extensa, se entiende que va más allá de un
Página 36 de 38
edificio.
WEB, WWW o W3.- El verdadero impulsor de la revolución Internet. Es el conjunto de recursos

que pueden ser accedidos por los programas clientes llamados navegadores o browsers. Se
caracteriza por la amigabilidad, facilidad de uso y espectacularidad de su presentación
hipermedia.
Webcam.- Cámara conectada a una página WEB a traves de la cual los visitantes pueden ver
imagenes normalmente en directo.
WINDOWS.- Pseudo sistema operativo. Más bien se trata de un entorno gráfico con algunas
capacidades multitarea. La version actual WINDOWS 95 funciona parcialmente a 32 bits.
WorldGroup Manager.- Software de BBS líder en EE.UU., y que es utilizado por Intercom para
su completo servicio Online.
WWW, WEB o W3 World Wide Web.- Telaraña mudial, para muchos la WWW es Internet, para
otros es solo una parte de esta. Podriamos decir estrictamente que la WEB es la parte de Internet
a la que accedemos a través del protocolo HTTP y en consecuencia gracias a Browsers
normalmente gráficos como Netscape.
Warez.- Software pirata. Programas comerciales originales, que son distribuidos de forma
gratuita en la Red. Bajarse estos programas es ilegal.
Subir
X
X25.- Protocolo de transmisión de datos muy usado en Iberpac. Establece circuitos virtuales,
enlaces y canales.
Subir
Z
ZIP.- Extensión de los ficheros comprimidos más usados en Internet. Un programa para
manejarlos: WinZip
Página 37 de 38
Página 38 de 38

Guia Introduccion HTML

Cargado por

Información del documento

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

Guia Introduccion HTML

Cargado por

Copyright:

Formatos disponibles

SERVICIO NACIONAL DE APRENDIZAJE SENA Versión: 02

SISTEMA INTEGRADO DE GESTIÓN

Listas con viñetas desordenadas

He aquí el ejemplo más sencillo de una de estas listas:

escribimos en html se verá como

escribimos en html se verá como

Otro atributo interesante es compact para reducir el espacio entre los elementos

Listas con viñetas ordenadas

escribimos en html se verá como

escribimos en html se verá como

Formatos del texto

<h2> Título </h2> Título

Otra forma es por medio de una referencia relativa:

El tamaño por defecto es el 3

El tipo de fuente es un atributo de FONT y tiene la siguiente sintaxis

Color de las fuentes

Es otro atributo de FONT. Mira en la página de colores para saber cómo se especifican

Como ves se pueden poner varios atributos separados por un espacio

ALIGN="left" , ALIGN="right" , ALIGN="center" y ALIGN="justify" para alinearlo a la izquierda, a la

<PRE> El texto insertado entre las marcas <PRE> y </PRE> será visualizado por el navegador

<BLOCKQUOTE> Se representa con tabulaciones a la izquierda y derecha. Toda los párrafos de

ALIGN="left" , ALIGN="right" , para alinearla a la izquierda o a la derecha. Por defecto aparece

WIDTH="66%" SIZE="3", para especificar el ancho en % y el alto en píxels

COLOR="#0000FF" , para especificar el color

La etiqueta para incluir una imagen es la siguiente:

<IMG SRC="URL"> (no tiene etiqueta de cierre)

<IMG SRC="gifs/nido.gif"> se verá como: . Esta es una dirección relativa.

<IMG SRC="http://spaceart.com/solar/raw/sat/saturn4.jpg"> insertaría en el lugar del

Los atributos de la imagen pueden ser los siguientes:

ALT="Texto que aparece al situar el cursor sobre la imagen"

Si especificamos las dimensiones de las imágenes, las páginas se cargan más

Esto se hace como vimos en la página de enlaces

Una de ellas, es que uno de sus colores se puede hacer transparente (en el subformato

LView en http://www.lview.com (Shareware, 21 días de prueba, 1.36 Mb)

o el más profesional Adobe Photoshop

GIF Construction Set en http://www.mindworkshop.com/alchemy/gifcon.html (1.46 Mb,

Todas las fotos de buena calidad usan este formato.

Imágenes entrelazadas (GIF) y progresivas (JPG)

Esta imagen tiene los atributos: align=left , hspace=10 ,

Como ves, ésto está debajo de la foto

Esta otra tiene los

Sonido de fondo al cargar la página

<EMBED SRC="gifs/derroche.mid" WIDTH=144 HEIGHT=30>

En Netscape se verá para WIDTH=160 HEIGHT=70 como:

La etiqueta EMBED tiene multitud de atributos, he aquí algunos.

AUTOSTART= FALSE (por defecto) y TRUE. Este último hace que suene inmediatamente

<BGSOUND SRC="fichero de sonido" LOOP= n ó INFINITE>

donde n es el número de veces que se oye el fichero: 1, 2, 3 ... o infinitas

Recuerda que sólo funciona en el Explorer

Sonido de fondo en los dos navegadores

para que suene una vez

<BGSOUND SRC="../gifs/cantina.wav" LOOP=infinite>

para que se ejecute indefinidamente.

 Página que carga sonido de fondo ( mid ) en los dos navegadores

Sonido desde un enlace en la página

El gran problema de los ficheros de vídeo es su

En Netscape, la etiqueta es muy parecida a la de

sonido, siendo obligatorio especificar también las dimensiones:

<EMBED SRC="video.avi" HEIGHT=300 WIDTH=400 AUTOSTART=false LOOP=false>

En explorer debes llamar al fichero con un enlace

<A HREF="gifs/jordan.avi">Mira el vídeo de Jordan</A>

STS-87 Columbia Landing (240x180 MPEG 708K)

Una tabla básica

<TABLE> y </TABLE> son las etiquetas donde está contenida la tabla