SlideShare una empresa de Scribd logo
1 de 100
Descargar para leer sin conexión
Repaso Final Dreamweaver
MTI Ma. del Rosario Agundis Laguna
PLANEACIÓN DE PROYECTO
Y DERECHOS DE AUTOR.
¿Cuál es el propósito de las encuestan para
desarrollar un proyecto en Dreamweaver?
Las encuestan brindan los elementos
necesarios para el diseño y desarrollo de un
proyecto en Dreamweaver ya que facilita
elementos como:
tipo de audiencia, objetivos, etc.
Accesibilidad de los sitios web
Los factores de accesibilidad es un factor
importante al momento de diseñar sitios
web, ya que se debe pensar en la
diversidad de usuarios que la visitarán,
entre ellos usuarios con discapacidades.
Elementos que mejoran la capacidad
de uso y navegación en sitios web
El diseño de mapas de sitio, textos
alternativos y etiquetado de vínculos son
elementos importantes que siempre se
deben de considerar al momento de
desarrollar o diseñar un sitio web.
Coherencia
El diseño de las páginas es importante ya
que este elemento mantiene la coherencia
de todo el sitio web.
Pruebas de facilidad de uso
Dos aspectos que se miden en el diseño de
sitios web son: nivel de aceptación y
satisfacción de los usuarios así como la
adaptación del usuario a la navegación del
sitio web.
Ejemplo de dos técnicas utilizadas en
las pruebas de facilidad de uso.
• Apoyo en software que registra cada una
de las tareas de los usuarios para un
análisis posterior.
• Utilizar observadores que anoten las
reacciones de los usuarios a medida que
estos realicen tareas en un laboratorio.
Aspectos de credibilidad en un
sitio web
Para que nuestro sitio web brinde
credibilidad a los usuarios se deben
mantener tres aspectos importantes como
son: la actualización del sitio a menudo,
facilitar los medios de contacto con la
empresa y la verificación de la información.
¿Qué es un guión gráfico? (bosquejo)
Es la representación gráfica de un proceso
visual deseado que en dreamweaver
contiene características como: nombre de
archivo, navegación e imágenes o dibujos.
Motivos comunes para utilizar guiones
gráficos en el diseño de sitios web.
• Medir el nivel de aceptación y satisfacción
de los usuarios.
• Adaptación del usuario a la navegación del
sitio Web.
• Aprobación del cliente previa al desarrollo.
• Indicar la colocación de los elementos en
nuestro sitio web.
Principales características de la adición
de imágenes en nuestro sitio web.
Al momento de utilizar imágenes para el
diseño y desarrollo de nuestro sitio web se
deben tener en cuenta dos características
que son: el tamaño de las imágenes y la
relevancia para nuestro sitio.
¿Qué contenido está protegido por las
leyes de copyright ©?
Las leyes de copyright (derecho de copia)
protegen todas aquellas obras tanto
publicadas como no publicadas.
¿Podemos reproducir videos con derechos de
autor en nuestro sitio web, sin autorización previa?
Existe una forma de poder utilizar este
material sin autorización previa del autor,
dicha forma es reproduciendo únicamente el
10% o tres minutos máximo del material.
Interfaz De Dreamweaver
(Espacio De Trabajo)
Un sitio web no publicado en un servidor
remoto o host. ¿se conoce como?
Sitio local o bien la carpeta que contiene
nuestro proyecto guardado en nuestro
ordenador.
Ficha común
En esta ficha contamos con elementos para
inserción cómo: hipervínculo, anclaje, tabla,
imágenes, barra de navegación, etc.
Panel de archivos
Este panel nos ofrece permite ver el mapa
del desarrollo de nuestro sitio local y
remoto. También nos ofrece opciones como:
conectar al servidor remoto, actualizar,
obtener archivos, proteger archivos,
desproteger, sincronizar, expandir, vista
local, organizar archivos en carpetas, etc.
Comando o función “Sincronizar el sitio”
Este comando nos permite descargar los
archivos de nuestro servidor remoto al local
y viceversa.
Películas, Archivos .swf, plantillas, colores, URL,
Shockwave, biblioteca, etc. Son elementos que se
encuentran en:
Este conjunto de elementos se encuentran
en el panel de “Activos”
¿Qué característica tiene la
carpeta raíz?
Esta carpeta aloja el contenido de nuestro
sitio web en nuestro equipo
¿Qué características tiene una carpeta
remota?
Esta otra carpeta aloja el contenido de
nuestro sitio web en el servidor, conocido
también como (host)
Definición de sitios
Esta opción le permite crear y configurar
sitios locales y remotos por medio de dos
fichas de opciones “básicas y avanzadas”.
Proteger
Esta función le permite que sus archivos
puedan ser editados únicamente por el
propietario.
Desproteger
Al contrario de “proteger” esta opción
permite compartir y editar el archivo
seleccionado por más de un integrante de
su equipo de trabajo.
¿Cómo cerrar una conexión remota?
Si usted está utilizando una conexión
remota por medio de Dreamweaver vía
(FTP) y desea cerrar la conexión, utilice el
panel de archivos y haga click en el ícono
“Desconectar del servidor remoto”
Inspector o panel de propiedades
Este panel le permite modificar propiedades
del documento y de objetos insertados en el
mismo, en este panel encontrara algunas
opciones como:
» Formato
» Clases
» Vínculos
» Título
» Destino
» Propiedades de página
» CSS
» HTML
» ID
Color de fondo (background)
El procedimiento estándar para poder
cambiar las propiedades de esta opción
como el color hexadecimal es el siguiente:
Menú> Modificar> Propiedades de la página
o documento>. El uso de background
también permite utilizar imágenes en
formatos GIF, JPEG y PNG.
Color Hexadecimal
Son colores sólidos compuestos por
caracteres alfanuméricos por ejemplo: color
negro (#000000), color rojo (#FF0000), etc.
Fuentes (tipografía)
Drreamweaver incluye ciertas fuentes como
predeterminadas por ejemplo. Arial,
verdana, Georgia, sans-serif, Times new
roman, etc.
Uso de fuentes (Tipografía)
Se recomienda el uso de las fuentes
predeterminadas en el diseño de sitios web,
ya que si se utiliza otro tipo de fuente puede
ser mal interpretada o sustituida por una
computadora que no cuente con dicha
fuente instalada. Esto puede afectar al
diseño de sitios web.
Título de página
Existen tres métodos para modificar el título
de la página web que se esta diseñando y
son los siguientes:
1. Menú> Modificar> Propiedades de la página
2. Identificar en la interfaz la parte denominada “Título”
3. Menú> Ver> Código y cambiar el nombre que se
encuentra entre las etiquetas <title>Documento sin
título</title>
Vista “Código”
Esta vista le permite ver el código HTML
que se esta empleando, así como editar la
información de fuente creada por programas
de diseño como (flash) y páginas web de
terceros.
PROCEDIMIENTOS,
COMPONENTES Y FUNCIONES
Imagen de sustitución
Este elemento está compuesto por dos
imágenes, la original y la de sustitución.
Normalmente se utiliza en la creación de
botones.
Optimización y descarga
Métodos para facilitar la velocidad de
descarga de su sitio web
Es importante que nuestro sitio web
descargue imágenes y contenidos de una
forma rápida, para lograr esto se
recomienda tomar en cuenta los siguientes
métodos:
• Hojas de estilo en cascada en el diseño de páginas
• Uso de miniaturas con las imágenes grandes
Optimizar imágenes para su
sitio
El mayor beneficio que se obtiene al
optimizar las imágenes de su sitio web es
“Menor tiempo de descarga”
Elementos de permanencia en todo el
diseño del sitio web
• Diseño de páginas
• Formato de las fuentes
• Botones de navegación
¿Cuántos colores existen en la paleta
de colores?
256 colores
¿Cuántos colores son conocidos como
seguros de la paleta de colores?
216 colores
¿Cuántos colores son reconocidos por los
exploradores de internet?
16 colores
¿Qué elementos cambian al momento de ser visualizados
por diferentes monitores y exploradores web?
Los colores
Ventaja de utilizar etiquetas “div”
Una de las ventajas al momento de utilizar
este tipo de etiquetas en nuestro diseño
web es para los programadores, ya que
facilita la codificación.
Procedimiento para establecer iluminación o
brillo a imágenes en Dreamweaver
Menú> Modificar> Imagen> Brillo/Contraste
Tipo de archivos permitidos para
importar en Dreamweaver
• XML (Xtensible Markup Language (lenguaje
de marcado ampliable o extensible).
• Datos de tabla
• Documento de Word (.doc), (.docx)
• Documento de Excel (.xls), (.xlsx)
Tabla
Este elemento le ayuda a mantener el
diseño de su página o sitio web
¿Cómo agregar textos alternativos?
En el panel o inspector de propiedades
encontraremos un elemento denominado
“Alt” con una casilla para insertar el nombre.
Otra forma es por método de Menú>
Insertar> Objetos de imagen> Marcados de
posición de imagen.
Editar imágenes JPG, PNG, etc.
El método para editar desde Dreamweaver
una imagen es por medio de la Tecla
Control+doble click sobre la imagen. Esta
acción abrirá paralelamente el programa
que usted tenga como predeterminado para
edición de imágenes por ejemplo: Fireworks
o Photoshop.
Eliminar una fila de tabla seleccionada
por método abreviado.
Para eliminar la fila seleccionada presione
las teclas CONTROL+SHIFT+M
Modo de tabla expandida
Procedimiento 1: haga click con el botón
secundario del mouse sobre la tabla,
seleccione la opción “Tabla” y a
continuación “Modo de tablas expandidas”.
Procedimiento 2: Presione las teclas
“ALT+F6”.
Eliminar objetos localmente
Al eliminar un objeto de su carpeta local
como: imagen. JPG, no se aplica el mismo
cambio en su carpeta remota hasta que
usted ejecute la sincronización del sitio.
Mapa de imagen
Esta herramienta sirve para crear “zonas
activas” en partes de la imagen para ser
vinculadas al destino deseado. Se
encuentra en el panel o inspector de
propiedades de forma rectangular, circular o
poligonal.
Perfilar imagen
Esta herramienta incrementa el contraste
alrededor de los bordes de la imagen, para
ejecutar este procedimiento seleccione la
imagen, haga click en el menú> “Modificar>
Imagen> Perfilar y agregue el valor
deseado.
Insertar
Existen dos formatos de archivo que no se
pueden insertar en Dreamweaver ya que
son archivos fuente y sus extensiones son
las siguientes:
.fla ( flash document)
.PSD (photoshop document).
Crear un hipervínculo a texto por
selección
Seleccionar con el cursor el texto o parte del
texto que contendrá el hipervínculo, a
continuación en el panel o inspector de
propiedades agregar la dirección URL o
archivo de destino por medio de la opción
Vínculo.
Opción verificar vínculos
Dreamweaver le ofrece la opción de verificar
todos los vínculos que contiene el diseño de
su sitio web, con el propósito de ayudarle a
no tener vínculos rotos.
Procedimiento 1: Menú> Sitio> Comprobar vínculos en
todo el sitio.
Procedimiento 2. Presionar la tecla F8
Panel de referencia
Este panel ofrece ejemplo en lenguajes de
marcado, programación, estilos CSS como:
html, xml,jsp, php, sql, xslt, etc.
Complementos de página
Estos elementos permiten insertar en su
sitio web applets, plug-ins, videos flv, o por
ejemplo ambientes o loops en formato mp3.
Que objeto o propiedad interpretan los
lectores de pantalla o exploradores.
Los textos alternativos
Herramienta “Párrafo o Formato”
Esta herramienta permite establecer
diferentes formatos de párrafo a los textos y
se encuentra en el panel o inspector de
propiedades > Formato> Encabezado
1,2,3,4,5,6, etc.
Énfasis a una cita de bloque
Para dar un mayor énfasis o importancia a
una cita se utilizan estilos por ejemplo:
negritas, cursivas, subrayado, énfasis,
destacado, código, etc.
Procedimiento: seleccionar el texto o cita y hacer
click con el botón secundario del mouse para
posteriormente seleccionar la opción de “Estilo”.
Comando Ortografía
Este comando le permite funciones como:
omitir palabra, cambiar palabra, cambiar
todas las ocurrencias de palabra, etc. Para
activar esta función existen dos
procedimientos:
1. Menú> Comandos> Ortografía
2. Teclas MAYÚSCULAS+F7
Estilos CSS
Los elementos CSS le proporcionan algunas
ventajas como el modificar colores de fondo,
texto e imágenes entre otros para facilitar el
diseño de sitios web que requieran cambios
por temporadas es decir (primavera, otoño e
invierno).
Lectores de pantalla
Los lectores de pantalla o buscadores
interpretan tres tipos de contenido:
• Títulos de página
• Cuerpo de texto de página
• Encabezado de columnas
Espacio de celdas
Para agregar espacio entre celdas definido
por el usuario, seleccione la tabla, vaya al
panel o inspector de propiedades y el la
opción de “Esp. Celda” coloque el valor de
10 px, o el que deseé.
Plantillas
Las plantillas facilitan el diseño de sitios web
que requieren de elementos que se utilizan
más de una vez
Insertar animaciones flash (.swf)
Insertar animaciones flash (.swf)
Ruta Absoluta
Esta ruta contiene una dirección de internet
completa por ejemplo:
http://www.macromedia.com/
Ruta completa
Contiene la ruta completa del sitio local al
de destino por ejemplo:
http://www.macromedia.com/support/dream
weaver/contents.html
Ruta Relativa a la raíz del sitio
Especifica la ruta de los archivos con
ubicaciones de directorio idénticas por
ejemplo:
/Imágenes/background/fondo_1.jpg
Atributos de “div”
Tres atributos de etiquetas div son:
• ID
• Style
• class
CÓDIGO HTML
Etiqueta “Table”
Se utiliza alternativamente a la
etiqueta “div” para organizar el
contenido del sitio web.
Etiquetas que requieren de valores de
atributos definidos
<body bgcolor=""> y <body background="">
Snippets o fragmentos
Esta opción le permite crear código
HTML y guardarlo para emplearlo
varias veces.
Etiqueta HREF<mailto>
Esta etiqueta le permite crear un vínculo de
correo electrónico mediante código HTML,
otra opción es por medio del Menú>
Insertar> Vínculo de correo electrónico.
Etiqueta <align>
Esta etiqueta se utiliza para la alineación de
textos y objetos en dreamweaver.
Etiqueta <h1>
Se utiliza para cambiar textos de
encabezado.
Etiquetas <h1> y <HTML>
Son etiquetas que no requieren de
valores o atributos definidos
Etiqueta <td>
Representa una celda de tabla.
Etiqueta <div>
Se utiliza como alternativa a las tablas para
organizar el contenido.
Etiqueta <tittle>
Contiene el título de la página web
Etiqueta <p>
Párrafo
Etiqueta <ol>
Lista
Etiqueta <li>
Elemento de lista
Etiqueta <head>
Define la cabecera del documento, que
contiene información sobre el documento
Etiqueta <body>
contiene el cuerpo del documento, lo que
será representado por el navegador.
Etiqueta <EM>
Significa énfasis
Etiqueta <strong>
Énfasis fuerte
Etiqueta <A>
ANCHOR ancla o hipervínculo , puede ser
el origen o el destino del hipervínculo.
Etiqueta <link>
Vincular a objeto
Etiqueta <br>
Salto de línea
Etiqueta <tr>
Fila de tabla
Etiqueta <th>
Encabezado de tabla
Etiqueta <style>
Información de estilo
Etiqueta <ul>
Lista no ordenada
Etiquetas siempre presentes en
HTML
<body>, <head> y <HTML>
Selector de etiquetas
Esta opción le permite insertar una variedad
de etiquetas de código HTML como: b, em,
p, h1, etc.
Procedimiento: Menú>Insertar> Etiquetas
Repaso final de certificación dw

Más contenido relacionado

La actualidad más candente

Dreamweaver cs5 naty
Dreamweaver cs5 natyDreamweaver cs5 naty
Dreamweaver cs5 natynataliareniz
 
Ventana de dreamweaver
Ventana de dreamweaverVentana de dreamweaver
Ventana de dreamweaverastridcmc
 
Wordpress, características y guía de uso1
Wordpress, características y guía de uso1Wordpress, características y guía de uso1
Wordpress, características y guía de uso1Andrea
 
Guia de aprendizaje
Guia de aprendizajeGuia de aprendizaje
Guia de aprendizajeimbachipilar
 
Barras dreamweaver
Barras dreamweaverBarras dreamweaver
Barras dreamweaverLISBETH-17
 
Resumen de dreamweaver
Resumen de dreamweaverResumen de dreamweaver
Resumen de dreamweaverpaosinning
 
Ventana de dreamweaver
Ventana de dreamweaverVentana de dreamweaver
Ventana de dreamweaverIvan Llerena
 
Prácticas_Dreamweaver
Prácticas_DreamweaverPrácticas_Dreamweaver
Prácticas_DreamweaverSUPLANETA
 
Ppt5 bcd.pptm recuperado
Ppt5 bcd.pptm recuperadoPpt5 bcd.pptm recuperado
Ppt5 bcd.pptm recuperadojohanRn21
 
Taller de Dreamweaver 8
Taller de Dreamweaver 8Taller de Dreamweaver 8
Taller de Dreamweaver 8Juan Pena
 
Manual de dreamweaver
Manual de dreamweaverManual de dreamweaver
Manual de dreamweaverMena75
 

La actualidad más candente (20)

Dreamweaver cs5 naty
Dreamweaver cs5 natyDreamweaver cs5 naty
Dreamweaver cs5 naty
 
Presentación post
Presentación postPresentación post
Presentación post
 
Curso Dreamweaver CS6
Curso Dreamweaver CS6Curso Dreamweaver CS6
Curso Dreamweaver CS6
 
Ventana de dreamweaver
Ventana de dreamweaverVentana de dreamweaver
Ventana de dreamweaver
 
Wordpress, características y guía de uso1
Wordpress, características y guía de uso1Wordpress, características y guía de uso1
Wordpress, características y guía de uso1
 
Guia de aprendizaje
Guia de aprendizajeGuia de aprendizaje
Guia de aprendizaje
 
Adobe dreamweaver cs5
Adobe dreamweaver cs5Adobe dreamweaver cs5
Adobe dreamweaver cs5
 
Dreamweaver cs5
Dreamweaver cs5Dreamweaver cs5
Dreamweaver cs5
 
Barras dreamweaver
Barras dreamweaverBarras dreamweaver
Barras dreamweaver
 
REPASO PARA 5TO DE SECUNDARIA
REPASO PARA 5TO DE SECUNDARIAREPASO PARA 5TO DE SECUNDARIA
REPASO PARA 5TO DE SECUNDARIA
 
Dreamweaver
DreamweaverDreamweaver
Dreamweaver
 
Resumen de dreamweaver
Resumen de dreamweaverResumen de dreamweaver
Resumen de dreamweaver
 
DREAMWEAVER
DREAMWEAVERDREAMWEAVER
DREAMWEAVER
 
Ventana de dreamweaver
Ventana de dreamweaverVentana de dreamweaver
Ventana de dreamweaver
 
Manual dreamweaver CC
Manual dreamweaver CCManual dreamweaver CC
Manual dreamweaver CC
 
Prácticas_Dreamweaver
Prácticas_DreamweaverPrácticas_Dreamweaver
Prácticas_Dreamweaver
 
Johan T,T
Johan T,TJohan T,T
Johan T,T
 
Ppt5 bcd.pptm recuperado
Ppt5 bcd.pptm recuperadoPpt5 bcd.pptm recuperado
Ppt5 bcd.pptm recuperado
 
Taller de Dreamweaver 8
Taller de Dreamweaver 8Taller de Dreamweaver 8
Taller de Dreamweaver 8
 
Manual de dreamweaver
Manual de dreamweaverManual de dreamweaver
Manual de dreamweaver
 

Destacado (7)

Manual dreamweavercs5
Manual dreamweavercs5Manual dreamweavercs5
Manual dreamweavercs5
 
Jeopardy
JeopardyJeopardy
Jeopardy
 
Manual de dreamweaver listo
Manual de dreamweaver listoManual de dreamweaver listo
Manual de dreamweaver listo
 
Organización de contenido en dreamweaver
Organización de contenido en dreamweaverOrganización de contenido en dreamweaver
Organización de contenido en dreamweaver
 
Manual Dreamweaver
Manual DreamweaverManual Dreamweaver
Manual Dreamweaver
 
Elaboración de paginas web dinamicas
Elaboración de paginas web dinamicasElaboración de paginas web dinamicas
Elaboración de paginas web dinamicas
 
Info progaics6
Info progaics6Info progaics6
Info progaics6
 

Similar a Repaso final de certificación dw

Trabajo 10
Trabajo 10Trabajo 10
Trabajo 10Liz345
 
Taller de elaboracion de paginas web resumen front page
Taller  de elaboracion de paginas web resumen front pageTaller  de elaboracion de paginas web resumen front page
Taller de elaboracion de paginas web resumen front pageFanny Lopez Valek
 
Ventana dreamweaver
Ventana dreamweaverVentana dreamweaver
Ventana dreamweaverangimelli
 
Ventana dreamweaver
Ventana dreamweaverVentana dreamweaver
Ventana dreamweaverangimelli
 
Ventana de dreamweaver
Ventana de dreamweaverVentana de dreamweaver
Ventana de dreamweaverastridcmc
 
Capitulo 2: Espacio_trabajo
Capitulo 2: Espacio_trabajoCapitulo 2: Espacio_trabajo
Capitulo 2: Espacio_trabajocristina081188
 
Dreamweaver cs5
Dreamweaver cs5Dreamweaver cs5
Dreamweaver cs5AyllenZue
 
Dreamweaver j-l
Dreamweaver j-lDreamweaver j-l
Dreamweaver j-lAquino1912
 
Dreamweaver-Tratamiento de imágenes
Dreamweaver-Tratamiento de imágenesDreamweaver-Tratamiento de imágenes
Dreamweaver-Tratamiento de imágenesEliana Navarro J
 
Dreamweaver cs5 marcela trocha
Dreamweaver cs5 marcela trochaDreamweaver cs5 marcela trocha
Dreamweaver cs5 marcela trochamarcela1406
 
Estandarización de paginas web
Estandarización de paginas webEstandarización de paginas web
Estandarización de paginas webLuis Álamo
 
Presentación1 (1)
Presentación1 (1)Presentación1 (1)
Presentación1 (1)Angie Samper
 

Similar a Repaso final de certificación dw (20)

Dreamweaver
DreamweaverDreamweaver
Dreamweaver
 
Trabajo 10
Trabajo 10Trabajo 10
Trabajo 10
 
Taller de elaboracion de paginas web resumen front page
Taller  de elaboracion de paginas web resumen front pageTaller  de elaboracion de paginas web resumen front page
Taller de elaboracion de paginas web resumen front page
 
Ventana dreamweaver
Ventana dreamweaverVentana dreamweaver
Ventana dreamweaver
 
Ventana dreamweaver
Ventana dreamweaverVentana dreamweaver
Ventana dreamweaver
 
Ventana dreamweaver
Ventana dreamweaverVentana dreamweaver
Ventana dreamweaver
 
Adobe dreamweaver
Adobe dreamweaverAdobe dreamweaver
Adobe dreamweaver
 
Ventana de dreamweaver
Ventana de dreamweaverVentana de dreamweaver
Ventana de dreamweaver
 
Dreamweaver
DreamweaverDreamweaver
Dreamweaver
 
Capitulo 2: Espacio_trabajo
Capitulo 2: Espacio_trabajoCapitulo 2: Espacio_trabajo
Capitulo 2: Espacio_trabajo
 
Angie marti informatik
Angie marti informatikAngie marti informatik
Angie marti informatik
 
Dreamwever
DreamweverDreamwever
Dreamwever
 
Dreamweaver
DreamweaverDreamweaver
Dreamweaver
 
Dreamweaver cs5
Dreamweaver cs5Dreamweaver cs5
Dreamweaver cs5
 
Dreamweaver j-l
Dreamweaver j-lDreamweaver j-l
Dreamweaver j-l
 
Dreamweaver-Tratamiento de imágenes
Dreamweaver-Tratamiento de imágenesDreamweaver-Tratamiento de imágenes
Dreamweaver-Tratamiento de imágenes
 
Dreamweaver cs5 marcela trocha
Dreamweaver cs5 marcela trochaDreamweaver cs5 marcela trocha
Dreamweaver cs5 marcela trocha
 
Estandarización de paginas web
Estandarización de paginas webEstandarización de paginas web
Estandarización de paginas web
 
Dreamweaver
DreamweaverDreamweaver
Dreamweaver
 
Presentación1 (1)
Presentación1 (1)Presentación1 (1)
Presentación1 (1)
 

Último

Trabajo Mas Completo De Excel en clase tecnología
Trabajo Mas Completo De Excel en clase tecnologíaTrabajo Mas Completo De Excel en clase tecnología
Trabajo Mas Completo De Excel en clase tecnologíassuserf18419
 
9egb-lengua y Literatura.pdf_texto del estudiante
9egb-lengua y Literatura.pdf_texto del estudiante9egb-lengua y Literatura.pdf_texto del estudiante
9egb-lengua y Literatura.pdf_texto del estudianteAndreaHuertas24
 
KELA Presentacion Costa Rica 2024 - evento Protégeles
KELA Presentacion Costa Rica 2024 - evento ProtégelesKELA Presentacion Costa Rica 2024 - evento Protégeles
KELA Presentacion Costa Rica 2024 - evento ProtégelesFundación YOD YOD
 
Plan de aula informatica segundo periodo.docx
Plan de aula informatica segundo periodo.docxPlan de aula informatica segundo periodo.docx
Plan de aula informatica segundo periodo.docxpabonheidy28
 
Redes direccionamiento y subredes ipv4 2024 .pdf
Redes direccionamiento y subredes ipv4 2024 .pdfRedes direccionamiento y subredes ipv4 2024 .pdf
Redes direccionamiento y subredes ipv4 2024 .pdfsoporteupcology
 
Hernandez_Hernandez_Practica web de la sesion 12.pptx
Hernandez_Hernandez_Practica web de la sesion 12.pptxHernandez_Hernandez_Practica web de la sesion 12.pptx
Hernandez_Hernandez_Practica web de la sesion 12.pptxJOSEMANUELHERNANDEZH11
 
Global Azure Lima 2024 - Integración de Datos con Microsoft Fabric
Global Azure Lima 2024 - Integración de Datos con Microsoft FabricGlobal Azure Lima 2024 - Integración de Datos con Microsoft Fabric
Global Azure Lima 2024 - Integración de Datos con Microsoft FabricKeyla Dolores Méndez
 
CLASE DE TECNOLOGIA E INFORMATICA PRIMARIA
CLASE  DE TECNOLOGIA E INFORMATICA PRIMARIACLASE  DE TECNOLOGIA E INFORMATICA PRIMARIA
CLASE DE TECNOLOGIA E INFORMATICA PRIMARIAWilbisVega
 
La era de la educación digital y sus desafios
La era de la educación digital y sus desafiosLa era de la educación digital y sus desafios
La era de la educación digital y sus desafiosFundación YOD YOD
 
Proyecto integrador. Las TIC en la sociedad S4.pptx
Proyecto integrador. Las TIC en la sociedad S4.pptxProyecto integrador. Las TIC en la sociedad S4.pptx
Proyecto integrador. Las TIC en la sociedad S4.pptx241521559
 
EPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial UninoveEPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial UninoveFagnerLisboa3
 
trabajotecologiaisabella-240424003133-8f126965.pdf
trabajotecologiaisabella-240424003133-8f126965.pdftrabajotecologiaisabella-240424003133-8f126965.pdf
trabajotecologiaisabella-240424003133-8f126965.pdfIsabellaMontaomurill
 
International Women's Day Sucre 2024 (IWD)
International Women's Day Sucre 2024 (IWD)International Women's Day Sucre 2024 (IWD)
International Women's Day Sucre 2024 (IWD)GDGSucre
 
guía de registro de slideshare por Brayan Joseph
guía de registro de slideshare por Brayan Josephguía de registro de slideshare por Brayan Joseph
guía de registro de slideshare por Brayan JosephBRAYANJOSEPHPEREZGOM
 
POWER POINT YUCRAElabore una PRESENTACIÓN CORTA sobre el video película: La C...
POWER POINT YUCRAElabore una PRESENTACIÓN CORTA sobre el video película: La C...POWER POINT YUCRAElabore una PRESENTACIÓN CORTA sobre el video película: La C...
POWER POINT YUCRAElabore una PRESENTACIÓN CORTA sobre el video película: La C...silviayucra2
 
Cortes-24-de-abril-Tungurahua-3 año 2024
Cortes-24-de-abril-Tungurahua-3 año 2024Cortes-24-de-abril-Tungurahua-3 año 2024
Cortes-24-de-abril-Tungurahua-3 año 2024GiovanniJavierHidalg
 

Último (16)

Trabajo Mas Completo De Excel en clase tecnología
Trabajo Mas Completo De Excel en clase tecnologíaTrabajo Mas Completo De Excel en clase tecnología
Trabajo Mas Completo De Excel en clase tecnología
 
9egb-lengua y Literatura.pdf_texto del estudiante
9egb-lengua y Literatura.pdf_texto del estudiante9egb-lengua y Literatura.pdf_texto del estudiante
9egb-lengua y Literatura.pdf_texto del estudiante
 
KELA Presentacion Costa Rica 2024 - evento Protégeles
KELA Presentacion Costa Rica 2024 - evento ProtégelesKELA Presentacion Costa Rica 2024 - evento Protégeles
KELA Presentacion Costa Rica 2024 - evento Protégeles
 
Plan de aula informatica segundo periodo.docx
Plan de aula informatica segundo periodo.docxPlan de aula informatica segundo periodo.docx
Plan de aula informatica segundo periodo.docx
 
Redes direccionamiento y subredes ipv4 2024 .pdf
Redes direccionamiento y subredes ipv4 2024 .pdfRedes direccionamiento y subredes ipv4 2024 .pdf
Redes direccionamiento y subredes ipv4 2024 .pdf
 
Hernandez_Hernandez_Practica web de la sesion 12.pptx
Hernandez_Hernandez_Practica web de la sesion 12.pptxHernandez_Hernandez_Practica web de la sesion 12.pptx
Hernandez_Hernandez_Practica web de la sesion 12.pptx
 
Global Azure Lima 2024 - Integración de Datos con Microsoft Fabric
Global Azure Lima 2024 - Integración de Datos con Microsoft FabricGlobal Azure Lima 2024 - Integración de Datos con Microsoft Fabric
Global Azure Lima 2024 - Integración de Datos con Microsoft Fabric
 
CLASE DE TECNOLOGIA E INFORMATICA PRIMARIA
CLASE  DE TECNOLOGIA E INFORMATICA PRIMARIACLASE  DE TECNOLOGIA E INFORMATICA PRIMARIA
CLASE DE TECNOLOGIA E INFORMATICA PRIMARIA
 
La era de la educación digital y sus desafios
La era de la educación digital y sus desafiosLa era de la educación digital y sus desafios
La era de la educación digital y sus desafios
 
Proyecto integrador. Las TIC en la sociedad S4.pptx
Proyecto integrador. Las TIC en la sociedad S4.pptxProyecto integrador. Las TIC en la sociedad S4.pptx
Proyecto integrador. Las TIC en la sociedad S4.pptx
 
EPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial UninoveEPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial Uninove
 
trabajotecologiaisabella-240424003133-8f126965.pdf
trabajotecologiaisabella-240424003133-8f126965.pdftrabajotecologiaisabella-240424003133-8f126965.pdf
trabajotecologiaisabella-240424003133-8f126965.pdf
 
International Women's Day Sucre 2024 (IWD)
International Women's Day Sucre 2024 (IWD)International Women's Day Sucre 2024 (IWD)
International Women's Day Sucre 2024 (IWD)
 
guía de registro de slideshare por Brayan Joseph
guía de registro de slideshare por Brayan Josephguía de registro de slideshare por Brayan Joseph
guía de registro de slideshare por Brayan Joseph
 
POWER POINT YUCRAElabore una PRESENTACIÓN CORTA sobre el video película: La C...
POWER POINT YUCRAElabore una PRESENTACIÓN CORTA sobre el video película: La C...POWER POINT YUCRAElabore una PRESENTACIÓN CORTA sobre el video película: La C...
POWER POINT YUCRAElabore una PRESENTACIÓN CORTA sobre el video película: La C...
 
Cortes-24-de-abril-Tungurahua-3 año 2024
Cortes-24-de-abril-Tungurahua-3 año 2024Cortes-24-de-abril-Tungurahua-3 año 2024
Cortes-24-de-abril-Tungurahua-3 año 2024
 

Repaso final de certificación dw

  • 1. Repaso Final Dreamweaver MTI Ma. del Rosario Agundis Laguna
  • 2. PLANEACIÓN DE PROYECTO Y DERECHOS DE AUTOR.
  • 3. ¿Cuál es el propósito de las encuestan para desarrollar un proyecto en Dreamweaver? Las encuestan brindan los elementos necesarios para el diseño y desarrollo de un proyecto en Dreamweaver ya que facilita elementos como: tipo de audiencia, objetivos, etc.
  • 4. Accesibilidad de los sitios web Los factores de accesibilidad es un factor importante al momento de diseñar sitios web, ya que se debe pensar en la diversidad de usuarios que la visitarán, entre ellos usuarios con discapacidades.
  • 5. Elementos que mejoran la capacidad de uso y navegación en sitios web El diseño de mapas de sitio, textos alternativos y etiquetado de vínculos son elementos importantes que siempre se deben de considerar al momento de desarrollar o diseñar un sitio web.
  • 6. Coherencia El diseño de las páginas es importante ya que este elemento mantiene la coherencia de todo el sitio web.
  • 7. Pruebas de facilidad de uso Dos aspectos que se miden en el diseño de sitios web son: nivel de aceptación y satisfacción de los usuarios así como la adaptación del usuario a la navegación del sitio web.
  • 8. Ejemplo de dos técnicas utilizadas en las pruebas de facilidad de uso. • Apoyo en software que registra cada una de las tareas de los usuarios para un análisis posterior. • Utilizar observadores que anoten las reacciones de los usuarios a medida que estos realicen tareas en un laboratorio.
  • 9. Aspectos de credibilidad en un sitio web Para que nuestro sitio web brinde credibilidad a los usuarios se deben mantener tres aspectos importantes como son: la actualización del sitio a menudo, facilitar los medios de contacto con la empresa y la verificación de la información.
  • 10. ¿Qué es un guión gráfico? (bosquejo) Es la representación gráfica de un proceso visual deseado que en dreamweaver contiene características como: nombre de archivo, navegación e imágenes o dibujos.
  • 11. Motivos comunes para utilizar guiones gráficos en el diseño de sitios web. • Medir el nivel de aceptación y satisfacción de los usuarios. • Adaptación del usuario a la navegación del sitio Web. • Aprobación del cliente previa al desarrollo. • Indicar la colocación de los elementos en nuestro sitio web.
  • 12. Principales características de la adición de imágenes en nuestro sitio web. Al momento de utilizar imágenes para el diseño y desarrollo de nuestro sitio web se deben tener en cuenta dos características que son: el tamaño de las imágenes y la relevancia para nuestro sitio.
  • 13. ¿Qué contenido está protegido por las leyes de copyright ©? Las leyes de copyright (derecho de copia) protegen todas aquellas obras tanto publicadas como no publicadas.
  • 14. ¿Podemos reproducir videos con derechos de autor en nuestro sitio web, sin autorización previa? Existe una forma de poder utilizar este material sin autorización previa del autor, dicha forma es reproduciendo únicamente el 10% o tres minutos máximo del material.
  • 16. Un sitio web no publicado en un servidor remoto o host. ¿se conoce como? Sitio local o bien la carpeta que contiene nuestro proyecto guardado en nuestro ordenador.
  • 17. Ficha común En esta ficha contamos con elementos para inserción cómo: hipervínculo, anclaje, tabla, imágenes, barra de navegación, etc.
  • 18. Panel de archivos Este panel nos ofrece permite ver el mapa del desarrollo de nuestro sitio local y remoto. También nos ofrece opciones como: conectar al servidor remoto, actualizar, obtener archivos, proteger archivos, desproteger, sincronizar, expandir, vista local, organizar archivos en carpetas, etc.
  • 19. Comando o función “Sincronizar el sitio” Este comando nos permite descargar los archivos de nuestro servidor remoto al local y viceversa.
  • 20. Películas, Archivos .swf, plantillas, colores, URL, Shockwave, biblioteca, etc. Son elementos que se encuentran en: Este conjunto de elementos se encuentran en el panel de “Activos”
  • 21. ¿Qué característica tiene la carpeta raíz? Esta carpeta aloja el contenido de nuestro sitio web en nuestro equipo
  • 22. ¿Qué características tiene una carpeta remota? Esta otra carpeta aloja el contenido de nuestro sitio web en el servidor, conocido también como (host)
  • 23. Definición de sitios Esta opción le permite crear y configurar sitios locales y remotos por medio de dos fichas de opciones “básicas y avanzadas”.
  • 24. Proteger Esta función le permite que sus archivos puedan ser editados únicamente por el propietario.
  • 25. Desproteger Al contrario de “proteger” esta opción permite compartir y editar el archivo seleccionado por más de un integrante de su equipo de trabajo.
  • 26. ¿Cómo cerrar una conexión remota? Si usted está utilizando una conexión remota por medio de Dreamweaver vía (FTP) y desea cerrar la conexión, utilice el panel de archivos y haga click en el ícono “Desconectar del servidor remoto”
  • 27. Inspector o panel de propiedades Este panel le permite modificar propiedades del documento y de objetos insertados en el mismo, en este panel encontrara algunas opciones como: » Formato » Clases » Vínculos » Título » Destino » Propiedades de página » CSS » HTML » ID
  • 28. Color de fondo (background) El procedimiento estándar para poder cambiar las propiedades de esta opción como el color hexadecimal es el siguiente: Menú> Modificar> Propiedades de la página o documento>. El uso de background también permite utilizar imágenes en formatos GIF, JPEG y PNG.
  • 29. Color Hexadecimal Son colores sólidos compuestos por caracteres alfanuméricos por ejemplo: color negro (#000000), color rojo (#FF0000), etc.
  • 30. Fuentes (tipografía) Drreamweaver incluye ciertas fuentes como predeterminadas por ejemplo. Arial, verdana, Georgia, sans-serif, Times new roman, etc.
  • 31. Uso de fuentes (Tipografía) Se recomienda el uso de las fuentes predeterminadas en el diseño de sitios web, ya que si se utiliza otro tipo de fuente puede ser mal interpretada o sustituida por una computadora que no cuente con dicha fuente instalada. Esto puede afectar al diseño de sitios web.
  • 32. Título de página Existen tres métodos para modificar el título de la página web que se esta diseñando y son los siguientes: 1. Menú> Modificar> Propiedades de la página 2. Identificar en la interfaz la parte denominada “Título” 3. Menú> Ver> Código y cambiar el nombre que se encuentra entre las etiquetas <title>Documento sin título</title>
  • 33. Vista “Código” Esta vista le permite ver el código HTML que se esta empleando, así como editar la información de fuente creada por programas de diseño como (flash) y páginas web de terceros.
  • 35. Imagen de sustitución Este elemento está compuesto por dos imágenes, la original y la de sustitución. Normalmente se utiliza en la creación de botones.
  • 37. Métodos para facilitar la velocidad de descarga de su sitio web Es importante que nuestro sitio web descargue imágenes y contenidos de una forma rápida, para lograr esto se recomienda tomar en cuenta los siguientes métodos: • Hojas de estilo en cascada en el diseño de páginas • Uso de miniaturas con las imágenes grandes
  • 38. Optimizar imágenes para su sitio El mayor beneficio que se obtiene al optimizar las imágenes de su sitio web es “Menor tiempo de descarga”
  • 39. Elementos de permanencia en todo el diseño del sitio web • Diseño de páginas • Formato de las fuentes • Botones de navegación
  • 40. ¿Cuántos colores existen en la paleta de colores? 256 colores
  • 41. ¿Cuántos colores son conocidos como seguros de la paleta de colores? 216 colores
  • 42. ¿Cuántos colores son reconocidos por los exploradores de internet? 16 colores
  • 43. ¿Qué elementos cambian al momento de ser visualizados por diferentes monitores y exploradores web? Los colores
  • 44. Ventaja de utilizar etiquetas “div” Una de las ventajas al momento de utilizar este tipo de etiquetas en nuestro diseño web es para los programadores, ya que facilita la codificación.
  • 45. Procedimiento para establecer iluminación o brillo a imágenes en Dreamweaver Menú> Modificar> Imagen> Brillo/Contraste
  • 46. Tipo de archivos permitidos para importar en Dreamweaver • XML (Xtensible Markup Language (lenguaje de marcado ampliable o extensible). • Datos de tabla • Documento de Word (.doc), (.docx) • Documento de Excel (.xls), (.xlsx)
  • 47. Tabla Este elemento le ayuda a mantener el diseño de su página o sitio web
  • 48. ¿Cómo agregar textos alternativos? En el panel o inspector de propiedades encontraremos un elemento denominado “Alt” con una casilla para insertar el nombre. Otra forma es por método de Menú> Insertar> Objetos de imagen> Marcados de posición de imagen.
  • 49. Editar imágenes JPG, PNG, etc. El método para editar desde Dreamweaver una imagen es por medio de la Tecla Control+doble click sobre la imagen. Esta acción abrirá paralelamente el programa que usted tenga como predeterminado para edición de imágenes por ejemplo: Fireworks o Photoshop.
  • 50. Eliminar una fila de tabla seleccionada por método abreviado. Para eliminar la fila seleccionada presione las teclas CONTROL+SHIFT+M
  • 51. Modo de tabla expandida Procedimiento 1: haga click con el botón secundario del mouse sobre la tabla, seleccione la opción “Tabla” y a continuación “Modo de tablas expandidas”. Procedimiento 2: Presione las teclas “ALT+F6”.
  • 52. Eliminar objetos localmente Al eliminar un objeto de su carpeta local como: imagen. JPG, no se aplica el mismo cambio en su carpeta remota hasta que usted ejecute la sincronización del sitio.
  • 53. Mapa de imagen Esta herramienta sirve para crear “zonas activas” en partes de la imagen para ser vinculadas al destino deseado. Se encuentra en el panel o inspector de propiedades de forma rectangular, circular o poligonal.
  • 54. Perfilar imagen Esta herramienta incrementa el contraste alrededor de los bordes de la imagen, para ejecutar este procedimiento seleccione la imagen, haga click en el menú> “Modificar> Imagen> Perfilar y agregue el valor deseado.
  • 55. Insertar Existen dos formatos de archivo que no se pueden insertar en Dreamweaver ya que son archivos fuente y sus extensiones son las siguientes: .fla ( flash document) .PSD (photoshop document).
  • 56. Crear un hipervínculo a texto por selección Seleccionar con el cursor el texto o parte del texto que contendrá el hipervínculo, a continuación en el panel o inspector de propiedades agregar la dirección URL o archivo de destino por medio de la opción Vínculo.
  • 57. Opción verificar vínculos Dreamweaver le ofrece la opción de verificar todos los vínculos que contiene el diseño de su sitio web, con el propósito de ayudarle a no tener vínculos rotos. Procedimiento 1: Menú> Sitio> Comprobar vínculos en todo el sitio. Procedimiento 2. Presionar la tecla F8
  • 58. Panel de referencia Este panel ofrece ejemplo en lenguajes de marcado, programación, estilos CSS como: html, xml,jsp, php, sql, xslt, etc.
  • 59. Complementos de página Estos elementos permiten insertar en su sitio web applets, plug-ins, videos flv, o por ejemplo ambientes o loops en formato mp3.
  • 60. Que objeto o propiedad interpretan los lectores de pantalla o exploradores. Los textos alternativos
  • 61. Herramienta “Párrafo o Formato” Esta herramienta permite establecer diferentes formatos de párrafo a los textos y se encuentra en el panel o inspector de propiedades > Formato> Encabezado 1,2,3,4,5,6, etc.
  • 62. Énfasis a una cita de bloque Para dar un mayor énfasis o importancia a una cita se utilizan estilos por ejemplo: negritas, cursivas, subrayado, énfasis, destacado, código, etc. Procedimiento: seleccionar el texto o cita y hacer click con el botón secundario del mouse para posteriormente seleccionar la opción de “Estilo”.
  • 63. Comando Ortografía Este comando le permite funciones como: omitir palabra, cambiar palabra, cambiar todas las ocurrencias de palabra, etc. Para activar esta función existen dos procedimientos: 1. Menú> Comandos> Ortografía 2. Teclas MAYÚSCULAS+F7
  • 64. Estilos CSS Los elementos CSS le proporcionan algunas ventajas como el modificar colores de fondo, texto e imágenes entre otros para facilitar el diseño de sitios web que requieran cambios por temporadas es decir (primavera, otoño e invierno).
  • 65. Lectores de pantalla Los lectores de pantalla o buscadores interpretan tres tipos de contenido: • Títulos de página • Cuerpo de texto de página • Encabezado de columnas
  • 66. Espacio de celdas Para agregar espacio entre celdas definido por el usuario, seleccione la tabla, vaya al panel o inspector de propiedades y el la opción de “Esp. Celda” coloque el valor de 10 px, o el que deseé.
  • 67. Plantillas Las plantillas facilitan el diseño de sitios web que requieren de elementos que se utilizan más de una vez
  • 68. Insertar animaciones flash (.swf) Insertar animaciones flash (.swf)
  • 69. Ruta Absoluta Esta ruta contiene una dirección de internet completa por ejemplo: http://www.macromedia.com/
  • 70. Ruta completa Contiene la ruta completa del sitio local al de destino por ejemplo: http://www.macromedia.com/support/dream weaver/contents.html
  • 71. Ruta Relativa a la raíz del sitio Especifica la ruta de los archivos con ubicaciones de directorio idénticas por ejemplo: /Imágenes/background/fondo_1.jpg
  • 72. Atributos de “div” Tres atributos de etiquetas div son: • ID • Style • class
  • 74. Etiqueta “Table” Se utiliza alternativamente a la etiqueta “div” para organizar el contenido del sitio web.
  • 75. Etiquetas que requieren de valores de atributos definidos <body bgcolor=""> y <body background="">
  • 76. Snippets o fragmentos Esta opción le permite crear código HTML y guardarlo para emplearlo varias veces.
  • 77. Etiqueta HREF<mailto> Esta etiqueta le permite crear un vínculo de correo electrónico mediante código HTML, otra opción es por medio del Menú> Insertar> Vínculo de correo electrónico.
  • 78. Etiqueta <align> Esta etiqueta se utiliza para la alineación de textos y objetos en dreamweaver.
  • 79. Etiqueta <h1> Se utiliza para cambiar textos de encabezado.
  • 80. Etiquetas <h1> y <HTML> Son etiquetas que no requieren de valores o atributos definidos
  • 81. Etiqueta <td> Representa una celda de tabla.
  • 82. Etiqueta <div> Se utiliza como alternativa a las tablas para organizar el contenido.
  • 83. Etiqueta <tittle> Contiene el título de la página web
  • 87. Etiqueta <head> Define la cabecera del documento, que contiene información sobre el documento
  • 88. Etiqueta <body> contiene el cuerpo del documento, lo que será representado por el navegador.
  • 91. Etiqueta <A> ANCHOR ancla o hipervínculo , puede ser el origen o el destino del hipervínculo.
  • 98. Etiquetas siempre presentes en HTML <body>, <head> y <HTML>
  • 99. Selector de etiquetas Esta opción le permite insertar una variedad de etiquetas de código HTML como: b, em, p, h1, etc. Procedimiento: Menú>Insertar> Etiquetas