SlideShare ist ein Scribd-Unternehmen logo
1 von 44
Dreamweaver 8 Taller Mofonguero Por: Juan C. Peña Martínez
Bienvenida ,[object Object],[object Object]
¿Qué es mofonguero? ,[object Object],[object Object]
Listado de materiales ,[object Object],[object Object],[object Object],[object Object]
Contenido ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
¿Que es Dreamweaver? ,[object Object],[object Object]
¿Qué es HTML? ,[object Object],[object Object]
¿Qué es HTML? ,[object Object],[object Object],[object Object],[object Object]
¿Para qué sirve? ,[object Object],[object Object],[object Object],[object Object]
¿Qué es WYSIWYG? ,[object Object],[object Object]
¿Cómo comienzo? ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
¿Cómo comienzo? (preguntas) ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
¿Cómo comienzo? (preguntas) ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
¿Cómo comienzo? (preguntas) ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
¿Cómo comienzo? (preguntas) ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
¿Cómo comienzo? (preguntas) ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Ejemplos de Flujograma Inicio Menú Pag 1 Pag 2 Pag 3 Pag 1a Pag 1b Pag 2a Pag 3a Pag 3b De vuelta a inicio Inicio (portada) Menú Pagina1 pagina1a pagina1b Pagina2 pagina2a Pagina3 Pagina4 Programa común Página básica
¡Ahora Si! ¡Dreamweaver! ,[object Object],[object Object],[object Object],[object Object]
Dreamweaver: Interfase Barra de menú
Dreamweaver: Interfase Menú utilitario( este menú es cambiante)
Dreamweaver: Interfase Documento que tiene activo
Dreamweaver: Interfase Editor de texto HTML
Dreamweaver: Interfase “ Layout” de pantalla y funciones comunes del editor
Dreamweaver: Interfase Otras funciones prácticas del editor de HTML
¡Ahora Si! ¡Dreamweaver! ,[object Object],Editor visual : “Preview” de cómo se ve la página.
Dreamweaver: Interfase Propiedades del elemento activo aquí puede ver que cambios sencillos se le pueden hacer al elemento que tiene activo en el momento.
Dreamweaver: Interfase “ Tabs” de Funciones adicionales y controles de algunos elementos un tanto mas complejos.
Dreamweaver: Interfase Nota: Algunos elementos de la interfase no se ven hasta que el objeto sea seleccionado o se activen los mismos según sea necesario para el usuario. Nota: Al colocar el cursor sobre algunos de los elementos le  aparecerá una notita informativa de que es el elemento que esta seleccionando. Esto puede ser muy útil y ayuda a explorar la  interfase sin necesidad de mucha explicación. Insert Table
Dreamweaver: Interfase Los elementos de edición de texto son estandarizados para dar un sentido de familiaridad sobretodo en elementos de edición de texto que tienen un “look” similar al de Word.
Dreamweaver: Interfase Dreamweaver automáticamente genera el código necesario al crear un documento nuevo. el que no tiene experiencia en HTML puede de manera “sencilla” hacer su pagina en el editor visual y el programa le generará el código básico necesario. Le recomiendo que si no sabe lo que es no lo borre. El lenguaje HTML es bien preciso y estructurado un error puede  causar elementos extraños y situaciones aún mas extrañas.
Dreamweaver: Interfase El darle “right-click” al espacio  vacío dentro del editor visual le aparecerá un menú de opciones esto le será especialmente útil mientras usted trabaja. Si escoge propiedades verá las propiedades de su pagina y podrá editarlas.
Dreamweaver: Interfase Aquí puede manejar la apariencia  y detalles de su pagina. Desde el color de fondo, el título, el espacio del margen, el color del texto  y otras muchas opciones. También puede poner una imagen de fondo a su página
Dreamweaver: Interfase Estos son los “tools” comunes que permiten al usuario crear mediante unos clics elementos en la pagina de web utilizando Dreamweaver. Note que están divididos por clasificaciones. Common (elementos mas comunes) Image table layer horizontal line Character (caracteres especiales) Line break Space Forms (formas) field checkbox button list box
Dreamweaver: ¡Creemos algo! ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Dreamweaver: ¡Creemos algo! ,[object Object],[object Object],[object Object]
Dreamweaver: ¡Creemos algo! ,[object Object],[object Object],[object Object]
Dreamweaver: ¡Creemos algo! ,[object Object],[object Object],[object Object],[object Object]
Dreamweaver: ¡Creemos algo! ,[object Object],[object Object]
Dreamweaver: ¡Creemos algo! ,[object Object],[object Object],[object Object],[object Object]
Dreamweaver: ¡Creemos algo! ,[object Object],[object Object],[object Object],[object Object]
Dreamweaver: Guías a seguir. ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Otros términos… ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Dreamweaver: ¿huh? ,[object Object]
[object Object]

Weitere ähnliche Inhalte

Was ist angesagt?

Introduccion a la programacion
Introduccion a la programacionIntroduccion a la programacion
Introduccion a la programacionJose Marroquin
 
Diseño de interfaz de usuario
Diseño de interfaz de usuarioDiseño de interfaz de usuario
Diseño de interfaz de usuarioYesith Valencia
 
Aplicaciones de estándares de calidad en la construcción de algoritmo
Aplicaciones de estándares de calidad en la construcción de algoritmoAplicaciones de estándares de calidad en la construcción de algoritmo
Aplicaciones de estándares de calidad en la construcción de algoritmoFelix Rodríguez
 
Generaciones de los sistemas operativos
Generaciones de los sistemas operativosGeneraciones de los sistemas operativos
Generaciones de los sistemas operativosKenneth Tacuri Mora
 
Academia y administración. elaborar un cuadro comparativo que nos muestre l...
Academia y administración.  elaborar un cuadro comparativo que nos muestre l...Academia y administración.  elaborar un cuadro comparativo que nos muestre l...
Academia y administración. elaborar un cuadro comparativo que nos muestre l...INOCENCIO MELÉNDEZ JULIO
 
Ciclo de vida del Software.pdf
Ciclo de vida del Software.pdfCiclo de vida del Software.pdf
Ciclo de vida del Software.pdfcristobal461607
 
Fundamentos de desarrollo de sistemas unidad i
Fundamentos de desarrollo de sistemas unidad iFundamentos de desarrollo de sistemas unidad i
Fundamentos de desarrollo de sistemas unidad iAngeles Quezada
 
Evolución de las aplicaciones web
Evolución de las aplicaciones webEvolución de las aplicaciones web
Evolución de las aplicaciones webJorge Yngve Ohlin
 
Software, clasificacion y tipos
Software, clasificacion y tiposSoftware, clasificacion y tipos
Software, clasificacion y tiposSandra Mendoza
 
Historia y evolucion de la ofimatica
Historia y evolucion de la ofimaticaHistoria y evolucion de la ofimatica
Historia y evolucion de la ofimaticajmferca5
 
Trabajo de informatica word
Trabajo de informatica wordTrabajo de informatica word
Trabajo de informatica wordMichelle Carrera
 
Basic Computer Programming
Basic Computer ProgrammingBasic Computer Programming
Basic Computer ProgrammingAllen de Castro
 
Venajas y Desventajas del Software libre-y-privativo
Venajas y Desventajas del Software libre-y-privativoVenajas y Desventajas del Software libre-y-privativo
Venajas y Desventajas del Software libre-y-privativoMilton Cedeño
 

Was ist angesagt? (20)

Introduccion a la programacion
Introduccion a la programacionIntroduccion a la programacion
Introduccion a la programacion
 
Sistema operativo ms dos
Sistema operativo  ms dosSistema operativo  ms dos
Sistema operativo ms dos
 
Algoritmos
AlgoritmosAlgoritmos
Algoritmos
 
Diseño de interfaz de usuario
Diseño de interfaz de usuarioDiseño de interfaz de usuario
Diseño de interfaz de usuario
 
Aplicaciones de estándares de calidad en la construcción de algoritmo
Aplicaciones de estándares de calidad en la construcción de algoritmoAplicaciones de estándares de calidad en la construcción de algoritmo
Aplicaciones de estándares de calidad en la construcción de algoritmo
 
Generaciones de los sistemas operativos
Generaciones de los sistemas operativosGeneraciones de los sistemas operativos
Generaciones de los sistemas operativos
 
Academia y administración. elaborar un cuadro comparativo que nos muestre l...
Academia y administración.  elaborar un cuadro comparativo que nos muestre l...Academia y administración.  elaborar un cuadro comparativo que nos muestre l...
Academia y administración. elaborar un cuadro comparativo que nos muestre l...
 
Ciclo de vida del Software.pdf
Ciclo de vida del Software.pdfCiclo de vida del Software.pdf
Ciclo de vida del Software.pdf
 
Fundamentos de desarrollo de sistemas unidad i
Fundamentos de desarrollo de sistemas unidad iFundamentos de desarrollo de sistemas unidad i
Fundamentos de desarrollo de sistemas unidad i
 
Evolución de las aplicaciones web
Evolución de las aplicaciones webEvolución de las aplicaciones web
Evolución de las aplicaciones web
 
Software, clasificacion y tipos
Software, clasificacion y tiposSoftware, clasificacion y tipos
Software, clasificacion y tipos
 
Flowcharts
FlowchartsFlowcharts
Flowcharts
 
Historia y evolucion de la ofimatica
Historia y evolucion de la ofimaticaHistoria y evolucion de la ofimatica
Historia y evolucion de la ofimatica
 
Trabajo de informatica word
Trabajo de informatica wordTrabajo de informatica word
Trabajo de informatica word
 
Linea del tiempo POO
Linea del tiempo POOLinea del tiempo POO
Linea del tiempo POO
 
Basic Computer Programming
Basic Computer ProgrammingBasic Computer Programming
Basic Computer Programming
 
Lenguaje de programacion java
Lenguaje de programacion javaLenguaje de programacion java
Lenguaje de programacion java
 
Venajas y Desventajas del Software libre-y-privativo
Venajas y Desventajas del Software libre-y-privativoVenajas y Desventajas del Software libre-y-privativo
Venajas y Desventajas del Software libre-y-privativo
 
IT MARK
IT MARK IT MARK
IT MARK
 
Visual Basic. Net
Visual Basic. NetVisual Basic. Net
Visual Basic. Net
 

Ähnlich wie Taller de Dreamweaver 8

Ähnlich wie Taller de Dreamweaver 8 (20)

Ppt5 bcd.pptm recuperado
Ppt5 bcd.pptm recuperadoPpt5 bcd.pptm recuperado
Ppt5 bcd.pptm recuperado
 
Johan T,T
Johan T,TJohan T,T
Johan T,T
 
Presentación post
Presentación postPresentación post
Presentación post
 
Dreamweaver
DreamweaverDreamweaver
Dreamweaver
 
Presentación front page
Presentación front pagePresentación front page
Presentación front page
 
Dreamweaver cs5
Dreamweaver cs5Dreamweaver cs5
Dreamweaver cs5
 
Dreamweaver cs5
Dreamweaver cs5Dreamweaver cs5
Dreamweaver cs5
 
Linda eljach
Linda eljachLinda eljach
Linda eljach
 
Dreamweaver
DreamweaverDreamweaver
Dreamweaver
 
tutorial de dreamweaver
tutorial de dreamweavertutorial de dreamweaver
tutorial de dreamweaver
 
Diseño de Páginas Web
Diseño de Páginas WebDiseño de Páginas Web
Diseño de Páginas Web
 
Manual frontpage 2000
Manual frontpage 2000Manual frontpage 2000
Manual frontpage 2000
 
Manual frontpage 2000
Manual frontpage 2000Manual frontpage 2000
Manual frontpage 2000
 
Manual Dreamweaver
Manual DreamweaverManual Dreamweaver
Manual Dreamweaver
 
Dreamweaver
DreamweaverDreamweaver
Dreamweaver
 
MANUAL DE PROCESOS INFORMÁTICOS
MANUAL DE PROCESOS INFORMÁTICOSMANUAL DE PROCESOS INFORMÁTICOS
MANUAL DE PROCESOS INFORMÁTICOS
 
Dreamweaver Interfaz
Dreamweaver InterfazDreamweaver Interfaz
Dreamweaver Interfaz
 
Actividad de la 1 hasta la 5
Actividad de la 1 hasta la 5Actividad de la 1 hasta la 5
Actividad de la 1 hasta la 5
 
1 5
1 51 5
1 5
 
Dreamweaver cs5 marcela trocha
Dreamweaver cs5 marcela trochaDreamweaver cs5 marcela trocha
Dreamweaver cs5 marcela trocha
 

Taller de Dreamweaver 8

  • 1. Dreamweaver 8 Taller Mofonguero Por: Juan C. Peña Martínez
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17. Ejemplos de Flujograma Inicio Menú Pag 1 Pag 2 Pag 3 Pag 1a Pag 1b Pag 2a Pag 3a Pag 3b De vuelta a inicio Inicio (portada) Menú Pagina1 pagina1a pagina1b Pagina2 pagina2a Pagina3 Pagina4 Programa común Página básica
  • 18.
  • 20. Dreamweaver: Interfase Menú utilitario( este menú es cambiante)
  • 23. Dreamweaver: Interfase “ Layout” de pantalla y funciones comunes del editor
  • 24. Dreamweaver: Interfase Otras funciones prácticas del editor de HTML
  • 25.
  • 26. Dreamweaver: Interfase Propiedades del elemento activo aquí puede ver que cambios sencillos se le pueden hacer al elemento que tiene activo en el momento.
  • 27. Dreamweaver: Interfase “ Tabs” de Funciones adicionales y controles de algunos elementos un tanto mas complejos.
  • 28. Dreamweaver: Interfase Nota: Algunos elementos de la interfase no se ven hasta que el objeto sea seleccionado o se activen los mismos según sea necesario para el usuario. Nota: Al colocar el cursor sobre algunos de los elementos le aparecerá una notita informativa de que es el elemento que esta seleccionando. Esto puede ser muy útil y ayuda a explorar la interfase sin necesidad de mucha explicación. Insert Table
  • 29. Dreamweaver: Interfase Los elementos de edición de texto son estandarizados para dar un sentido de familiaridad sobretodo en elementos de edición de texto que tienen un “look” similar al de Word.
  • 30. Dreamweaver: Interfase Dreamweaver automáticamente genera el código necesario al crear un documento nuevo. el que no tiene experiencia en HTML puede de manera “sencilla” hacer su pagina en el editor visual y el programa le generará el código básico necesario. Le recomiendo que si no sabe lo que es no lo borre. El lenguaje HTML es bien preciso y estructurado un error puede causar elementos extraños y situaciones aún mas extrañas.
  • 31. Dreamweaver: Interfase El darle “right-click” al espacio vacío dentro del editor visual le aparecerá un menú de opciones esto le será especialmente útil mientras usted trabaja. Si escoge propiedades verá las propiedades de su pagina y podrá editarlas.
  • 32. Dreamweaver: Interfase Aquí puede manejar la apariencia y detalles de su pagina. Desde el color de fondo, el título, el espacio del margen, el color del texto y otras muchas opciones. También puede poner una imagen de fondo a su página
  • 33. Dreamweaver: Interfase Estos son los “tools” comunes que permiten al usuario crear mediante unos clics elementos en la pagina de web utilizando Dreamweaver. Note que están divididos por clasificaciones. Common (elementos mas comunes) Image table layer horizontal line Character (caracteres especiales) Line break Space Forms (formas) field checkbox button list box
  • 34.
  • 35.
  • 36.
  • 37.
  • 38.
  • 39.
  • 40.
  • 41.
  • 42.
  • 43.
  • 44.