Dreamweaver CS5 es un software fácil
de usar que permite crear páginas
web profesionales.
Las funciones de edición visual de
Dreamweaver CS5 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 JavaScript, etc.., de
una forma muy sencilla y visual.
La barra la aplicación se incorporó en la
versión anterior de Dreamweaver. Si
tenemos la ventana maximizada
veremos todos los elementos de la barra
ocupando una sola línea, si no,
ocuparán dos líneas, como en la imagen
superior.
Esta barra contiene los siguientes
elementos: los menús (en la imagen, en
la parte inferior), varios botones propios
de la aplicación, el conmutador de
espacio de trabajo y una caja de
búsquedas para obtener ayuda on line.
Cada archivo que tengamos abierto, mostrará
una pestaña con su nombre, lo que nos
permitirá cambiar de uno a otro fácilmente.
Si junto al nombre aparece un *, indica que
ese archivo tiene cambios sin guardar.
Podemos cerrar cada documento clicando en
el aspa de la derecha, o acceder a otras
acciones haciendo clic con el botón derecho,
como Cerrar otros archivos.
Debajo de las pestañas encontramos los archivos
a que utiliza nuestra página, como la hoja de
estilos, archivos JavaScript, etc... pudiendo
acceder a ellos con un clic. Esto nos ahorrará
bastante tiempo.
Esta barra la encontramos debajo de la ventana de documento, y
nos da información sobre el mismo.
A la izquierda, encontramos el selector de etiquetas. Nos sirve
para seleccionar etiquetas completas. Siguiendo hacia la
derecha encontramos las herramientas de Selección, Mano
(para desplazarse) y Zoom. Y otros datos como el tamaño de
la ventana, el tamaño de la página o su codificación.
Hasta aquí las barras que siempre veremos en la aplicación. A
parte, existen otras que podemos ver u ocultar desde el
menú Ver → Barras de herramientas.
Para insertar una imagen hay que dirigirse al menú Insertar, a
la opción Imagen. Después de esto, ya es posible
seleccionar una imagen a través de la nueva ventana.
Cuando te acostumbres, te será más cómodo acceder con
la combinación de teclas Ctrl + Alt + I.
En Relativa a es posible especificar si la imagen será relativa
al documento o a la carpeta raíz del sitio. Es preferible
que sea relativa al Documento, ya que si cambiamos la
página de carpeta, lo habitual es cambiar también sus
imágenes.
Lo mismo ocurre cuando se selecciona un documento para
crear un vínculo.
La ruta en la que se encuentra la imagen aparecerá
representada de una u otra forma en el campo URL de la
ventana y en el campo Origen del inspector de
propiedades, dependiendo de si ha sido insertada como
relativa a la carpeta raíz del sitio o relativa al documento.
Por ejemplo, imagina que dentro de la carpeta raíz del sitio
(la carpeta del sitio) se encuentran la carpeta imagenes y
el documento en el que deseamos insertar la imagen.
Dicha imagen, llamadaaulaclic.jpg, se encuentra dentro de
la carpeta imagenes.
INSERTAR UNA IMAGEN
Para insertar una tabla hay que dirigirse al menú Insertar, a la opción Tabla.
En la nueva ventana habrá que especificar el número de Filas y Columnas que tendrá la
tabla, así como el Ancho de la tabla.
El Ancho puede ser definido como Píxeles o como Porcentaje. La diferencia de uno y otro
es que el ancho en Píxeleses siempre el mismo, independientemente del tamaño de la
ventana del navegador en la que se visualice la página, en cambio, el ancho
en Porcentaje indica el porcentaje de la página o del elemento contenedor) y se
ajustará al tamaño de la ventana del navegador, esto permite que los usuarios que
tengan pantallas grandes, aprovechen todo el ancho de pantalla.
Grosor del Borde indica el grosor del borde de la tabla en píxeles, por defecto se le asigna
uno (1). Si lo ponemos a 0 o en blanco, la tabla no mostrará borde.
Relleno de celda (cellpadding) indica la distancia entre el contenido de las celdas y los
bordes de éstas.
Espacio entre celdas (cellspacing) indica la distancia entre las celdas de la tabla.
También se puede establecer si se quiere un encabezado para la tabla, por ejemplo para
indicar el contenido de filas o columnas. Aunque podríamos lograr el mismo diseño con
celdas normales y estilos CSS, es recomendable utilizar encabezados en el caso de que
los usuarios utilicen lectores de pantalla. Los lectores de pantalla leen los
encabezados de tabla y ayudan a los usuarios de los mismos a mantener un
seguimiento de la información de la tabla.
INSERTAR UNA TABLA

Ventana de dreamweaver

  • 2.
    Dreamweaver CS5 esun software fácil de usar que permite crear páginas web profesionales. Las funciones de edición visual de Dreamweaver CS5 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 JavaScript, etc.., de una forma muy sencilla y visual.
  • 4.
    La barra laaplicación se incorporó en la versión anterior de Dreamweaver. Si tenemos la ventana maximizada veremos todos los elementos de la barra ocupando una sola línea, si no, ocuparán dos líneas, como en la imagen superior. Esta barra contiene los siguientes elementos: los menús (en la imagen, en la parte inferior), varios botones propios de la aplicación, el conmutador de espacio de trabajo y una caja de búsquedas para obtener ayuda on line.
  • 5.
    Cada archivo quetengamos abierto, mostrará una pestaña con su nombre, lo que nos permitirá cambiar de uno a otro fácilmente. Si junto al nombre aparece un *, indica que ese archivo tiene cambios sin guardar. Podemos cerrar cada documento clicando en el aspa de la derecha, o acceder a otras acciones haciendo clic con el botón derecho, como Cerrar otros archivos. Debajo de las pestañas encontramos los archivos a que utiliza nuestra página, como la hoja de estilos, archivos JavaScript, etc... pudiendo acceder a ellos con un clic. Esto nos ahorrará bastante tiempo.
  • 6.
    Esta barra laencontramos debajo de la ventana de documento, y nos da información sobre el mismo. A la izquierda, encontramos el selector de etiquetas. Nos sirve para seleccionar etiquetas completas. Siguiendo hacia la derecha encontramos las herramientas de Selección, Mano (para desplazarse) y Zoom. Y otros datos como el tamaño de la ventana, el tamaño de la página o su codificación. Hasta aquí las barras que siempre veremos en la aplicación. A parte, existen otras que podemos ver u ocultar desde el menú Ver → Barras de herramientas.
  • 9.
    Para insertar unaimagen hay que dirigirse al menú Insertar, a la opción Imagen. Después de esto, ya es posible seleccionar una imagen a través de la nueva ventana. Cuando te acostumbres, te será más cómodo acceder con la combinación de teclas Ctrl + Alt + I. En Relativa a es posible especificar si la imagen será relativa al documento o a la carpeta raíz del sitio. Es preferible que sea relativa al Documento, ya que si cambiamos la página de carpeta, lo habitual es cambiar también sus imágenes. Lo mismo ocurre cuando se selecciona un documento para crear un vínculo. La ruta en la que se encuentra la imagen aparecerá representada de una u otra forma en el campo URL de la ventana y en el campo Origen del inspector de propiedades, dependiendo de si ha sido insertada como relativa a la carpeta raíz del sitio o relativa al documento. Por ejemplo, imagina que dentro de la carpeta raíz del sitio (la carpeta del sitio) se encuentran la carpeta imagenes y el documento en el que deseamos insertar la imagen. Dicha imagen, llamadaaulaclic.jpg, se encuentra dentro de la carpeta imagenes.
  • 10.
  • 11.
    Para insertar unatabla hay que dirigirse al menú Insertar, a la opción Tabla. En la nueva ventana habrá que especificar el número de Filas y Columnas que tendrá la tabla, así como el Ancho de la tabla. El Ancho puede ser definido como Píxeles o como Porcentaje. La diferencia de uno y otro es que el ancho en Píxeleses siempre el mismo, independientemente del tamaño de la ventana del navegador en la que se visualice la página, en cambio, el ancho en Porcentaje indica el porcentaje de la página o del elemento contenedor) y se ajustará al tamaño de la ventana del navegador, esto permite que los usuarios que tengan pantallas grandes, aprovechen todo el ancho de pantalla. Grosor del Borde indica el grosor del borde de la tabla en píxeles, por defecto se le asigna uno (1). Si lo ponemos a 0 o en blanco, la tabla no mostrará borde. Relleno de celda (cellpadding) indica la distancia entre el contenido de las celdas y los bordes de éstas. Espacio entre celdas (cellspacing) indica la distancia entre las celdas de la tabla. También se puede establecer si se quiere un encabezado para la tabla, por ejemplo para indicar el contenido de filas o columnas. Aunque podríamos lograr el mismo diseño con celdas normales y estilos CSS, es recomendable utilizar encabezados en el caso de que los usuarios utilicen lectores de pantalla. Los lectores de pantalla leen los encabezados de tabla y ayudan a los usuarios de los mismos a mantener un seguimiento de la información de la tabla.
  • 12.