· Abrimos Wuala
· Abrimos Dreamweaver
· Creamos la carpeta de Practica12 en el usuario (ags2/web)
· Crear la carpeta con el mismo nombre en Wuala (Web/ Practica12)
· En dreamweaver vamos a Sitio/ Nuevo sitio o Administrar sitio y Nuevo
En esta práctica 12 tenemos un texto ya creado, el texto es de ipod y apple y lo que tenemos que hacer con él es, maquetarlo.
En anteriores post vimos unas etiquetas que servían para hacer cabeceras.
*· Cabecera:
<h> </h> o <h1> <h2> <h3> (para incluir varios títulos).Aunque si queremos ahorrarnos el incluir etiquetas, Dreamweaver nos da opciones para lo mismo.
Podemos Utilizar tantas cabeceras o títulos como queramos e iremos viendo el resultado en la pestaña "Diseño" y en la pestaña "Código"
Una vez tengamos todos los encabezados, tenemos una imagen en la carpeta img que va en la parte superior de la página.
· Vamos a "Insertar/ Imagen" e insertamos la imagen correspondiente.
· Una vez insertada la imagen, veremos en el código que nos señala el tamaño de la imagen y el nombre de la imagen, esta es la información que utiliza Dreamweaver para informarnos sobre la imagen que hemos puesto.
· Ahora vamos a la pestaña "Común" y buscamos la herramienta "Anclaje con nombre" y vamos al texto de la cabecera que queremos anclar (clicar al principio del título). Nos preguntará el nombre que le queremos poner y le ponemos el nombre de la cabecera (por ejemplo, "Divertirse").
En el inicio de la cabecera nos saldrá un icono con el dibujo de un ancla. Ejemplo:
· Ahora vamos a utilizar una herramienta nueva. Se encuentra en la parte inferior junto al puntero cuando seleccionamos la imagen. Con esta herramienta podremos hacer que en el lugar donde la apliquemos sea una imagen "Clicable".
· Cogemos la herramienta cuadrado por ejemplo y hacemos un cuadrado encima de la pantalla del ipod.
· Y a continuación le indicamos cuál será el destino de ese cuadrado. Por ejemplo, "Divertirse", "Divertirse" es el nombre del anclaje con nombre que le pusimos anteriormente. Si no se ha vinculado bien el cuadrado al título, podremos hacerlo con la herramienta siguiente:
Veremos que sale una flecha del icono que nos permite indicarle a qué lo queremos vincular.
· Cada zona de la imagen la vinculamos con un título.
Esto lo haremos con tantos títulos o cabeceras tengamos.
Cuando naveguemos por esta página que hemos creado, ocurre que una vez hayamos llegado al final de la pagina, para volver al inicio de esta misma debemos mover la barra lateral o usar la rueda del ratón, pero eso lo podemos solucionar de forma fácil.
· Escribimos abajo de todo, o donde nos interese, la palabra Inicio por ejemplo y vamos a la parte superior del todo, donde la imagen del ipod y seleccionamos en la parte donde no hay la imagen, ahí incluimos un anclaje que le llamamos "inicio" aceptamos y volvemos a abajo, donde Inicio y seleccionamos la palabra y veremos que en el menú de abajo nos dice, "Vínculo" y escribimos "inicio" o utilizamos la herramienta que nos da Dreamweaver para vincular.
· Una vez hecho, vamos a archivo, vista previa en el navegador y ya podremos ver como ha quedado nuestra página.
Guardamos la pagina como index.html
No hay comentarios:
Publicar un comentario