Dreamweaver CS3 es un software fácil de usar que permite crear páginas web profesionales agregando rápidamente diseño y funcionalidad sin necesidad de programar código HTML manualmente. Incluye funciones para crear tablas, editar marcos, trabajar con capas e insertar comportamientos JavaScript de forma visual y sencilla. También incluye un software FTP completo para trabajar y actualizar sitios web remotos.
Curso = Metodos Tecnicas y Modelos de Enseñanza.pdf
Dreamweaver
1.
2. Dreamweaver CS3 es un software fácil de usar
que permite crear páginas web profesionales.
Las funciones de edición visual de Dreamweaver
CS3 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.
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.
3. A lo largo de este tema vamos a aprender a
cambiar las propiedades del texto y a
crear estilos CSS, que permiten asignar al
texto estilos creados por nosotros mismos, no
predefinidos.
4. Las características del texto
seleccionado pueden ser definidas a través del
menú Texto, y a través del inspector de
propiedades. Vamos a ver las posibilidades que
se nos ofrecen a través del inspector de
propiedades, aunque sean menos que las que se
nos ofrecen a través del menú Texto.
FORMATO :Permite seleccionar un formato de párrafo ya definido
para HTML, que puede ser encabezado, párrafo o preformateado. Los
encabezados se utilizan para establecer títulos dentro de un documento.
FUENTE : Permite seleccionar un conjunto de fuentes. Aparecen
conjuntos de fuentes en lugar de una sola, ya que es posible que al establecer
una única fuente el usuario no la tenga en su ordenador.
5. TAMAÑO : Permite cambiar el tamaño del texto. El tamaño lo
podemos indicar en diversas unidades, en píxeles, centímetros, etc...
COLOR : Permite seleccionar el color de la fuente, ignorando el
color que se haya definido en las propiedades de la página. Si no se ha
establecido ningún color en las propiedades de la página ni aquí, el color
del texto por defecto será el negro.
ESTILO : Estos botones permiten establecer si el texto aparecerá en
negrita o en cursiva. A través del menú Texto también se puede, entre
otras cosas, subrayar el texto. Esta opción no aparece en el panel
de Propiedades ya que de normal no suele utilizarse, debido a que los
vínculos aparecen subrayados y el subrayar texto normal podría hacer
que el usuario pensara que se trata de un vínculo.
ALINEAR :A través de estos botones es posible establecer la
alineación del texto de una de estas cuatro formas distintas: izquierda,
centrada, derecha y justificada.
LISTA : Estos botones permiten crear listas con viñetas o listas
numeradas.
SANGRIA : Estos dos botones permiten sangrar el texto y anular
la sangría. La sangría es una especie de márgen que se establece a
ambos lados del texto. En este caso caso los botones se refieren a
sangría a la izquierda del texto.
6. En este tema vamos a ver cómo insertar
imágenes en un documento. También
veremos cómo crear algunas imágenes
especiales, como es el caso de
los Rollovers y los botones flash, que ayudan
a mejorar la apariencia de nuestras páginas.
INTRODUCCIÓN :Un hiperenlace, hipervínculo, o vínculo, no es
más que un enlace, que al ser pulsado lleva de una página o archivo a
otra página o archivo.Es posible asignar un vínculo a un texto, a una
imagen, o a parte de una imagen.
TIPOS DE ENLACES :Existen diferentes clases de rutas de
acceso a la hora de definir los vínculos.
7. En este tema vamos a ver cómo trabajar
con tablas. Podremos, entre otras cosas,
insertar tablas, combinar celdas, insertar
filas o columnas y cambiar el tamaño del
borde.
INTRODUCCIÓN: Todos los objetos se alinean por
defecto a la izquierda de las páginas web, pero gracias a las
tablas es posible distribuir el texto en columnas, colocar
imágenes al lado de un bloque de texto, y otra serie de cosas
que sin las tablas serían imposibles de realizar.
Hoy en día, la mayoría de las páginas web se basan en tablas,
ya que resultan de gran utilidad al mejorar notablemente las
opciones de diseño.
8. 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 elAncho 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íxeles es 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 que va a ocupar la tabla dentro de la página 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).
Relleno de celda indica la distancia entre el contenido de las celdas y los
bordes de éstas.
Espacio entre celdas indica la distancia entre las celdas de la tabla.
También se puede establecer si se quiere un encabezado para la tabla 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.
9. Vamos a ver qué son los marcos y para qué se utilizan.
También veremos cómo insertar un marco sencillo en una
página, y cómo trabajar con él.
INTRODUCCIÓN :Los marcos o frames sirven para distribuir
mejor los datos de las páginas, ya que permiten mantener
fijas algunas partes, como pueden ser el logotipo y la barra
de navegación, mientras que otras sí pueden cambiar.
Además de mejorar la funcionalidad, pueden mejorar
también la apariencia.Cada uno de los marcos de una
página, contiene un documento HTML individual. Por
ejemplo, en la imagen de la derecha puedes ver una
página con dos marcos. El marco izquierdo contiene el
documento menu.htm y el derecho el
documento quienes.htm. Para poder visualizar la página
de este modo, hemos tenido que abrir en el navegador el
documento marcos.htm, que es la página que contiene los
marcos agrupados.
10. Vamos a ver algunas de las características
básicas sobre las capas, para luego poder
trabajar con ellas y aplicarles algún
comportamiento.
INTRODUCCIÓN: Las capas no son más que unos
recuadros, que pueden situarse en cualquier parte de la
página (es decir, que tienen una posición absoluta en la
página), en los que podemos insertar contenido HTML. Dichas
capas pueden ocultarse y solaparse entre sí, lo que
proporciona grandes posibilidades de diseño. Las capas
pueden moverse de una posición a otra de la ventana
pulsando sobre el recuadro blanco, y sin soltar el ratón,
arrastrándola hacia la nueva posición.También pueden ser
redimensionadas pulsando sobre los recuadros negros, y
arrastrándolos hasta conseguir el tamaño deseado.
11. Vamos a ver qué es un formulario, para qué
se utiliza, cómo insertar uno, qué elementos
puede contener y cómo pueden validarse los
datos introducidos en él.
INTRODUCCIÓN: Los formularios se utilizan para recoger
datos de los usuarios, nos pueden servir para realizar un pedido en
una tienda virtual, crear una encuesta, conocer las opiniones de los
usuarios, recibir preguntas, etc.Una vez el usuario rellena los datos y
pulsa el botón para enviar el formulario se arrancará un programa
que recibirá los datos y hará el tratamiento correspondiente.
12. En este tema vamos a ver qué son
las plantillas, cómo crearlas y cómo basar
documentos en ellas.
INTRODUCCIÓN: Cada vez que deseamos crear un sitio
web, tenemos que tener muy en cuenta que las páginas deben
seguir un formato uniforme.La mayoría de nosotros solemos
hacer copias de los documentos ya creados, y trabajar sobre
estas copias, modificando simplemente su contenido. Esta es la
forma más sencilla de tener páginas con una estructura basada
en la estructura de otras ya creadas previamente.
CREAR PLANTILLAS: Las plantillas pueden crearse
desde cero, o a partir de una página ya existente. Una forma de
crear una plantilla desde cero es a través del panel Archivos,
pestaña Activos.
13. En este tema vamos a ver las características
básicas de los comportamientos, así como
un par de ejemplos de entre sus posibles
aplicaciones.
INTRODUCCIÓN: Los comportamientos son acciones que suceden
cuando los usuarios realizan algún evento sobre un objeto, como puede ser
mover el ratón sobre una imagen, pulsar sobre un texto, hacer doble clic sobre
un mapa de imagen, etc.
INSERTAR UN COMPORTAMIENTO: Lo primero que hay que
hacer es seleccionar el objeto sobre el que se ha de aplicar el comportamiento,
como puede ser una imagen, un fragmento de texto, etc.
14. En temas anteriores vimos cómo funcionaba
el Panel CSS y cómo crear hojas de estilos
para poder utilizarlas en tus páginas web.
En este tema aprenderemos más sobre CSS,
pero orientándonos más a qué es CSS y cómo
crear estilos CSS para crear páginas que sigan
los fundamentos y reglas marcadas por
el W3C(Word Wide Web Consortium).
15. Vamos a ver cuáles son los elementos básicos de
Dreamweaver CS3 , la pantalla, las barras, los
paneles, etc, para saber diferenciar entre cada uno
de ellos. Aprenderemos cómo se llaman, dónde están
y para qué sirven. También veremos cómo obtener
ayuda, por si en algún momento no sabemos cómo
seguir trabajando. Cuando conozcamos todo esto
estaremos en disposición de empezar a crear páginas
web.
LA PANTALLA INICIAL: Al arrancar Dreamweaver aparece
una pantalla inicial como ésta, vamos a ver sus componentes
fundamentales. Así conoceremos los nombres de los diferentes
elementos y será más fácil entender el resto del curso. La
pantalla que se muestra a continuación (y en general todas las de
este curso) puede no coincidir exactamente con la que ves en tu
ordenador, ya que cada usuario puede decidir qué elementos
quiere que se vean en cada momento, como veremos más
adelante.
16. En el tema 3 vimos cómo crear y trabajar con un sitio
local. Esta unidad está dedicada a los Sitios Remotos,
veremos cómo crearlos y cómo utilizarlos. Definir un sitio
remoto significa establecer una configuración de modo que
Dreamweaver sea capaz de comunicarse directamente con
un servidor en Internet (por eso se llama remoto) y así
poder trabajar a la vez con tus archivos en el sitio local, es
decir, la copia que tienes en tu ordenador, y en el sitio
remoto, colgados en el servidor, en Internet.
17. INTRODUCCIÓN A PHP: Hasta ahora hemos
aprendido cómo mostrar contenido estático
en nuestras páginas web. Dejando de lado
todos los efectos o animaciones que podamos
hacer, en determinadas ocasiones nos es
necesario darle un poco más de dinamismo
al contenido del sitio.
18. Hasta ahora hemos visto cómo empezar a manejarnos
con páginas dinámicas de acceso a datos
utilizando PHP y un servidor mySQL.La complejidad
de las páginas que creemos dependerá de la
profundidad de nuestros conocimientos de ambas
tecnologías, por lo que muchas veces (sobre todo al
principio) nos será dificil alcanzar algunos objetivos
que nos propongamos.
ESTRUCTURA DE DATOS: Nuestro primer paso para
lacreación de un blog será crear la estructura de
datosque contendrá la información de las entradas y
otroselementos del sitio.En un sitio simple
deberemoscrear como mínimo
4tablas: categorias, entradas, comentarios y usua
rios