DREAMWEAVER

Ventanas y temas

Por Cinthia Fernández Huamán

QUÉ ES DREAMWEAVER CS4
Dreamweaver CS4 es un software fácil de usar que permite crear páginas web profesionales. Las funciones de edición visual de Dreamweaver CS4 permiten agregar rápidamente diseño y funcionalidad a las páginas, sin la necesidad de programar manualmente el código HTML. Se puede crear tablas, editar marcos, trabajar con capas, insertar comportamientos Java Script, etc.., de una forma muy sencilla y visual. Además incluye un software de cliente FTP completo, permitiendo entre otras cosas trabajar con mapas visuales de los sitios web, actualizando el sitio web en el servidor sin salir del programa. Para seguir este curso te puedes descargar la versión gratuita de Dreamweaver desde la página de Adobe, la versión caduca al cabo de 30 días, pero seguro que te dará tiempo a entenderlo y decidir si quieres adquirir la versión completa de este fantástico programa. Los logotipos de Dreamweaver son propiedad de Adobe, así como las marcas registradas Dreamweaver y Adobe.

RUTA:
Clic en Inicio Clic en todos los programa Clic en Macromedia Clic en Macromedia Dreamweaver.

PANTALLA INICIAL

ABRIR Y GUARDAR DOCUMENTOS
Para abrir un documento, puedes utilizar cualquiera de las siguientes operaciones: Hacer clic en el botón abrir de la barra de herramientas estándar (si está visible). Pulsar la combinación de teclas Ctrl + O. Hacer clic sobre el menú Archivo y elegir la opción Abrir. Hacer doble clic sobre el archivo en la ventana del sitio. Hacer clic derecho sobre el archivo en el explorador de Windows, y elegir la opción Abrir con Adobe Dreamweaver CS4.

Para abrir un documento nuevo, puedes utilizar cualquiera de las siguientes operaciones.: Hacer clic en el botón nuevo de la barra de herramientas estándar (si está visible). Pulsar la combinación de teclas Ctrl + N. Hacer clic sobre el menú Archivo y elegir la opción Nuevo. Después de esto aparecerá una nueva ventana, en la que deberás elegir la Categoría Página en blanco.

Para guardar un documento, puedes utilizar cualquiera de las siguientes operaciones. Hacer clic en el botón Guardar de la barra de herramientas estándar. Pulsar la combinación de teclas Ctrl + S. Hacer clic sobre el menú Archivo y elegir la opción Guardar. Dreamweaver incluye la posibilidad de, en el caso de estar trabajando simultáneamente con varios documentos, poder guardar todos de golpe, sin la necesidad de hacerlo uno por uno. Para guardar todo puedes realizar cualquiera de las siguientes operaciones. Hacer clic en el botón Guardar todo de la barra de herramientas estándar. Hacer clic sobre el menú Archivo y elegir la opción Guardar todo.

¿COMO INSERTAR UNA IMAGEN?

Ahora vamos a insertar una imagen. Para insertar la imagen, hemos de tenerla en la carpeta donde estamos creando nuestras páginas, habitualmente en una subcarpeta dedicada a las imágenes. Muchas de las imágenes que vemos en Internet se pueden copiar al disco duro. Al hacer clic con el botón derecho del ratón sobre la imagen que queremos traer de Internet, se abre una ventana con una opción similar a Guardar imagen como... que permite grabar dicha imagen en un fichero de nuestro disco duro. Copia la imagen que aparece a continuación, para luego poder insertarla en la página web que estamos creando. Guárdala en la carpeta donde vas a guardar la página que acabas de crear.

PRINCIPALES

BARRAS Y MENÚS

La barra de herramientas La barra de herramientas de Dreamweaver contiene botones que permiten alternar entre diferentes vistas del documento rápidamente, cambiar el título del documento o previsualizar la página en el navegador. Los elementos del menú Opciones (botón situado en el extremo derecho de la barra de herramientas) cambia en función de la vista que seleccione.

El Panel objetos Este panel contiene botones que permiten la creación e inserción de diversos tipos de objetos, como tablas, vínculos, capas e imágenes. El panel contiene siete categorías de forma predeterminada: Común, Formularios, Marcos, Head, Invisibles y Caracteres. También contiene botones que cambian de vista: Estándar y Disposición..

Inspector de propiedades El inspector de propiedades permite examinar y editar las propiedades del elemento que esté seleccionado actualmente, puede ser un objeto o texto. Es posible seleccionar los elementos en la ventana de documento o en el inspector de código. La mayoría de los cambios realizados en las propiedades se aplicarán de inmediato en la ventana de documento.

El inspector de propiedades muestra inicialmente las propiedades del elemento seleccionado que se utilizan con mayor frecuencia; para ver todas las propiedades haga clic en la flecha de ampliación situada en la esquina inferior derecha del inspector de propiedades, para ver más propiedades del elemento.

DEFINICIÓN DE SITIO WEB

Un sitio Web es un conjunto de archivos que comparten un mismo tema o tienen la misma finalidad y que están almacenados en un servidor Web. Generalmente está compuesto de páginas HTML junto con otros elementos asociados a ellas como imágenes, videos o sonidos. Las siguientes definiciones pueden contribuir a aclarar este concepto: Un Sitio Web es un conjunto de archivos electrónicos y páginas Web que son accesibles mediante el protocolo HTTP de Internet. Este conjunto de páginas tiene como objetivo el desarrollo de algún tema, prestar servicios o entregar contenidos asociados al entorno de la página.

Una Página de Internet o Página Web es un documento que contiene información específica de un tema en particular y que es almacenado en algún sistema de cómputo que se encuentre conectado a la red mundial de información denominada Internet, de tal forma que éste documento pueda ser consultado por cualquier persona que se conecte a esta red mundial de comunicaciones. Un Sitio Web es un conjunto de páginas Web relacionadas entre sí.

TABLAS
Las tablas son una herramienta potente para presentar datos e imágenes en páginas HTML. Las tablas proporcionan a los diseñadores Web formas de añadir estructura vertical y horizontal a una página. Utilice las tablas para presentar datos tabulares, diseñar columnas o disponer texto o gráficos en una página Web. Podrá agregar contenido; añadir, eliminar, dividir y combinar filas y columnas; modificar las propiedades de tablas, de filas o de celdas para añadir color y alineaciones, así como copiar y pegar celdas.

Las tablas constan de tres componentes básicos:
Filas: Espacio horizontal. Celdas: Los contenedores que se originan en las intersecciones de las filas y las columnas. Columnas: Espacio vertical.

Insertar una tabla
Para insertar una tabla:
1.

Lleve a cabo una de estas operaciones:
y

y

Sitúe el punto de inserción en el lugar de la ventana de documento donde desea que aparezca la tabla y haga clic en el botón Tabla de la categoría Común, en el panel Objetos, o elija Insertar > Tabla. Arrastre el botón Tabla desde el panel Objetos hasta la posición deseada de la página.

2.

Acepte los valores actuales de este cuadro de diálogo o escriba otros nuevos.
y y

En el campo Filas, especifique el número de filas de la tabla. En el campo Columnas, especifique el número de columnas de la tabla. En el campo relleno de celda, especifique el número de píxeles que habrá entre el contenido de la celda y el límite de ésta. En el campo espacio de celda, especifique el número de píxeles que debe haber entre las celdas de la tabla. En el campo ancho, especifique el ancho de la tabla como un número de píxeles. En el campo borde, especifique el ancho en píxeles del borde de la tabla. Haga clic en Aceptar para crear la tabla. Haga clic en Aceptar para crear la tabla.

y

y

y

y

3.

¿QUÉ SON LAS PLANTILLAS?
Las plantillas son una especie de copia de la página en la que van a estar basadas el resto de páginas del sitio Web, pero que incluyen la posibilidad de establecer unas zonas editables y otras zonas fijas, que no podrán ser modificadas. No es posible modificar las propiedades de una página que está basada en una plantilla, a excepción del título. Cuando se desea que existan páginas con, por ejemplo, diferente color de fondo, es necesario crear plantillas diferentes con los distintos colores, y basar las páginas en una u otra plantilla, según el color de fondo que se desee para cada una. Cuando se modifica el diseño de una plantilla, se pueden actualizar todas las páginas basadas en ella. Las plantillas son archivos con la extensión DWT que se guardan en el sitio Web, dentro de una carpeta llamada Templates.

HTML EN DREAMWEAVER
En este tema vamos a ver algunas de las facilidades que proporciona Dreamweaver para trabajar sobre el propio código HTML, y no únicamente sobre el editor gráfico de la vista diseño. En este tema no se pretende enseñaros el lenguaje HTML sino cómo poder realizar algunos reajustes directamente en el código estando dentro de Dreamweaver.

Etiquetas Las etiquetas consisten en poner un mismo comando entre los símbolos < y >. La primera etiqueta indica inicio, y la segunda, que incluye el símbolo /, indica final y se suele denominar etiqueta de cierre. Las etiquetas disponen de atributos que permiten definir características del elemento sobre el que actúan, incluyendo cierto código dentro de la etiqueta. Por ejemplo, un párrafo se inserta entre las etiquetas <p> y </p>, pero es posible cambiar sus características predeterminadas, como puede ser asignarle una clase de estilo CSS. Para ello, a la etiqueta de apertura anterior habría que añadir el atributo y su valor, quedando <p class="miclase"> y </p>.

Sign up to vote on this title
UsefulNot useful