SlideShare una empresa de Scribd logo
1 de 21
MI PRIMER SITIO WEB




¿Qué es Adobe Dreamweaver?

Es una aplicaciónque está destinada a la construcción, diseño y edición de sitios y aplicaciones
Web.

Lo que puede hacer con Dreamweaver 8

        Las funciones de edición visual de Dreamweaver permiten crear páginas Web de forma
        rápida, sin escribir una sola línea de código.
        Puede ver todos los elementos o activos del sitio y arrastrarlos desde un panel fácil de
        usardirectamente hasta un documento.
        Puede agilizar el flujo de trabajo de desarrollo mediante la creación y edición de
        imágenes en Macromedia Fireworks o en otra aplicación de gráficos y su posterior
        importacióndirecta a Dreamweaver.
        Dreamweaver también contiene herramientas que facilitan la adición de activos de
        Flash a las páginas web.

Diseño del espacio de trabajo.
MI PRIMER SITIO WEB




      LO PRIMERO QUE NECESITO HACER PARA CREAR EL SITIO WEB


Abrir el programa de Dw y nos aparecerá la siguiente ventana.
Dar clic en el icono de SITIO DE DREAM WEAVER.
MI PRIMER SITIO WEB




Después no mostrara una venta como esta, y escribiremos en donde dice ¿Qué nombre desea
asignar al sitio? Y pondremos MI SITIO y damos siguiente.
MI PRIMER SITIO WEB




En la siguiente ventana seleccionamos la opción de No, no deseo utilizar una tecnología de
servidor y damos siguiente.
MI PRIMER SITIO WEB




En la siguiente ventana solamente damos clic en siguiente dejamos los datos que se nos
muestran.
MI PRIMER SITIO WEB




En la siguiente ventana nos pregunta ¿Cómo conectar con su servidor remoto? Y
seleccionamos NINGUNO y siguiente.
MI PRIMER SITIO WEB




En la siguiente ventana solamente nos muestra un resumen de todo lo que acezamos y
solamente le damos clic en COMPLETADO.
MI PRIMER SITIO WEB




Ya que terminamos todos estos pasos, se nos muestra la siguiente ventana y seleccionaremos
la aplicación de HTML.
MI PRIMER SITIO WEB


¿Qué NECESITO PRIMERO PARA DISEÑAR MI PRIMER WEB?

NECESITO DISEÑAR LOS BOTONES
EL Diseño de botones: nos permiten enlazar las páginas al momento de dar clic.
Estos son algunos diseños de los botones.




¿Cómo deben de ser los botones?

Deben tener la misma forma y línea de color.
MI PRIMER SITIO WEB




¿Cómo voy a diseñar los botones?

    •   Los podemos diseñar en Photoshop, Corel o Power Point.
    •   Si es el photoshop hay editarlos luego guardarlo como imagen jpg o gif para que no se
        vea el fondo.
    •   Si es en el corel se deben diseñar de uno en uno y luego dar control + e, y guardarlo
        como jpg, aceptar.
    •   Si es el powerpoint hay q hacerlo en insertar formas y luego dar clic sobre la imagen y
        guardarlo.



Diseñando Banner.
Es un formato publicitario en Internet. Esta forma de publicidad online consiste en incluir
una pieza publicitaria dentro de una página web. Prácticamente en la totalidad de los casos, su
objetivo es atraer tráfico hacia el sitio web del anunciante que paga por su inclusión.
Estos pueden ser horizontales o verticales. Las medidas son las siguientes.
MI PRIMER SITIO WEB




Ejemplos de banner`s
MI PRIMER SITIO WEB

¿Qué otra cosa necesito para mi diseño de mi                                          WEB?

Necesito escoger el fondo o los colores que estarán de fondo de mi página web. Este fondo
debe combinar con todos las aplicaciones que contendrá mi página considerando el diseño de
los botones, la tipografía y las imágenes.

¿Qué contendrá en LINK de INICIO?
Este contendrá lo que oferta mi empresa, a que se dedica o que promueve o vende.

¿Qué contendrá en LINK de HISTORIA?
Es el relato de cómo nace la empresa, los hechos históricos, fotos de la empresa del antes y
después, fotos de los creadores de la empresa.

¿Qué contendrá en LINK de MISIÓN?
Es la razón de ser de la empresa, el motivo por el cual existe.Asi mismo es la determinación de
la/las funciones básicas que la empresa va a desempeñar en un entorno determinado para
conseguir tal misión.
En la misión se define: la necesidad a satisfacer, los clientes a alcanzar, productos y servicios a
ofertar.

¿Qué contendrá en LINK de VISIÓN?
Se refiere a lo que la empresa quiere crear, la imagen futura de la organización.
La visión es creada por la persona encargada de dirigir la empresa, y quien tiene que valorar e
incluir en su análisis muchas de las aspiraciones de los agentes que componen la organización,
tanto internos como externos.
La visión se realiza formulando una imagen ideal del proyecto y poniéndola por escrito, a fin de
crear el sueño (compartido por todos los que tomen parte en la iniciativa) de lo que debe ser
en el futuro la empresa.

¿Qué contendrá en LINK de VISIÓN?
Los valores son aquellos juicios éticos sobre situaciones imaginarias o reales a los cuales nos
sentimos más inclinados por su grado de utilidad personal y social.
Los valores de la empresa son los pilares más importantes de cualquier organización. Con ellos
en realidad se define así misma, porque los valores de una organización son los valores de sus
miembros, y especialmente los de sus dirigentes.
Los empresarios deben desarrollar virtudes como la templanza, la prudencia, la justicia y la
fortaleza para ser transmisores de un verdadero liderazgo.


¿Qué contendrá en LINK de GANELERIA?
Este contendrá imágenes referentes a lo que mi empresa vende o promueve.

¿Qué contendrá en LINK de CONTACTO?
Sera la información de la empresa ubicación, teléfono, correo electrónico o un mapa de
ubicación. Quien es la persona encargada.
MI PRIMER SITIO WEB

¿Y luego?

Ya que tengo toda la información requerida en texto, imágenes, botones, fotos, etc.
Buscaremos la carpeta que creamos en el sitio web, esta estará alojada en mis DOCUMENTOS
y se llama la carpeta MI SITIO, en esta carpeta agregaremos los botones y las imágenes o
fotos. Aquí se almacenará todo.

¿Y después qué?

Ahora si empezaremos a diseñar nuestra web en el programa de Dw.

Seleccionamos HTML y se nos abrirá la ventana para diseñar el sitio WEB.

¿Qué debo de conocer antes de empezar a diseñar?

En la parte derecha inferior como se muestra encerrado en recuadro rojo, está la aplicación de
ACCIONES, aquí nos muestra la carpeta MI SITIO con todos los elementos que contiene esa
carpeta fotos imágenes y botones y todo lo que queramos agregar. Si queremos INSERTAR un
elemento de esta carpeta a nuestra PLANTILLA de WEB solamente lo seleccionamos el objeto y
lo arrastramos a la plantilla para agregarlo y poderlo manipular dentro.
MI PRIMER SITIO WEB


El siguiente paso es INSERTAR una tabla asi como se muestra en la          siguiente
imagen damos clic.




Ya que damos clic nos muestra la siguiente ventana, y seleccionamos lo siguiente: en FILAS
ponemos 7 en COLUMNAS ponemos 7, en ANCHO DE TABLA ponemos 750 pixeles, GROSOR DE
BORDE ponemos CERO y seleccionamos la aplicación AMBOS y damos aceptar
MI PRIMER SITIO WEB


Nos parecerá una tabla con CELDAS las cuales podemos mover o               hacerlas mas
grande dependiendo del acomodo de lo que contendrá nuestra página WEB.




¿Cómo voy a trabajar con esta tabla en la distribución de los elementos?




Selecciono 5 celdas como se muestra en la siguiente imagen
MI PRIMER SITIO WEB


Ya que seleccione las 5 celdas doy clc derecho y me aparece una               ventana,
selecciono la opcion de COMBINAR CELDAS, para que las celdas que seleccione las pueda uni
en una sola ya que en esta parte pondremos el Banner horizontal.
Tambien en esta ventana de opciones de tabla, nos permite insertar mas filas o columnas.




Ya que hicimos este paso agregamos el banner y ajustamos las celdas al tamaño, como se
muestra en la siguiente imagen.
MI PRIMER SITIO WEB




Ejemplo de banner vertical.




Agregando los botones de forma horizontal. Solamente seleccionamos los botones y los
arrastramos a la celda que queremos que estén.
MI PRIMER SITIO WEB




Después para guardar todo lo que estamos haciendo damos clic en F12 y nos aparecerá una
venta que dice que si deseamos guardar y le damos la opción de SI y nos aparecerá una
ventana para agregar el nombre de nuestra primer página que la nombraremos INDEX y le
damos únicamente GUARDAR, ya que terminamos este paso se nos abrirá la página del
explorador para visualizar la vista previa de la página, cada vez que demos F12 nos mostrara
que queremos guardar y después nos mostrara la vista preliminar.
MI PRIMER SITIO WEB




Agregando fondo.

Seleccionamos las siguientes celdas y damos clic derecho seleccionamos tabla y combinar
celdas como se muestra en la siguiente imagen.



Ya que seleccionamos las celdas y las combinamos insertamos el fondo que queremos que
aparezca. Ajustamos la imagen de fondo dando clic derecho sobra la imagen y nos aparecerá
una ventana y seleccionamos la opción de ALINEAR y nos aparecerán diferentes opciones para
alinear nuestra imagen y ajustarla a la página web.

Otra forma de agregar fondo es: en la barra de propiedades de la parte de abajo como se
muestra en la imagen, dar clic en PROPIEDADES DE LA PAGINA y nos mostrara una ventana,
seleccionamos la opción de ASPECTO, y seleccionamos la opción de EXAMINAR la IMAGEN DE
FONDO, y buscamos la imagen que queremos que aparezca, después le damos clic en la opción
REPETIR si queremos que se repita o no, después ya que seleccionamos le damos ACEPTAR o
APLICAR.
MI PRIMER SITIO WEB




Clic en la opción de PROPIEDADES DE LA PAGINA.




Muestra de la ventana de las PROPIEDADES DE LA PAGINA
MI PRIMER SITIO WEB

¿Cómo hacer vínculos?

Selecciono el BOTON ya que lo tengo seleccionado, en la barra de PROPIEDADES esta la opción
de VÍNCULO presiono en icono del CÍRCULO y arrastro con una FLECHA que aparece a la página
que deseo vincular con el BOTON, ver la imagen.

Paso 1: selección del botón que queremos vincular.
Paso 2: seleccionar el icono de VINCULO.
Paso 3: Arrastrar con la flecha a la página que queremos vincular.

Más contenido relacionado

La actualidad más candente

Word tablas y graficos estadisticos - para combinar
Word   tablas y graficos estadisticos - para combinarWord   tablas y graficos estadisticos - para combinar
Word tablas y graficos estadisticos - para combinarwiningther94
 
Presentacion Inkscape
Presentacion InkscapePresentacion Inkscape
Presentacion InkscapeAinara Pérez
 
2 da unidad corel draw
2 da unidad corel draw2 da unidad corel draw
2 da unidad corel drawJavier Avalos
 
¿Cómo insertar encabezado y pie de página en Word?
¿Cómo insertar encabezado y pie de página en Word?¿Cómo insertar encabezado y pie de página en Word?
¿Cómo insertar encabezado y pie de página en Word?redcapacitadorestic
 
Ejercicios coreldraw
Ejercicios coreldrawEjercicios coreldraw
Ejercicios coreldrawLuis Abadia
 
Introducción corel draw
Introducción corel drawIntroducción corel draw
Introducción corel drawDiego Sánchez
 
insertar tablas en word
insertar tablas en word insertar tablas en word
insertar tablas en word Ivan Zuñiga
 
Planeacion de clase s de computacion
Planeacion de clase s de computacionPlaneacion de clase s de computacion
Planeacion de clase s de computacionRalyp de Garcia
 
3ra unidad corel draw
3ra unidad corel draw3ra unidad corel draw
3ra unidad corel drawJavier Avalos
 
Practica Nº05 Corel Draw
Practica Nº05 Corel DrawPractica Nº05 Corel Draw
Practica Nº05 Corel DrawDaniel Zavala
 
Orientaciones para el uso de la app scratch jr
Orientaciones para el uso de la app scratch jrOrientaciones para el uso de la app scratch jr
Orientaciones para el uso de la app scratch jrCAROLbenites
 
Power Point ejercicios
Power Point ejerciciosPower Point ejercicios
Power Point ejerciciosCarlos Robayo
 

La actualidad más candente (20)

Examen de corel draw
Examen de corel drawExamen de corel draw
Examen de corel draw
 
Corel draw clase 1 - 2 do secundaria
Corel draw clase 1 -  2 do secundariaCorel draw clase 1 -  2 do secundaria
Corel draw clase 1 - 2 do secundaria
 
Word tablas y graficos estadisticos - para combinar
Word   tablas y graficos estadisticos - para combinarWord   tablas y graficos estadisticos - para combinar
Word tablas y graficos estadisticos - para combinar
 
Herramientas interactivas
Herramientas interactivasHerramientas interactivas
Herramientas interactivas
 
Presentacion Inkscape
Presentacion InkscapePresentacion Inkscape
Presentacion Inkscape
 
Ejercicios Corel Draw basico
Ejercicios Corel Draw basicoEjercicios Corel Draw basico
Ejercicios Corel Draw basico
 
2 da unidad corel draw
2 da unidad corel draw2 da unidad corel draw
2 da unidad corel draw
 
¿Cómo insertar encabezado y pie de página en Word?
¿Cómo insertar encabezado y pie de página en Word?¿Cómo insertar encabezado y pie de página en Word?
¿Cómo insertar encabezado y pie de página en Word?
 
Ejercicios coreldraw
Ejercicios coreldrawEjercicios coreldraw
Ejercicios coreldraw
 
Introducción corel draw
Introducción corel drawIntroducción corel draw
Introducción corel draw
 
insertar tablas en word
insertar tablas en word insertar tablas en word
insertar tablas en word
 
COREL DRAW
COREL DRAWCOREL DRAW
COREL DRAW
 
Planeacion de clase s de computacion
Planeacion de clase s de computacionPlaneacion de clase s de computacion
Planeacion de clase s de computacion
 
3ra unidad corel draw
3ra unidad corel draw3ra unidad corel draw
3ra unidad corel draw
 
Cuadernillo corel draw para imprimir 2017
Cuadernillo corel draw para imprimir 2017Cuadernillo corel draw para imprimir 2017
Cuadernillo corel draw para imprimir 2017
 
Practica Nº05 Corel Draw
Practica Nº05 Corel DrawPractica Nº05 Corel Draw
Practica Nº05 Corel Draw
 
Google Sites (Guía Básica)
Google Sites (Guía Básica)Google Sites (Guía Básica)
Google Sites (Guía Básica)
 
Orientaciones para el uso de la app scratch jr
Orientaciones para el uso de la app scratch jrOrientaciones para el uso de la app scratch jr
Orientaciones para el uso de la app scratch jr
 
Power Point ejercicios
Power Point ejerciciosPower Point ejercicios
Power Point ejercicios
 
GUÍA DE APRENDIZAJE - EXCEL BÁSICO
GUÍA DE APRENDIZAJE - EXCEL BÁSICOGUÍA DE APRENDIZAJE - EXCEL BÁSICO
GUÍA DE APRENDIZAJE - EXCEL BÁSICO
 

Destacado

Manual dreamweaver 8 spanish
Manual dreamweaver 8 spanishManual dreamweaver 8 spanish
Manual dreamweaver 8 spanishbetosix1
 
Procedimientos para crear una página web con dream weaver
Procedimientos para crear una página web con dream weaverProcedimientos para crear una página web con dream weaver
Procedimientos para crear una página web con dream weaverRacsosabe
 
Creacion de sitio web en dreamweaver
Creacion de sitio web en dreamweaverCreacion de sitio web en dreamweaver
Creacion de sitio web en dreamweavervanerin64
 
Dreamweaver Interfaz
Dreamweaver InterfazDreamweaver Interfaz
Dreamweaver Interfazr2diseno
 
Ventana de dreamweaver
Ventana de dreamweaverVentana de dreamweaver
Ventana de dreamweaverastridcmc
 
Taller de Dreamweaver 8
Taller de Dreamweaver 8Taller de Dreamweaver 8
Taller de Dreamweaver 8Juan Pena
 
Adobe flash player yupanqui b2
Adobe flash player   yupanqui b2Adobe flash player   yupanqui b2
Adobe flash player yupanqui b2Edison Fyp
 
Ventana de dreamweaver
Ventana de dreamweaverVentana de dreamweaver
Ventana de dreamweaverAlin Ariza
 
Ventana de Dreamweaver
Ventana de DreamweaverVentana de Dreamweaver
Ventana de Dreamweaver'Kelly Vergara
 
Ventana de dreamweaver
Ventana de dreamweaverVentana de dreamweaver
Ventana de dreamweaverIvan Llerena
 
Sistema operativo 5
Sistema operativo 5Sistema operativo 5
Sistema operativo 5AlmuPe
 
Sistema operativo3
Sistema operativo3Sistema operativo3
Sistema operativo3ecastelar
 
Como crear hiperenlaces en dreamwever
Como crear hiperenlaces en dreamweverComo crear hiperenlaces en dreamwever
Como crear hiperenlaces en dreamweverMarco Macias
 
Adobe dreamweaver cs6
Adobe dreamweaver cs6Adobe dreamweaver cs6
Adobe dreamweaver cs6Daniel Mf
 

Destacado (20)

Curso Dreamweaver CS6
Curso Dreamweaver CS6Curso Dreamweaver CS6
Curso Dreamweaver CS6
 
Manual dreamweaver 8 spanish
Manual dreamweaver 8 spanishManual dreamweaver 8 spanish
Manual dreamweaver 8 spanish
 
Procedimientos para crear una página web con dream weaver
Procedimientos para crear una página web con dream weaverProcedimientos para crear una página web con dream weaver
Procedimientos para crear una página web con dream weaver
 
Creacion de sitio web en dreamweaver
Creacion de sitio web en dreamweaverCreacion de sitio web en dreamweaver
Creacion de sitio web en dreamweaver
 
Manual de practicas de dreamweaver
Manual de practicas de dreamweaverManual de practicas de dreamweaver
Manual de practicas de dreamweaver
 
Dreamweaver Interfaz
Dreamweaver InterfazDreamweaver Interfaz
Dreamweaver Interfaz
 
Ventana de dreamweaver
Ventana de dreamweaverVentana de dreamweaver
Ventana de dreamweaver
 
Taller de Dreamweaver 8
Taller de Dreamweaver 8Taller de Dreamweaver 8
Taller de Dreamweaver 8
 
Manual dreamweaver CC
Manual dreamweaver CCManual dreamweaver CC
Manual dreamweaver CC
 
Adobe flash player yupanqui b2
Adobe flash player   yupanqui b2Adobe flash player   yupanqui b2
Adobe flash player yupanqui b2
 
Ventana de dreamweaver
Ventana de dreamweaverVentana de dreamweaver
Ventana de dreamweaver
 
Ventana de Dreamweaver
Ventana de DreamweaverVentana de Dreamweaver
Ventana de Dreamweaver
 
Dreamweaver Tutorial
Dreamweaver Tutorial Dreamweaver Tutorial
Dreamweaver Tutorial
 
Ventana de dreamweaver
Ventana de dreamweaverVentana de dreamweaver
Ventana de dreamweaver
 
Sistema operativo 5
Sistema operativo 5Sistema operativo 5
Sistema operativo 5
 
Sistema operativo3
Sistema operativo3Sistema operativo3
Sistema operativo3
 
Pasos para interpolacion de forma
Pasos para interpolacion de formaPasos para interpolacion de forma
Pasos para interpolacion de forma
 
Como crear hiperenlaces en dreamwever
Como crear hiperenlaces en dreamweverComo crear hiperenlaces en dreamwever
Como crear hiperenlaces en dreamwever
 
Grado 11 - dreamweaver
Grado 11 - dreamweaverGrado 11 - dreamweaver
Grado 11 - dreamweaver
 
Adobe dreamweaver cs6
Adobe dreamweaver cs6Adobe dreamweaver cs6
Adobe dreamweaver cs6
 

Similar a Manual de DreamWeaver

Cómo crear un sitio web en WIX
Cómo crear un sitio web en WIXCómo crear un sitio web en WIX
Cómo crear un sitio web en WIXisabeland8
 
962689287.tutorial google drive presentaciones
962689287.tutorial google drive presentaciones962689287.tutorial google drive presentaciones
962689287.tutorial google drive presentacionesAndy Caicedo Ortiz
 
Como trabajar en prezi
Como trabajar en preziComo trabajar en prezi
Como trabajar en preziJoana Medina
 
Cómo publicar en una página con enlace externo en blogger.
Cómo publicar en una página con enlace externo en blogger.Cómo publicar en una página con enlace externo en blogger.
Cómo publicar en una página con enlace externo en blogger.Luis Egberto Carrera Ledezma
 
Proyecto Tecnico,
Proyecto Tecnico,Proyecto Tecnico,
Proyecto Tecnico,soccorro
 
Manual y Tutorial Prezi
Manual y Tutorial  Prezi Manual y Tutorial  Prezi
Manual y Tutorial Prezi valecondo2014
 
¿Cómo crear una pestaña que permita a los fans de la marca acceder a nuestra ...
¿Cómo crear una pestaña que permita a los fans de la marca acceder a nuestra ...¿Cómo crear una pestaña que permita a los fans de la marca acceder a nuestra ...
¿Cómo crear una pestaña que permita a los fans de la marca acceder a nuestra ...Dani Ortega
 
¿Cómo crear una pestaña que permita a los fans de la marca acceder a nuestra ...
¿Cómo crear una pestaña que permita a los fans de la marca acceder a nuestra ...¿Cómo crear una pestaña que permita a los fans de la marca acceder a nuestra ...
¿Cómo crear una pestaña que permita a los fans de la marca acceder a nuestra ...Dani Ortega
 
Creación de Portafolio WIX
Creación de Portafolio WIXCreación de Portafolio WIX
Creación de Portafolio WIXll
 
Tutorial wix
Tutorial wixTutorial wix
Tutorial wixjenniz
 
Configuracion de-joomla completo
Configuracion de-joomla completoConfiguracion de-joomla completo
Configuracion de-joomla completoKhriss Jativa
 
Cómo Usar RVsitebuilder
Cómo Usar RVsitebuilderCómo Usar RVsitebuilder
Cómo Usar RVsitebuilderHostname Ltda.
 

Similar a Manual de DreamWeaver (20)

Manual de dw tutorial
Manual de dw tutorialManual de dw tutorial
Manual de dw tutorial
 
Cómo crear un sitio web en WIX
Cómo crear un sitio web en WIXCómo crear un sitio web en WIX
Cómo crear un sitio web en WIX
 
962689287.tutorial google drive presentaciones
962689287.tutorial google drive presentaciones962689287.tutorial google drive presentaciones
962689287.tutorial google drive presentaciones
 
Como trabajar en prezi
Como trabajar en preziComo trabajar en prezi
Como trabajar en prezi
 
Cómo publicar en una página con enlace externo en blogger.
Cómo publicar en una página con enlace externo en blogger.Cómo publicar en una página con enlace externo en blogger.
Cómo publicar en una página con enlace externo en blogger.
 
Proyecto Tecnico,
Proyecto Tecnico,Proyecto Tecnico,
Proyecto Tecnico,
 
Manual y Tutorial Prezi
Manual y Tutorial  Prezi Manual y Tutorial  Prezi
Manual y Tutorial Prezi
 
¿Cómo crear una pestaña que permita a los fans de la marca acceder a nuestra ...
¿Cómo crear una pestaña que permita a los fans de la marca acceder a nuestra ...¿Cómo crear una pestaña que permita a los fans de la marca acceder a nuestra ...
¿Cómo crear una pestaña que permita a los fans de la marca acceder a nuestra ...
 
¿Cómo crear una pestaña que permita a los fans de la marca acceder a nuestra ...
¿Cómo crear una pestaña que permita a los fans de la marca acceder a nuestra ...¿Cómo crear una pestaña que permita a los fans de la marca acceder a nuestra ...
¿Cómo crear una pestaña que permita a los fans de la marca acceder a nuestra ...
 
Creación de Portafolio WIX
Creación de Portafolio WIXCreación de Portafolio WIX
Creación de Portafolio WIX
 
Tutorial wix
Tutorial wixTutorial wix
Tutorial wix
 
Configuracion de-joomla completo
Configuracion de-joomla completoConfiguracion de-joomla completo
Configuracion de-joomla completo
 
Cómo Usar RVsitebuilder
Cómo Usar RVsitebuilderCómo Usar RVsitebuilder
Cómo Usar RVsitebuilder
 
Creación sitio y pagina web
Creación sitio y pagina webCreación sitio y pagina web
Creación sitio y pagina web
 
Genially
GeniallyGenially
Genially
 
Guia RáPida De MyEgoo
Guia RáPida De MyEgooGuia RáPida De MyEgoo
Guia RáPida De MyEgoo
 
Tp nº3
Tp nº3Tp nº3
Tp nº3
 
Tp nº3
Tp nº3Tp nº3
Tp nº3
 
Eliseo drenwever 8
Eliseo drenwever 8Eliseo drenwever 8
Eliseo drenwever 8
 
Manual jimdo (1)
Manual jimdo (1)Manual jimdo (1)
Manual jimdo (1)
 

Más de arte6

DibujoSTAND
DibujoSTANDDibujoSTAND
DibujoSTANDarte6
 
Stand
Stand Stand
Stand arte6
 
La verdad
La verdadLa verdad
La verdadarte6
 
Calif 3B Enero Febrero
Calif 3B Enero Febrero Calif 3B Enero Febrero
Calif 3B Enero Febrero arte6
 
Calif 3a Enero Febrero
Calif 3a Enero FebreroCalif 3a Enero Febrero
Calif 3a Enero Febreroarte6
 
Aspectos para evaluar la pagina web de ingles
Aspectos para evaluar la pagina web de inglesAspectos para evaluar la pagina web de ingles
Aspectos para evaluar la pagina web de inglesarte6
 
Aspectos para evaluar la pagina web de ingles
Aspectos para evaluar la pagina web de inglesAspectos para evaluar la pagina web de ingles
Aspectos para evaluar la pagina web de inglesarte6
 
Aspectos para el diseño de la web de la empresa
Aspectos para el diseño de la web de la empresaAspectos para el diseño de la web de la empresa
Aspectos para el diseño de la web de la empresaarte6
 
Códigos para la creación de la pagina web
Códigos para la creación de la pagina webCódigos para la creación de la pagina web
Códigos para la creación de la pagina webarte6
 
Temas informática Enero 2012
Temas informática Enero 2012Temas informática Enero 2012
Temas informática Enero 2012arte6
 
Calificaciones 3A Enero 2012
Calificaciones 3A Enero 2012Calificaciones 3A Enero 2012
Calificaciones 3A Enero 2012arte6
 
Calificaciones 3b ENERO 2012
Calificaciones 3b ENERO 2012Calificaciones 3b ENERO 2012
Calificaciones 3b ENERO 2012arte6
 
Diseño web
Diseño webDiseño web
Diseño webarte6
 
Proyecto de ingles
Proyecto de inglesProyecto de ingles
Proyecto de inglesarte6
 

Más de arte6 (14)

DibujoSTAND
DibujoSTANDDibujoSTAND
DibujoSTAND
 
Stand
Stand Stand
Stand
 
La verdad
La verdadLa verdad
La verdad
 
Calif 3B Enero Febrero
Calif 3B Enero Febrero Calif 3B Enero Febrero
Calif 3B Enero Febrero
 
Calif 3a Enero Febrero
Calif 3a Enero FebreroCalif 3a Enero Febrero
Calif 3a Enero Febrero
 
Aspectos para evaluar la pagina web de ingles
Aspectos para evaluar la pagina web de inglesAspectos para evaluar la pagina web de ingles
Aspectos para evaluar la pagina web de ingles
 
Aspectos para evaluar la pagina web de ingles
Aspectos para evaluar la pagina web de inglesAspectos para evaluar la pagina web de ingles
Aspectos para evaluar la pagina web de ingles
 
Aspectos para el diseño de la web de la empresa
Aspectos para el diseño de la web de la empresaAspectos para el diseño de la web de la empresa
Aspectos para el diseño de la web de la empresa
 
Códigos para la creación de la pagina web
Códigos para la creación de la pagina webCódigos para la creación de la pagina web
Códigos para la creación de la pagina web
 
Temas informática Enero 2012
Temas informática Enero 2012Temas informática Enero 2012
Temas informática Enero 2012
 
Calificaciones 3A Enero 2012
Calificaciones 3A Enero 2012Calificaciones 3A Enero 2012
Calificaciones 3A Enero 2012
 
Calificaciones 3b ENERO 2012
Calificaciones 3b ENERO 2012Calificaciones 3b ENERO 2012
Calificaciones 3b ENERO 2012
 
Diseño web
Diseño webDiseño web
Diseño web
 
Proyecto de ingles
Proyecto de inglesProyecto de ingles
Proyecto de ingles
 

Último

7.2 -La guerra civil. Evolución de los bandos y consecuencias-Marta y Elena (...
7.2 -La guerra civil. Evolución de los bandos y consecuencias-Marta y Elena (...7.2 -La guerra civil. Evolución de los bandos y consecuencias-Marta y Elena (...
7.2 -La guerra civil. Evolución de los bandos y consecuencias-Marta y Elena (...jose880240
 
Blue_Aesthetic_Mood_Board_Brand_Inspiration_Poster.pdf
Blue_Aesthetic_Mood_Board_Brand_Inspiration_Poster.pdfBlue_Aesthetic_Mood_Board_Brand_Inspiration_Poster.pdf
Blue_Aesthetic_Mood_Board_Brand_Inspiration_Poster.pdfNOEMIFONTEROMERO1
 
TECNOLOGIA ARQUITECTONICA - CASO IQUITOS - PERU
TECNOLOGIA ARQUITECTONICA - CASO IQUITOS - PERUTECNOLOGIA ARQUITECTONICA - CASO IQUITOS - PERU
TECNOLOGIA ARQUITECTONICA - CASO IQUITOS - PERUAlexander VA
 
Metodo-cuadricula-HyST para medicion con luxometro
Metodo-cuadricula-HyST para medicion con luxometroMetodo-cuadricula-HyST para medicion con luxometro
Metodo-cuadricula-HyST para medicion con luxometrojuanpiorellanodocent
 
word-ejercicios-tabulaciones-taller..doc
word-ejercicios-tabulaciones-taller..docword-ejercicios-tabulaciones-taller..doc
word-ejercicios-tabulaciones-taller..docGeorgeGuerreroNuez
 
Planos seriados, conceptos, caracterización y aplicaciones
Planos seriados, conceptos, caracterización y aplicacionesPlanos seriados, conceptos, caracterización y aplicaciones
Planos seriados, conceptos, caracterización y aplicacionesthauromaniko
 
LA NEUROARQUITECTURA COMO ESTRATEGIA DE DISEŇO PARA LA SALUD MENTAL
LA NEUROARQUITECTURA COMO ESTRATEGIA DE DISEŇO PARA LA SALUD MENTALLA NEUROARQUITECTURA COMO ESTRATEGIA DE DISEŇO PARA LA SALUD MENTAL
LA NEUROARQUITECTURA COMO ESTRATEGIA DE DISEŇO PARA LA SALUD MENTALPaolaPeguero4
 
Induccion Personal Mision S&A (nueva).pdf
Induccion Personal Mision S&A (nueva).pdfInduccion Personal Mision S&A (nueva).pdf
Induccion Personal Mision S&A (nueva).pdfstefatoro1392
 
La Bauhaus y la nueva tipografía en el diseño gráfico
La Bauhaus y la nueva tipografía en el diseño gráficoLa Bauhaus y la nueva tipografía en el diseño gráfico
La Bauhaus y la nueva tipografía en el diseño gráficoCristianLobo10
 

Último (9)

7.2 -La guerra civil. Evolución de los bandos y consecuencias-Marta y Elena (...
7.2 -La guerra civil. Evolución de los bandos y consecuencias-Marta y Elena (...7.2 -La guerra civil. Evolución de los bandos y consecuencias-Marta y Elena (...
7.2 -La guerra civil. Evolución de los bandos y consecuencias-Marta y Elena (...
 
Blue_Aesthetic_Mood_Board_Brand_Inspiration_Poster.pdf
Blue_Aesthetic_Mood_Board_Brand_Inspiration_Poster.pdfBlue_Aesthetic_Mood_Board_Brand_Inspiration_Poster.pdf
Blue_Aesthetic_Mood_Board_Brand_Inspiration_Poster.pdf
 
TECNOLOGIA ARQUITECTONICA - CASO IQUITOS - PERU
TECNOLOGIA ARQUITECTONICA - CASO IQUITOS - PERUTECNOLOGIA ARQUITECTONICA - CASO IQUITOS - PERU
TECNOLOGIA ARQUITECTONICA - CASO IQUITOS - PERU
 
Metodo-cuadricula-HyST para medicion con luxometro
Metodo-cuadricula-HyST para medicion con luxometroMetodo-cuadricula-HyST para medicion con luxometro
Metodo-cuadricula-HyST para medicion con luxometro
 
word-ejercicios-tabulaciones-taller..doc
word-ejercicios-tabulaciones-taller..docword-ejercicios-tabulaciones-taller..doc
word-ejercicios-tabulaciones-taller..doc
 
Planos seriados, conceptos, caracterización y aplicaciones
Planos seriados, conceptos, caracterización y aplicacionesPlanos seriados, conceptos, caracterización y aplicaciones
Planos seriados, conceptos, caracterización y aplicaciones
 
LA NEUROARQUITECTURA COMO ESTRATEGIA DE DISEŇO PARA LA SALUD MENTAL
LA NEUROARQUITECTURA COMO ESTRATEGIA DE DISEŇO PARA LA SALUD MENTALLA NEUROARQUITECTURA COMO ESTRATEGIA DE DISEŇO PARA LA SALUD MENTAL
LA NEUROARQUITECTURA COMO ESTRATEGIA DE DISEŇO PARA LA SALUD MENTAL
 
Induccion Personal Mision S&A (nueva).pdf
Induccion Personal Mision S&A (nueva).pdfInduccion Personal Mision S&A (nueva).pdf
Induccion Personal Mision S&A (nueva).pdf
 
La Bauhaus y la nueva tipografía en el diseño gráfico
La Bauhaus y la nueva tipografía en el diseño gráficoLa Bauhaus y la nueva tipografía en el diseño gráfico
La Bauhaus y la nueva tipografía en el diseño gráfico
 

Manual de DreamWeaver

  • 1. MI PRIMER SITIO WEB ¿Qué es Adobe Dreamweaver? Es una aplicaciónque está destinada a la construcción, diseño y edición de sitios y aplicaciones Web. Lo que puede hacer con Dreamweaver 8 Las funciones de edición visual de Dreamweaver permiten crear páginas Web de forma rápida, sin escribir una sola línea de código. Puede ver todos los elementos o activos del sitio y arrastrarlos desde un panel fácil de usardirectamente hasta un documento. Puede agilizar el flujo de trabajo de desarrollo mediante la creación y edición de imágenes en Macromedia Fireworks o en otra aplicación de gráficos y su posterior importacióndirecta a Dreamweaver. Dreamweaver también contiene herramientas que facilitan la adición de activos de Flash a las páginas web. Diseño del espacio de trabajo.
  • 2. MI PRIMER SITIO WEB LO PRIMERO QUE NECESITO HACER PARA CREAR EL SITIO WEB Abrir el programa de Dw y nos aparecerá la siguiente ventana. Dar clic en el icono de SITIO DE DREAM WEAVER.
  • 3. MI PRIMER SITIO WEB Después no mostrara una venta como esta, y escribiremos en donde dice ¿Qué nombre desea asignar al sitio? Y pondremos MI SITIO y damos siguiente.
  • 4. MI PRIMER SITIO WEB En la siguiente ventana seleccionamos la opción de No, no deseo utilizar una tecnología de servidor y damos siguiente.
  • 5. MI PRIMER SITIO WEB En la siguiente ventana solamente damos clic en siguiente dejamos los datos que se nos muestran.
  • 6. MI PRIMER SITIO WEB En la siguiente ventana nos pregunta ¿Cómo conectar con su servidor remoto? Y seleccionamos NINGUNO y siguiente.
  • 7. MI PRIMER SITIO WEB En la siguiente ventana solamente nos muestra un resumen de todo lo que acezamos y solamente le damos clic en COMPLETADO.
  • 8. MI PRIMER SITIO WEB Ya que terminamos todos estos pasos, se nos muestra la siguiente ventana y seleccionaremos la aplicación de HTML.
  • 9. MI PRIMER SITIO WEB ¿Qué NECESITO PRIMERO PARA DISEÑAR MI PRIMER WEB? NECESITO DISEÑAR LOS BOTONES EL Diseño de botones: nos permiten enlazar las páginas al momento de dar clic. Estos son algunos diseños de los botones. ¿Cómo deben de ser los botones? Deben tener la misma forma y línea de color.
  • 10. MI PRIMER SITIO WEB ¿Cómo voy a diseñar los botones? • Los podemos diseñar en Photoshop, Corel o Power Point. • Si es el photoshop hay editarlos luego guardarlo como imagen jpg o gif para que no se vea el fondo. • Si es en el corel se deben diseñar de uno en uno y luego dar control + e, y guardarlo como jpg, aceptar. • Si es el powerpoint hay q hacerlo en insertar formas y luego dar clic sobre la imagen y guardarlo. Diseñando Banner. Es un formato publicitario en Internet. Esta forma de publicidad online consiste en incluir una pieza publicitaria dentro de una página web. Prácticamente en la totalidad de los casos, su objetivo es atraer tráfico hacia el sitio web del anunciante que paga por su inclusión. Estos pueden ser horizontales o verticales. Las medidas son las siguientes.
  • 11. MI PRIMER SITIO WEB Ejemplos de banner`s
  • 12. MI PRIMER SITIO WEB ¿Qué otra cosa necesito para mi diseño de mi WEB? Necesito escoger el fondo o los colores que estarán de fondo de mi página web. Este fondo debe combinar con todos las aplicaciones que contendrá mi página considerando el diseño de los botones, la tipografía y las imágenes. ¿Qué contendrá en LINK de INICIO? Este contendrá lo que oferta mi empresa, a que se dedica o que promueve o vende. ¿Qué contendrá en LINK de HISTORIA? Es el relato de cómo nace la empresa, los hechos históricos, fotos de la empresa del antes y después, fotos de los creadores de la empresa. ¿Qué contendrá en LINK de MISIÓN? Es la razón de ser de la empresa, el motivo por el cual existe.Asi mismo es la determinación de la/las funciones básicas que la empresa va a desempeñar en un entorno determinado para conseguir tal misión. En la misión se define: la necesidad a satisfacer, los clientes a alcanzar, productos y servicios a ofertar. ¿Qué contendrá en LINK de VISIÓN? Se refiere a lo que la empresa quiere crear, la imagen futura de la organización. La visión es creada por la persona encargada de dirigir la empresa, y quien tiene que valorar e incluir en su análisis muchas de las aspiraciones de los agentes que componen la organización, tanto internos como externos. La visión se realiza formulando una imagen ideal del proyecto y poniéndola por escrito, a fin de crear el sueño (compartido por todos los que tomen parte en la iniciativa) de lo que debe ser en el futuro la empresa. ¿Qué contendrá en LINK de VISIÓN? Los valores son aquellos juicios éticos sobre situaciones imaginarias o reales a los cuales nos sentimos más inclinados por su grado de utilidad personal y social. Los valores de la empresa son los pilares más importantes de cualquier organización. Con ellos en realidad se define así misma, porque los valores de una organización son los valores de sus miembros, y especialmente los de sus dirigentes. Los empresarios deben desarrollar virtudes como la templanza, la prudencia, la justicia y la fortaleza para ser transmisores de un verdadero liderazgo. ¿Qué contendrá en LINK de GANELERIA? Este contendrá imágenes referentes a lo que mi empresa vende o promueve. ¿Qué contendrá en LINK de CONTACTO? Sera la información de la empresa ubicación, teléfono, correo electrónico o un mapa de ubicación. Quien es la persona encargada.
  • 13. MI PRIMER SITIO WEB ¿Y luego? Ya que tengo toda la información requerida en texto, imágenes, botones, fotos, etc. Buscaremos la carpeta que creamos en el sitio web, esta estará alojada en mis DOCUMENTOS y se llama la carpeta MI SITIO, en esta carpeta agregaremos los botones y las imágenes o fotos. Aquí se almacenará todo. ¿Y después qué? Ahora si empezaremos a diseñar nuestra web en el programa de Dw. Seleccionamos HTML y se nos abrirá la ventana para diseñar el sitio WEB. ¿Qué debo de conocer antes de empezar a diseñar? En la parte derecha inferior como se muestra encerrado en recuadro rojo, está la aplicación de ACCIONES, aquí nos muestra la carpeta MI SITIO con todos los elementos que contiene esa carpeta fotos imágenes y botones y todo lo que queramos agregar. Si queremos INSERTAR un elemento de esta carpeta a nuestra PLANTILLA de WEB solamente lo seleccionamos el objeto y lo arrastramos a la plantilla para agregarlo y poderlo manipular dentro.
  • 14. MI PRIMER SITIO WEB El siguiente paso es INSERTAR una tabla asi como se muestra en la siguiente imagen damos clic. Ya que damos clic nos muestra la siguiente ventana, y seleccionamos lo siguiente: en FILAS ponemos 7 en COLUMNAS ponemos 7, en ANCHO DE TABLA ponemos 750 pixeles, GROSOR DE BORDE ponemos CERO y seleccionamos la aplicación AMBOS y damos aceptar
  • 15. MI PRIMER SITIO WEB Nos parecerá una tabla con CELDAS las cuales podemos mover o hacerlas mas grande dependiendo del acomodo de lo que contendrá nuestra página WEB. ¿Cómo voy a trabajar con esta tabla en la distribución de los elementos? Selecciono 5 celdas como se muestra en la siguiente imagen
  • 16. MI PRIMER SITIO WEB Ya que seleccione las 5 celdas doy clc derecho y me aparece una ventana, selecciono la opcion de COMBINAR CELDAS, para que las celdas que seleccione las pueda uni en una sola ya que en esta parte pondremos el Banner horizontal. Tambien en esta ventana de opciones de tabla, nos permite insertar mas filas o columnas. Ya que hicimos este paso agregamos el banner y ajustamos las celdas al tamaño, como se muestra en la siguiente imagen.
  • 17. MI PRIMER SITIO WEB Ejemplo de banner vertical. Agregando los botones de forma horizontal. Solamente seleccionamos los botones y los arrastramos a la celda que queremos que estén.
  • 18. MI PRIMER SITIO WEB Después para guardar todo lo que estamos haciendo damos clic en F12 y nos aparecerá una venta que dice que si deseamos guardar y le damos la opción de SI y nos aparecerá una ventana para agregar el nombre de nuestra primer página que la nombraremos INDEX y le damos únicamente GUARDAR, ya que terminamos este paso se nos abrirá la página del explorador para visualizar la vista previa de la página, cada vez que demos F12 nos mostrara que queremos guardar y después nos mostrara la vista preliminar.
  • 19. MI PRIMER SITIO WEB Agregando fondo. Seleccionamos las siguientes celdas y damos clic derecho seleccionamos tabla y combinar celdas como se muestra en la siguiente imagen. Ya que seleccionamos las celdas y las combinamos insertamos el fondo que queremos que aparezca. Ajustamos la imagen de fondo dando clic derecho sobra la imagen y nos aparecerá una ventana y seleccionamos la opción de ALINEAR y nos aparecerán diferentes opciones para alinear nuestra imagen y ajustarla a la página web. Otra forma de agregar fondo es: en la barra de propiedades de la parte de abajo como se muestra en la imagen, dar clic en PROPIEDADES DE LA PAGINA y nos mostrara una ventana, seleccionamos la opción de ASPECTO, y seleccionamos la opción de EXAMINAR la IMAGEN DE FONDO, y buscamos la imagen que queremos que aparezca, después le damos clic en la opción REPETIR si queremos que se repita o no, después ya que seleccionamos le damos ACEPTAR o APLICAR.
  • 20. MI PRIMER SITIO WEB Clic en la opción de PROPIEDADES DE LA PAGINA. Muestra de la ventana de las PROPIEDADES DE LA PAGINA
  • 21. MI PRIMER SITIO WEB ¿Cómo hacer vínculos? Selecciono el BOTON ya que lo tengo seleccionado, en la barra de PROPIEDADES esta la opción de VÍNCULO presiono en icono del CÍRCULO y arrastro con una FLECHA que aparece a la página que deseo vincular con el BOTON, ver la imagen. Paso 1: selección del botón que queremos vincular. Paso 2: seleccionar el icono de VINCULO. Paso 3: Arrastrar con la flecha a la página que queremos vincular.