dream
DESCRIPTION
clases de dreamweaverTRANSCRIPT
LECCION 1
DREAMWEAVER
TEMA: QUE ES DREAMWEAVER.
OBJ: CONOCER DE FORMA INTEGRAL EL CONCEPTO DE UN SITIO Y DREAMWEAVER.
Dreamweaver CS3 es un software fácil de
usar que permite crear páginas web profesionales.
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.
Las páginas que vemos en Internet están escritas
utilizando el lenguaje HTML (Hyper Text Markup
Language). Este lenguaje está basado
en etiquetas que marcan el inicio y fin de cada
elemento de la página Web
Cuando utilizamos Dreamweaver para crear una
página Web no tenemos que preocuparnos de
todo esto. Dreamweaver inserta
automáticamente las etiquetas necesarias para
construir la página con la apariencia y contenido
definidos en el editor gráfico.
HTML Básico
Cualquier editor de texto permite crear
páginas web. Para ello sólo es necesario
crear los documentos con la
extensión HTML o HTM, e incluir como
contenido del documento el código HTML
deseado. Puede utilizarse incluso el Bloc de
notas para hacerlo.
Todos los programas Adobe Dreamweaver CS3
FORMAS PARA EJECUTAR EL PROGRAMA.
Desde el icono de Dreamweaver CS3 del escritorio
Hacer clic en el botón abrir de
la
barra de herramientas estándar.
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 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.
PASOS PARA ABRIR Y GUARDAR UNA PAGINA
Pasos para crear una página web.
Lo primero que tienes que hacer es abrir Dreamweaver.
Abres un documento nuevo y seleccionas
la Categoría Página básica, HTML.
Seguidamente introduce el texto.
Una vez introducido el texto, vas a
modificar el título y el color de fondo
del documento.
Para ello debes hacer clic sobre el
menú Modificar y elegir la
opción Propiedades de la página.
Práctica
Realizar una
página web.
*Crear una
Autobiografía
.
LECCION 2
TEMA: ENTORNO DE TRABAJO
OBJ: CONOCER LOS ELEMENTOS BASICOS DE DREAMWEAVER
Barra de título
La barra de
herramientas
estándar
La barra de menús
La barra de
herramientas de
documento
La barra de estado
paneles e inspectores
VISTAS DE UN DOCUMENTO
La vista Diseño permite
trabajar con el editor visual.
Es la vista predeterminada
de Dreamweaver y la que
se suele utilizar
habitualmente.
La vista Código se utiliza para
poder trabajar en un entorno
totalmente de programación, de
código fuente. No permite tener
directamente una referencia
visual de cómo va quedando el
documento según se va
modificando el código.
La vista Código y
Diseño permite dividir la
ventana en dos zonas. La zona
superior muestra el código
fuente, y la inferior el editor
visual. Cuando se realiza un
cambio en alguna de las zonas,
este cambio se aplica
directamente sobre la otra
Vista previa en el
explorador
Práctica del día:
Abrir la página de
la autobiografía, y
trabajar
con las diferentes
Vista de
Dreamweaver
LECCION 3
Tema: Configuración de un Sitio Web
Obj: Conocer y configurar un Sitio Web.
Un sitio web es un conjunto de archivos y
carpetas, relacionados entre sí, con un diseño
similar o un objetivo común.
Pasos para crear un Sitio Web.
1
2
3 Asignar un nombre
4
5Especificar el
lugar donde se
va a almacenar
Especific
ar
la
carpeta
6
7
9
10
Completado
Trabajar con el Sitio.
Seleccionar el Sitio y dar clic en el botón
Listo
PRACTICA DEL DIA:
CON LOS PASOS EN LA LECCION.
CREAR UN SITIO WEB
Las características del texto
seleccionado pueden ser definidas a través
del inspector de propiedades.
y a través del menú Texto,
Lección 4
Es posible insertar texto a modo de lista. A su
vez, la lista puede ser numerada o con viñetas.
Para que un texto que ya ha sido introducido
en el documento se convierta en una lista,
simplemente hay que seleccionarlo y pulsar
sobre la opción de lista correspondiente, ya sea
a través del inspector de propiedades, o a
través del menú Texto.
La lista con viñetas (desordenada) se
selecciona a través del botón , mientras que
la lista numerada (ordenada) se selecciona a
través del botón .
En la ventana Propiedades de lista se
puede especificar el tipo de lista (con
números o con viñetas), el tipo de números o
viñetas que se utilizarán (en la
propiedad Estilo:), y en el caso de las listas
ordenadas, el número por el que comenzará
el recuento.
Listas
A veces necesitarás
introducir caracteres
especiales en tus páginas.
Caracteres Especiales
Con Dreamweaver CS3, las características que apliquemos a un texto crearán automáticamente estilos
CSS que se incrustarán en el documento actual y se aplicarán únicamente sobre él.
Veámoslo:
Para crear un Estilo CSS personalizado:
1. En el documento, se selecciona el texto al que se desea aplicar características concretas.
2. En el inspector de propiedades se modifican todas las propiedades de formato de texto, se establecen
los atributos de la fuente y del párrafo que queramos.
Automáticamente Dreamweaver creará un nuevo estilo con el nombre Estilo1 o Estilo2 o Estilo3,... según
los nombres de los estilos ya creados.
Aparecerá el nombre Estilo1 en el cuadro Estilo del panel Propiedades.
Crear un Estilo Personalizado
PRACTICA DEL DIA:
En la página de la Autobiografía dar formato al documento y crear
una lista de las actividades que más te agreden en casa.