![Page 1: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/1.jpg)
Junio 2: Desarrollo del proyecto en la sala 3Junio 9: Continuación del proyecto en la sala 3Junio 16: Examen Final. Sala 3.
Entrega del proyecto (se indica el URL donde reside la página)
![Page 2: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/2.jpg)
HTML(Hyper Text Markup
Language)
![Page 3: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/3.jpg)
HTML
•Lenguaje para estructurar documentos.
•Los documentos se visualizan a través de navegadores (browsers).
•Consta de una serie de etiquetas (Tags) que le indican al navegador la forma cómo se representan los elementos contenidos en los documentos.
![Page 4: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/4.jpg)
HTML
•Sintaxis de las etiquetas HTML:
<etiqueta> contenido </etiqueta>
<TITLE> Curso ITI </TITLE>
<H1> Introducción al lenguaje HTML </H1>
![Page 5: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/5.jpg)
<HTML>
<HEAD>
<TITLE> Curso ITI – Lenguaje HTML </TITLE>
</HEAD>
<BODY>
Cuerpo de la página
</BODY>
</HTML>
![Page 6: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/6.jpg)
HTML<H1>
Permite colocar el texto que se encuentra entre las etiquetas de inicio y de fin, en un tamaño y formato diferente
<BR>
Etiqueta que no requiere ser cerrada y que permite un salto de línea
![Page 7: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/7.jpg)
HTML<CENTER>
Permite centrar el texto que se encuentra entre las etiquetas de inicio y de fin
<FONT size="4" color="blue">
Permite establecer el color, estilo y tamaño de la fuente
![Page 8: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/8.jpg)
HTML<BODY bgcolor="black">
Permite establecer el color del fondo de la página
<BODY background=“nombreImagen.jpg">
Establece una imagen como fondo
![Page 9: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/9.jpg)
HTML
<IMG src=“nombre.jpg" ALT=“Comentario" >
Inserta la imagen nombre.jpg en la página.
ALT permite colocar un mensaje que se visualizará cuando se pase el ratón sobre la imagen
![Page 10: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/10.jpg)
HTML<HR>
Inserta una línea horizontal
![Page 11: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/11.jpg)
HTML
<A HREF=“inicio.html"> Inicio </A>
Crea un hiperenlace a la página llamada exactamente con el nombre inicio.html. El enlace aparecerá con el nombre de “Inicio”.
![Page 12: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/12.jpg)
HTML
<A HREF=“http://www.google.com”> Google </A>
Crea un enlace a la página http://www.google.com
El enlace aparecerá con el nombre “Google”
![Page 13: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/13.jpg)
HTML
<A HREF="http://www.google.com">
<IMG src="google.gif">
</A>
Crea un enlace a la página "http://www.google.com"
El enlace aparecerá como la imagen del archivo llamado google.gif
![Page 14: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/14.jpg)
HTML
<A HREF=“EstructuraTematica.odp">
Estructura temática
</A>
Crea un enlace a un archivo. Este enlace, permite que se descargue el archivo
![Page 15: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/15.jpg)
HTML
<A HREF=mailto:[email protected] > Oscar Bedoya
</A>
Crea un enlace a una dirección de correo electrónico
![Page 16: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/16.jpg)
HTMLManejo de viñetas
Se utiliza la etiqueta <ul>
<ul>
<li> Windows </li>
<li> Linux </li>
<li> Unix </li>
</ul>
![Page 17: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/17.jpg)
HTMLManejo de Listas ordenadas
Se utiliza la etiqueta <ol>
<ol>
<li> Windows </li>
<li> Linux </li>
<li> Unix </li>
</ol>
![Page 18: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/18.jpg)
HTMLManejo de tablas
<TABLE> para la definición de la tabla
<TR> para la creaciones de cada fila
<TD>Aca se pone el texto de la celda </TD>
![Page 19: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/19.jpg)
HTML<TABLE border="1" >
<TR>
<TD> Esta es la celda 1,1 </TD>
<TD> Esta es la celda 1,2 </TD>
<TD> Esta es la celda 1,3 </TD>
</TR>
<TR>
<TD> Esta es la celda 2,1 </TD>
<TD> Esta es la celda 2,2 </TD>
<TD> Esta es la celda 2,3 </TD>
</TR>
</TABLE>
Indica que comienza un fila
Indica que comienza una fila
![Page 20: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/20.jpg)
HTML<b> Texto </b>
Negrita
<u>Texto </u>
Subrayado
<i> Texto </i>
Cursiva
![Page 21: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/21.jpg)
HTMLPara colocar la a con tilde: á
Información
Para colocar la ñ: ñ
![Page 22: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/22.jpg)
HTML
<img src=“nombre.jpg” width=“200” height=“150” alt=“Comentario” >
Permite establecer las dimensiones de la imagen
![Page 23: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/23.jpg)
HTML<bgsound src=“musica.mp3" loop=infinite>
Incluir sonido en Internet Explorer
<EMBED SRC=“musica.mp3" autostart=true></EMBED> Incluir sonido en Netscape, Mozilla
<EMBED SRC=“video.mpg" HEIGHT=110 WIDTH=220> </EMBED>
Incluir un video. Los videos tienen extensión avi o mpg.
![Page 24: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/24.jpg)
HTML•¿Cómo publicar la página para que esté disponible en Internet?
•En su cuenta cree un directorio llamado public_htmlpublic_html
•Coloque en la carpeta public_html los archivos html, las imágenes y todos los archivos que se solicitan para la presentación del proyecto
•Escriba en un terminal
fs sa . system:anyuser l
fs sa public_html system:anyuser rl
![Page 25: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/25.jpg)
HTML•¿Cómo publicar la página para que esté disponible en Internet?
•La dirección de la página será: http://malpelo/~u0309555/http://malpelo/~u0309555/
![Page 26: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/26.jpg)
![Page 27: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/27.jpg)
menu.html
![Page 28: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/28.jpg)
inicio.html
![Page 29: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/29.jpg)
index.html: es la página principal que integra el menú y la zona de despliegue
![Page 30: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/30.jpg)
<HTML> <HEAD> <TITLE> Menu </TITLE> <HEAD><BODY bgcolor="black">
<FONT size="4" color="white" >
GUINNESS RECORDS DISPONIBLES<br><A HREF="nails.html" target="iti"> Fingernails</A> <br><br><A HREF="coin.html" target="iti"> Coin </A> <br><br><A HREF="bowling.html" target="iti"> Bowling </A><br><br><A HREF="math.html" target="iti"> Math </A><br><br><A HREF="cards.html" target="iti"> Memory </A><br><br><A HREF="mind.html" target="iti"> Mind </A><br><br>
</BODY></HTML>
menu.html
![Page 31: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/31.jpg)
<HTML> <HEAD> <TITLE> Proyecto I.T.I. </TITLE> </HEAD>
<FRAMESET cols="200,*"> <FRAME SRC="menu.html"> <FRAME SRC="inicio.html" name="iti" noresize> </FRAMESET>
</HTML>
index.html
![Page 32: Junio 2: Desarrollo del proyecto en la sala 3 Junio 9: Continuación del proyecto en la sala 3 Junio 16: Examen Final. Sala 3. Entrega del proyecto (se](https://reader036.vdocuments.co/reader036/viewer/2022062309/5665b4351a28abb57c8ffbf6/html5/thumbnails/32.jpg)
Nombres y códigos
DocumentaciónDocumentación
Este enlace debe permitir la descarga de cada uno de los documentos a entregar