viernes, 17 de octubre de 2014

DREAMWEABER PARA DISEÑAR UN SITIO WEB


       
       


TUTORIAL BÁSICO DEL MANEJO DEL DREAMWEAVER
PARA DISEÑAR UN SITIO WEB

En primera parte le damos la bienvenida a usted querido público al visitar este tutorial escrito, para que pueda elaborar su sitio web de una manera más fácil y práctica, le enseñamos lo básico del programa Dreameaver el cual nossirve para diseñar un sitio web
Previamente.- Antes de utilizar el Programa Adobe Breamweaver usted tiene que crear una carpeta exclusiva en uno de los discos de su computadora, (disco local C, D, E, ect.)  Que usted vea conveniente con un nombre en específico y que sea en letras minúsculas y siempre con guiónes bajos después de cada palabra y no escribir (ñ).

Ejemplo:   diseño_primerizos

En la carpeta mencionada debe de crear de la misma forma sub carpetas con los contenidos que necesitará entre ellos fotos, imágenes, textos, banner, botones y otros de una forma ordenada y sistemática  a su diseño.

Ejemplo:  
v banner_primerizos
v logo_primerizos
v botones
v imagenes
v paginas_web

De esa manera, no olvide que el orden le ayudará mucho en su trabajo de diseño. En caso contrario no tendrá problemas al guardar pero si al abrir.

1)    Instale el Programa Adobe Dreamweaver.

Usted ya vera la manera más conveniente de donde adquirir el programa y asegúrese de instalar bien el programa y en el disco local que vea conveniente.
programa ADOBE DREAMWEABER

2)    Como abrir el programa

Una vez instalado dicho programa, usted podrá crear su trabajo de la siguiente forma.
Ø  Debe de dirigir el cursor a la carpeta o Programa Adobe Breamweaver  y hacer doble clic para abrir.
Ø  Se abrirá una ventana con tres columnas:
Ø  Al lado izquierdo se ubicaran los documentos elaborados o recientes.
Ø  En el centro se ubica el procedimiento de crear nuevo y ahí se ubican un listado de que tipo o forma  quiere crear.
Ø  Al lado derecho se ubica crear con planilla  en el cual le sale un listado de opciones.

3)    A que columna se debe dirigir y como ingresar.

Ø  En las tres columnas anteriores usted debe de dirigirse hacia el centro y buscar el símbolo escrito PHP que es el tercero.
Ø  Al ubicar PHP hacer doble clic.
Ø  Le saldrá una nueva ventana de trabajo en el cual usted a trabajado en cualquier tipo de programas de adobe es casi lo mismo.

4)    Lo primero que debe de crear
Ø  Lleva el cursor hacia la parte superior y busca la herramienta insertar  y realiza un clic. Inmediatamente le aparecerá una ventana pequeña.
Ø  En esa ventana usted le dará de acuerdo  a su esquema de diseño que planifico cuantas columnas y filas necesita sin olvidar que el ancho promedio de un diseño web es de 1000 pixeles.
Ø  Al llenar todas las opciones que usted desea hacer, clic en aceptar e inmediato le saldrá su configuración de tablas.
 
5)    Como combinar las celdas
Es muy básico saber qué tamaño de imágenes, fotos y otros va a subir a las tablas para que pueda dividir o fusionar las celdas.

Ejemplo:  
Ø  Si mi ancho de mi banner es de 1000 x 300 pixeles entonces debo de fusionar una sola celda.
Ø  Entonces marco las celdas que quiero juntar
Ø  Llevo el cursor a la parte inferior en Propiedades y buscar las opciones de Celda
Ø  Busco la imagen de unión que se encuentra debajo de la palabra fila y hago clic en el gráfico que está unido.
Ø  Inmediatamente se unirán las celdas seleccionadas
Ø  De la misma forma podré realizar  esta operación para fusionar celdas.



6)    Como dividir las celdas.
Ø  De la misma forma que la anterior explicación llevo el cursor a la parte inferior en Propiedades y buscar las opciones de Celda.
Ø  Busco la imagen separada que se encuentra debajo de la palabra celda  y hago clic en el gráfico que está separado.
Ø  Saldra una  ventana donde indicará en cuantas filas quieres dividir o en cuantas columnas.
Ø  Debes de realizar y llenar  tus opciones y hacer clic para su aplicación. 
Ø  De la misma forma podrás realizar  esta operación para dividir celdas.

7)    Antes de insertar una imagen.
Ø  Antes de insertar una imagen tiene que dirigirse al panel de la parte inferior en Propiedades y buscar las opciones de Celda.
Ø  A sus extremos se encuentra las opciones de celda Horizontal y Vertical y tienes que cambiar de la forma predeterminada.
Ø  Llevar el curso hacia celda horizontal y hacer clic, le saldrá una lista de opciones usted debe de colocar en Izquierda.
Ø  Llevar el curso hacia celda vertical y hacer clic, le saldrá una lista de opciones usted debe de colocar en superior.

8)    Como insertar una imagen
Ø  Una vez realizada la acción  de la indicación 8.- debe de dirigir el cursos a la parte superior donde indica Insertar.
Ø  Hacer clic en insertar e inmediatamente le saldrá un listado dirigirse a imagen.
Ø  Al seleccionar Imagen le saldrá una ventana de donde despojará dicha imagen.
Ø  Saldrá una serie de ventanas solo acepte.
Ø  Al seleccionar solo haga clic en aceptar e inmediatamente se insertará la imagen su celda.
Ø  De la misma forma podré realizar  esta operación para subir cualquiera imagen en mis demás celdas.

9)     Como vincular los elementos.
Ø  Para vincular los elementos insertados en las celdas bajar el cursor hacia la parte inferior y buscar la carpeta con el nombre de Vínculo e inmediatamente le saldrá una ventana donde ubicará el lugar de donde se sustrajo dicho elemento y hacer  solo clic para que se vincule.
Ø  Realizar de la misma uno por uno todos los elementos insertos en la tabla.  

10)  Como guardar tu trabajo
Ø  Una vez concluido tu sitio debes de guardar tu proyecto
Ø  Llevar el cursor a la parte superior dirigido hacia Archivo y guardar donde la carpeta que realizaste antes de empezar el proyecto con el nombre de index php.
Ø  Todo tus documentos deben de estar con nombres en minúscula y evitar tildes o ñ.
Bueno espero que lo hayas logrado solo son pasos básicos para tu Sitio Web. Suerte!!!

No hay comentarios:

Publicar un comentario