Page 1

Video tutorial de dreamweaver. Hola soy Nerea y mi video tutorial trata de explicar como hacer un ejercicio o tarea básica utilizando algunas de las herramientas que nos ofrece el programa dreamweaver, con el que vamos a trabajar. 1º: Nos posicionamos en el escritorio. Para posteriormente accionar el botón de dreamweaver.

2º: Situamos el cursor encima del botón de dreamweaver, hacemos doble click. A continuación se nos abrirá esto.


3ยบ: Puede tardar unos segundos, hasta que el programa reaccione. Una vez abierto...


4º: Una vez transcurridos esos segundo se nos abrira esta pestaña. En la que accionaremos el icono de HTML.

5º: Se nos abre una página en blanco, con la que empezaremos a trabajar. Utilizando algunas de la herramientas que nos proporciona el programa dreamweaver.


6ยบ: Empezamos escribiendo el titulo de nuestro trabajo en nuestro caso "MI PรGINA".


7º: Una vez tengamos el titulo de nuestro trabajo escrito en el HTML, vamos a editar este titulo. Dando en primer lugar a "propiedades de la página".

8º: Se nos abrirá esta pestaña en la cual trabajaremos con "color de texto".


9ยบ: Hacemos doble click sobre "color texto", en la cual nos aparecera una tabla de colores.


10ยบ: Vamos a elegir un color en este caso un azul cielo con referencia #00CCCC.

11ยบ: Al hacer doble click sobre el color que hemos seleccionado para nuestro texto, se nos quedarรก de esta manera.


12ยบ: Como ya tenemos todos los requisitos para poner un color en nuestro texto damos a "Aceptar".

13ยบ: Se nos quedarรก de esta manera (aparece con el color que anteriormente.


14º: Vamos a crear una carpeta para ahí guardar todas las imagenes con la que vamos a trabajar, damos al boton derecho del ratón y nos aparecera esta ventana.

15º: Damos a "nuevo", "carpeta".


16ยบ: Una vez dado a "nuevo, carpeta" se nos creara una carpeta que posteriormente editaremos (esta se nos siturรก en el escritorio).

17ยบ: Como anteriormente e dicho vamos a editar la carpeta poniendola un titulo diferente en este caso "WINK".


18ยบ: Vamos a buscar en internet unas imagenes con la que trabajaremos en el dreamweaver. Para acceder a internet damos al icono de "Google chrome".

19ยบ: Para trabajar de manera mas cรณmoda podemos utilizar una de las herramientas que nos proporciona el programa dream. Damos a a "escritorio".


20ยบ: Damos a "administrar sitios", haciendo doble click.

21ยบ: Seleccionamos el icono "nuevo", haciendo de nuevo doble click.


22º: Damos a "sitio" repitiendo los mismos pasos que anteriormente.

23º: Se nos abrirá esta pestaña, en la cual seleccionaremos la opción "avanzadas".


24ยบ: Vamos a poner un nombre al sitio en nuestro caso "TODO".

25ยบ: Una vez puesto el titulo, damos a la carpeta que aparece a la derecha de carpeta raiz local.


26: Seleccionamos el icono de Escritorio que nos conducirรก a la carpeta que anteriormente hemos creado (Wink).

27ยบ: Seleccionamos la carpeta "Wink".


28ยบ: Una vez haciendo click en la carpeta "wink". Se nos abrira dicha carpeta y tendremos que dar a "seleccionar".

29ยบ: Una vez dado todos los pasos necesarios damos a "aceptar".


30ยบ: Damos a "listo" y ya podemos trabajar mas comodamente.

31ยบ: De esta manera nos quedarรก nos quedara nuestro sitio.


32ยบ: Arrastramos la imagen falda, para que la imagen nos aparezca en el trabajo.

33ยบ: Nos aparecerรก esta ventana, donde tendremos que dar "aceptar".


34º: Volvemos a dar "aceptar".

35º: Nos quedará de esta manera, posteriormente ajustaremos sus tamaño.


36º: Una vez ajustado el tamaño la imagen quedará en el margen izquierdo.

37º: Quedando de esta manera.


38ยบ: De nuevo arrastramos la imagen vestido, para que la imagen nos aparezca en el trabajo.

39ยบ: Nos aparecerรก esta ventana, donde tendremos que dar "aceptar".


40º: Volvemos a dar "aceptar".

41º: Nos quedará de esta manera, posteriormente ajustaremos sus tamaño.


42º: Una vez ajustado el tamaño la imagen quedará en el margen derecho, junto con la otra imagen.

43º: Buscamos en internet, un pequeño párrafo sobre nuestra pagina en nuestro caso "La moda".


44º: Damos al botó n derecho de nuestro ratón y seleccionamos la opción "copiar".

45º: Volvemos al programa con el cual estamos trabajando (dreamweaver), damos al botón derecho del ratón y seleccionamos la opcion "pegar".


46ยบ: Quedando de esta manera.

47ยบ: Seleccionamos todo el texto para editarlo.


48ยบ: Ahora nos vamos a dirigir a poner un colo de texto, dando a esta herramienta y seleccionando un color con referencia "#3399CC".

49ยบ: Nos quedarรก de esta manera. Tambien vamos a poner un color de fondo dando a "Propiedades de la pรกgina".


50º: Nos aparecerá esta pestaña. Y seleccionaremos "color de fondo".

51º: Al hacer doble click, nos aparecera una tabla de colores y vamos a seleccionar un verde con referencia #66CC66.


52º: Quedando de esta manera. Damos a "aceptar".

53º: Ahora seleccionamos la herramienta "tabla". Y el trabajo quedara así.


54ยบ: La editamos poniendola al nuestro gusto ( ajustando las columnas y filas).

55ยบ: Damos a "aceptar".


56º: Asi quedara la tabla que anteriormente hemos creado, ahora la ajustaremos al tamaño deseado.

57º: Arrastramos de las esquinas.


58ยบ: Quedando de esta manera.

59ยบ: A continuaciรณn escribimos en la tabla todos los datos necesarios para rellenarla (prenda, falda, vestido...). La tabla nos quedarรก de esta manera.


60Âş: Seleccionamos toda la tabla para posteriormente editarla.

61 : Damos a fondo. Al hacer doble click nos aparece la tabla de colores, seleccionamos un color en este caso de referencia #CCFF00. AsĂ­ nos quedara la tabla.


62ยบ: Ahora vamos a poner una "imagen de sustituciรณn".

63ยบ: Damos a examinar para poner la primera imagen y otra vez a examinar para poner la segunda.


-Damos a aceptar. 64º: Quedando de esta manera y tambien vamos a ajustar el tamaño.

65º: La imagen de sustitución nos quedará así.


-Este a sido mi video tutorial sobre dreamweaver, espero que os haya servido.

video tutorial  

video tutorial

Read more
Read more
Similar to
Popular now
Just for you