4° “F”

BACHILLERATO

Integrantes:

#31 Limón Avilés Jorge

#33 López Flores Sergio Arturo

#47 Téllez García Luis Fernando

Manual para crear un Página web

Í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

1

¿Cómo crear una página web? 1. Crear carpeta, de nombre “INDEX”

Ilustración 1: Crear carpeta

2. Abrir Word, ir al menú “vistas” y seleccionar “Diseño web”

Ilustración 2: Diseño web

Es muy

importante

desde un

inicio crear

la carpeta

2

¿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

3

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

4

7. Agregar los marcos depenediendo del diseño que se quiera obtener

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)”

Ilustración 8: Nombre de la carpeta

NOTA: Es

recomendable

poner solo 3

marcos

NOTA: Es

de suma

importan

cia

guardar

el archivo

con el

nombre

indicado

5

¿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ú

6

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

7

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

8

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

9

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

10

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

11

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”

12

¿Cómo insertar video en tu página web?

Ilustración 22: Insertar video

13

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

14

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

15

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

16

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

17

Í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