ESTEBAN DE LA CRUZ

1. Superación 1º - 2º - 3º Esp. Jairo Segundo Inagan Rodriguez
REF: 270709_4P
 Tutoriales Planos y Multimediales (TP&M)
Lección 01. Concepto de tutorial
Nombre: Grado:
Esteban Emilio de la cruz 10 computación
Tarea 01. Clases de Tutoriales
1. En las actividades y/o tareas del año escolar se te ha solicitado diseñar un tutorial paso a
paso utilizando un procesador de texto (Microsoft Word) y capturando pantallas, busca en
tus archivos de USB o disco duro virtual o plataforma comatfis un archivo con un tutorial
ya elaborado y preséntalo al profesor llenando los siguientes datos:
Tutorial Plano (Imprimible o paso a paso)
Nombre del
tutorial: Creación de una pagina web
Área: Programación
Autor: Esteban Emilio de la cruz
710 KB
Formato Fecha de 4 de agosto de
Tamaño: (727.040 Doc.
: creación: 2009
bytes)
I.E.M. LEMO – Pasto 2009 1

2. Superación 1º - 2º - 3º Esp. Jairo Segundo Inagan Rodriguez
Voy a inicio todos los programas y después buscamos accesorios y
abrimos el blog de notas
I.E.M. LEMO – Pasto 2009 2

3. Superación 1º - 2º - 3º Esp. Jairo Segundo Inagan Rodriguez
Luego de abrir el blog de notas escribimos la etiqueta principal que es HTML
que va encerrada entre los signos menor que (<) y el mayor que (>)
Todas estas etiquetas se las debe encerrar con este símbolo (/) HTML nos
cierra y nos abre los documentos
I.E.M. LEMO – Pasto 2009 3

4. Superación 1º - 2º - 3º Esp. Jairo Segundo Inagan Rodriguez
Luego escribimos la etiqueta head abriéndola y cerrándola con el símbolo
que les di anteriormente luego escribimos la etiqueta body abriéndola y
cerrándola y dentro de la etiqueta head esta la etiqueta title abriéndola y
cerrándola esta etiqueta se la conoce como titulo y en medio de ellas la le
puedo escribir cualquier tipo de titulo en mi caso mi pagina web lemo
I.E.M. LEMO – Pasto 2009 4

5. Superación 1º - 2º - 3º Esp. Jairo Segundo Inagan Rodriguez
El titulo anterior es el que aparece en la parte de arriba del navegador y si
escribimos dentro de las etiquetas body es lo que va a visualizar la persona
que vea esa pagina
I.E.M. LEMO – Pasto 2009 5

6. Superación 1º - 2º - 3º Esp. Jairo Segundo Inagan Rodriguez
Lugo vamos a archivo guardar como y abrimos la carpeta donde queramos
guardar y le ponemos en guardar mi pagina.html esto es muy importante
que recuerden que deben colocar .HTML por que si se olvidan de esto el
documento se va a guardar como un documento de texto y no como una
pagina y después le damos guardar
I.E.M. LEMO – Pasto 2009 6

7. Superación 1º - 2º - 3º Esp. Jairo Segundo Inagan Rodriguez
Luego voy al navegador le doy archivo abrir luego examinar y la buscamos
la pagina donde la tenemos y la abrimos
I.E.M. LEMO – Pasto 2009 7

8. Superación 1º - 2º - 3º Esp. Jairo Segundo Inagan Rodriguez
Y esto fue lo que asimos hasta el momento
I.E.M. LEMO – Pasto 2009 8

9. Superación 1º - 2º - 3º Esp. Jairo Segundo Inagan Rodriguez
Luego vamos a ver los atributos que tiene la etiqueta body dentro de esta
etiqueta le vamos a colocar el atributo bgcolor este atributo nos sirve para
cambiar el color del fondo de la pagina y le doy guardar
I.E.M. LEMO – Pasto 2009 9

10. Superación 1º - 2º - 3º Esp. Jairo Segundo Inagan Rodriguez
Y después me dirijo a mi página y le doy actualizar o la tecla F5 que esta en
la parte superior del teclado del computador y actualiza la pagina como
pueden ver en la siguiente grafica yo le di un color rojo pero pueden colocar
cualquier tipo de color que les guste
Luego le vamos a colocar la etiqueta text con esta le podemos cambiar el
color del texto así
I.E.M. LEMO – Pasto 2009 10

11. Superación 1º - 2º - 3º Esp. Jairo Segundo Inagan Rodriguez
Con esto terminamos este tutorial paso a paso espero que les sirva mucho
I.E.M. LEMO – Pasto 2009 11