1. 4° “F”
Manual para crear un Página web
BACHILLERATO
Integrantes:
#31 Limón Avilés Jorge
#33 López Flores Sergio Arturo
#47 Téllez García Luis Fernando
2. ÍNDICE
¿Cómo crear una página web?............................................................................................................ 1
¿Cómo poner marcos en tu página web? ....................................................................................... 2
¿Cómo diseñar tu página?............................................................................................................... 5
¿Como insertar la información en el menú correspondiente? ....................................................... 6
¿Cómo poner alguna tabla en tu página? ....................................................................................... 8
¿Cómo insertar video en tu página web? ..................................................................................... 12
Archivo de PDF. ............................................................................................................................. 16
3. ¿Cómo crear una página web?
1. Crear carpeta, de nombre “INDEX”
Es muy
importante
desde un
inicio crear
la carpeta
Ilustración 1: Crear carpeta
2. Abrir Word, ir al menú “vistas” y seleccionar “Diseño web”
Ilustración 2: Diseño web
1
4. ¿Cómo poner marcos en tu página web?
3. Ir al menú “Personalizar barras de herramientas de acceso rápido” y seleccionar la opción
“Más comandos”
Ilustración 3: Selección de marcos
4. Seleccionar opción “Todos los comandos”
Ilustración 4: Opción de marcos
2
5. 5. Buscar en la lista seleccionada los siguienetes 5 marcos, agregarlos y aceptar
Ilustración 5: Marcos que se utilizan
6. Una vez seleccionados aparecerán estos 5 iconos
Ilustración 6: Barra de selección de marcos
3
6. 7. Agregar los marcos depenediendo del diseño que se quiera obtener
NOTA: Es
recomendable
poner solo 3
marcos
Ilustración 7: Nombre de los marcos
8. Guardar este archivo en la carpeta creada al inicio,con el nombre “INDEX” y cambiar el
tipo de archivo a “página web (html)”
NOTA: Es
de suma
importan
cia
guardar
el archivo
con el
nombre
indicado
Ilustración 8: Nombre de la carpeta
4
7. ¿Cómo diseñar tu página?
9. Ir al menú “Diseño de página” y seleccionar el colo de página de tu agrado
Ilustración 9: Diseño de página web
10. Ir al menú “Insertar” y escoger el tipo de forma que gustes para el menú de tu página
Ilustración 10: Diseño de Menú
5
8. 11. Escribir le texto dentro de la forma que elegiste para tu menú
Ilustración 11: Nombre del menú
12. Escribir el texto de la página principal
¿Como insertar la información en el menú correspondiente?
Ilustración 12: Insertar información
6
9. 13. Abrir otro documento en word, escrbir la informacón del primer menú y seleccionar el
icono de “Diseño web”
Ilustración 13: de word a página web
7
10. 14. Diseñar la página de acuerdo a tu gusto
Ilustración 14: Diseño de tu pagina web
¿Cómo poner alguna tabla en tu página?
15. Puedes poner alguna tabla en el menú “Insertar Tabla”
Ilustración 15: Insertar tabla
8
11. 16. Guardar el documento con el mismo nombre que aparece en el menú, cambiando el tipo
de archivo a “Página web html”, en la carpeta creada al inicio
Ilustración 16: Como guardar los documentos
17. Se puede poner un “Smart Art” en el menú “insertar smartart”
Ilustración 17: Insertar smartArt
9
12. 18. También se puede agregar una gráfica en el menú “insetar Gráfica”
Ilustración 18: Insertar gráfica
19. Para insertar un hipervinculo seleccionar el menú correspondiente, dar cick derecho e ir a
“hipervinculo”
Ilustración 19: Poner hipervínculos
10
13. 20. Una vez abierto el menú correspondiente seleccionar el archivo al que se quiera tener
acceso
Ilustración 20: Seleccionar el archivo de acceso
21. Iremos a marco de destino y seleccionamos la opciòn del centro para que ahì aparezca la
informaciòn y damos en aceptar.
Ilustración 21: Seleccionar el marco correspondiente
NOTA: Es de
mucha
importancia
seleccionar la
opción “ marco de
destino”
11
15. 22. Es importante tener el video en la misma carpeta que todos los documentos para tu
página web
Ilustración 23: insertar el video en la carpeta de página web
23. Abrir el documento donde se quiera inserta el video en “Bloc de notas”
Ilustración 24: abrir bloc de notas
13
16. 24. Buscar en la parte inferior la parte “</body> </html> “
Ilustración 25: Insertar clave de video
25. Abrir tu página en internet explorer y si aparece este aviso dale click en “Permitir
contenido bloqueado…”
Ilustración 26: Insertar video en el archivo que gustes
14
17. 26. Escribir entre los dos caracteres anteriores la siguiente fórmula “<embed src=(escribir
entre comillas el nombre del video seguido del formato que tenga) width=(el ancho del
video que aparezca en la pantalla) heigth=(la altura del video que aparezca en la
pantalla)>
Ilustración 27: Insertar los caracteres del video
15
18. 27. Si realizaste correctamente el procedimiento tu video debe aparecer en tu página web
Ilustración 28: Como quedo el video
Archivo de PDF.
28. Debes guardar tu archivo y convertirlo a “PDF”
Ilustración 29: Insertar un PDF
16
19. Índice De Ilustraciones
Ilustración 1: Crear carpeta ................................................................................................................. 1
Ilustración 2: Diseño web .................................................................................................................... 1
Ilustración 3: Selección de marcos ...................................................................................................... 2
Ilustración 4: Opción de marcos.......................................................................................................... 2
Ilustración 5: Marcos que se utilizan................................................................................................... 3
Ilustración 6: Barra de selección de marcos........................................................................................ 3
Ilustración 7: Nombre de los marcos .................................................................................................. 4
Ilustración 8: Nombre de la carpeta.................................................................................................... 4
Ilustración 9: Diseño de página web ................................................................................................... 5
Ilustración 10: Diseño de Menú .......................................................................................................... 5
Ilustración 11: Nombre del menú ....................................................................................................... 6
Ilustración 12: Insertar información.................................................................................................... 6
Ilustración 13:de word a pagina web .................................................................................................. 7
Ilustración 14: Diseño de tu pagina web ............................................................................................. 8
Ilustración 15: Insertar tabla ............................................................................................................... 8
Ilustración 16: Como guardar los documentos ................................................................................... 9
Ilustración 17: Insertar smartArt ......................................................................................................... 9
Ilustración 18: Insertar gráfica .......................................................................................................... 10
Ilustración 19: Poner hipervínculos................................................................................................... 10
Ilustración 20: Seleccionar el archivo de acceso ............................................................................... 11
Ilustración 21: Seleccionar el marco correspondiente...................................................................... 11
Ilustración 22: Insertar video ............................................................................................................ 12
Ilustración 23: insertar el video en la carpeta de página web .......................................................... 13
Ilustración 24: abrir bloc de notas .................................................................................................... 13
Ilustración 25: Insertar clave de video .............................................................................................. 14
Ilustración 26: Insertar video en el archivo que gustes .................................................................... 14
Ilustración 27: Insertar los caracteres del video ............................................................................... 15
Ilustración 28: Como quedo el video ................................................................................................ 16
Ilustración 29: Insertar un PDF .......................................................................................................... 16
17
