Repaso final de certificación dw
-
Upload
creatergolden -
Category
Technology
-
view
120 -
download
6
description
Transcript of Repaso final de certificación dw
![Page 1: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/1.jpg)
Repaso Final Dreamweaver MTI Ma. del Rosario Agundis Laguna
![Page 2: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/2.jpg)
PLANEACIÓN DE PROYECTO
Y DERECHOS DE AUTOR.
![Page 3: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/3.jpg)
¿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.
![Page 4: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/4.jpg)
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.
![Page 5: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/5.jpg)
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.
![Page 6: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/6.jpg)
Coherencia
El diseño de las páginas es importante ya
que este elemento mantiene la coherencia
de todo el sitio web.
![Page 7: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/7.jpg)
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.
![Page 8: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/8.jpg)
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.
![Page 9: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/9.jpg)
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.
![Page 10: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/10.jpg)
¿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.
![Page 11: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/11.jpg)
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.
![Page 12: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/12.jpg)
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.
![Page 13: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/13.jpg)
¿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.
![Page 14: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/14.jpg)
¿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.
![Page 15: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/15.jpg)
Interfaz De Dreamweaver
(Espacio De Trabajo)
![Page 16: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/16.jpg)
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.
![Page 17: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/17.jpg)
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.
![Page 18: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/18.jpg)
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.
![Page 19: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/19.jpg)
Comando o función “Sincronizar el sitio”
Este comando nos permite descargar los
archivos de nuestro servidor remoto al local
y viceversa.
![Page 20: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/20.jpg)
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”
![Page 21: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/21.jpg)
¿Qué característica tiene la
carpeta raíz?
Esta carpeta aloja el contenido de nuestro
sitio web en nuestro equipo
![Page 22: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/22.jpg)
¿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)
![Page 23: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/23.jpg)
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”.
![Page 24: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/24.jpg)
Proteger
Esta función le permite que sus archivos
puedan ser editados únicamente por el
propietario.
![Page 25: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/25.jpg)
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.
![Page 26: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/26.jpg)
¿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”
![Page 27: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/27.jpg)
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
![Page 28: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/28.jpg)
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.
![Page 29: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/29.jpg)
Color Hexadecimal
Son colores sólidos compuestos por
caracteres alfanuméricos por ejemplo: color
negro (#000000), color rojo (#FF0000), etc.
![Page 30: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/30.jpg)
Fuentes (tipografía)
Drreamweaver incluye ciertas fuentes como
predeterminadas por ejemplo. Arial,
verdana, Georgia, sans-serif, Times new
roman, etc.
![Page 31: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/31.jpg)
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.
![Page 32: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/32.jpg)
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>
![Page 33: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/33.jpg)
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.
![Page 34: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/34.jpg)
PROCEDIMIENTOS,
COMPONENTES Y FUNCIONES
![Page 35: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/35.jpg)
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.
![Page 36: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/36.jpg)
Optimización y descarga
![Page 37: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/37.jpg)
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
![Page 38: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/38.jpg)
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”
![Page 39: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/39.jpg)
Elementos de permanencia en todo el
diseño del sitio web
• Diseño de páginas
• Formato de las fuentes
• Botones de navegación
![Page 40: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/40.jpg)
¿Cuántos colores existen en la paleta
de colores?
256 colores
![Page 41: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/41.jpg)
¿Cuántos colores son conocidos como
seguros de la paleta de colores?
216 colores
![Page 42: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/42.jpg)
¿Cuántos colores son reconocidos por los
exploradores de internet?
16 colores
![Page 43: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/43.jpg)
¿Qué elementos cambian al momento de ser visualizados
por diferentes monitores y exploradores web?
Los colores
![Page 44: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/44.jpg)
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.
![Page 45: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/45.jpg)
Procedimiento para establecer iluminación o
brillo a imágenes en Dreamweaver
Menú> Modificar> Imagen> Brillo/Contraste
![Page 46: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/46.jpg)
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)
![Page 47: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/47.jpg)
Tabla
Este elemento le ayuda a mantener el
diseño de su página o sitio web
![Page 48: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/48.jpg)
¿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.
![Page 49: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/49.jpg)
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.
![Page 50: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/50.jpg)
Eliminar una fila de tabla seleccionada
por método abreviado.
Para eliminar la fila seleccionada presione
las teclas CONTROL+SHIFT+M
![Page 51: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/51.jpg)
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”.
![Page 52: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/52.jpg)
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.
![Page 53: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/53.jpg)
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.
![Page 54: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/54.jpg)
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.
![Page 55: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/55.jpg)
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).
![Page 56: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/56.jpg)
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.
![Page 57: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/57.jpg)
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
![Page 58: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/58.jpg)
Panel de referencia
Este panel ofrece ejemplo en lenguajes de
marcado, programación, estilos CSS como:
html, xml,jsp, php, sql, xslt, etc.
![Page 59: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/59.jpg)
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.
![Page 60: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/60.jpg)
Que objeto o propiedad interpretan los
lectores de pantalla o exploradores.
Los textos alternativos
![Page 61: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/61.jpg)
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.
![Page 62: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/62.jpg)
É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”.
![Page 63: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/63.jpg)
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
![Page 64: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/64.jpg)
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).
![Page 65: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/65.jpg)
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
![Page 66: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/66.jpg)
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é.
![Page 67: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/67.jpg)
Plantillas
Las plantillas facilitan el diseño de sitios web
que requieren de elementos que se utilizan
más de una vez
![Page 68: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/68.jpg)
Insertar animaciones flash (.swf)
Insertar animaciones flash (.swf)
![Page 69: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/69.jpg)
Ruta Absoluta
Esta ruta contiene una dirección de internet
completa por ejemplo:
http://www.macromedia.com/
![Page 70: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/70.jpg)
Ruta completa
Contiene la ruta completa del sitio local al
de destino por ejemplo:
http://www.macromedia.com/support/dream
weaver/contents.html
![Page 71: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/71.jpg)
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
![Page 72: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/72.jpg)
Atributos de “div”
Tres atributos de etiquetas div son:
• ID
• Style
• class
![Page 73: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/73.jpg)
CÓDIGO HTML
![Page 74: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/74.jpg)
Etiqueta “Table”
Se utiliza alternativamente a la
etiqueta “div” para organizar el
contenido del sitio web.
![Page 75: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/75.jpg)
Etiquetas que requieren de valores de
atributos definidos
<body bgcolor=""> y <body background="">
![Page 76: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/76.jpg)
Snippets o fragmentos
Esta opción le permite crear código
HTML y guardarlo para emplearlo
varias veces.
![Page 77: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/77.jpg)
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.
![Page 78: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/78.jpg)
Etiqueta <align>
Esta etiqueta se utiliza para la alineación de
textos y objetos en dreamweaver.
![Page 79: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/79.jpg)
Etiqueta <h1>
Se utiliza para cambiar textos de
encabezado.
![Page 80: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/80.jpg)
Etiquetas <h1> y <HTML>
Son etiquetas que no requieren de
valores o atributos definidos
![Page 81: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/81.jpg)
Etiqueta <td>
Representa una celda de tabla.
![Page 82: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/82.jpg)
Etiqueta <div>
Se utiliza como alternativa a las tablas para
organizar el contenido.
![Page 83: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/83.jpg)
Etiqueta <tittle>
Contiene el título de la página web
![Page 84: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/84.jpg)
Etiqueta <p>
Párrafo
![Page 85: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/85.jpg)
Etiqueta <ol>
Lista
![Page 86: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/86.jpg)
Etiqueta <li>
Elemento de lista
![Page 87: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/87.jpg)
Etiqueta <head>
Define la cabecera del documento, que
contiene información sobre el documento
![Page 88: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/88.jpg)
Etiqueta <body>
contiene el cuerpo del documento, lo que
será representado por el navegador.
![Page 89: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/89.jpg)
Etiqueta <EM>
Significa énfasis
![Page 90: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/90.jpg)
Etiqueta <strong>
Énfasis fuerte
![Page 91: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/91.jpg)
Etiqueta <A>
ANCHOR ancla o hipervínculo , puede ser
el origen o el destino del hipervínculo.
![Page 92: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/92.jpg)
Etiqueta <link>
Vincular a objeto
![Page 93: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/93.jpg)
Etiqueta <br>
Salto de línea
![Page 94: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/94.jpg)
Etiqueta <tr>
Fila de tabla
![Page 95: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/95.jpg)
Etiqueta <th>
Encabezado de tabla
![Page 96: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/96.jpg)
Etiqueta <style>
Información de estilo
![Page 97: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/97.jpg)
Etiqueta <ul>
Lista no ordenada
![Page 98: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/98.jpg)
Etiquetas siempre presentes en
HTML
<body>, <head> y <HTML>
![Page 99: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/99.jpg)
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
![Page 100: Repaso final de certificación dw](https://reader034.fdocuments.mx/reader034/viewer/2022052311/557ba4dbd8b42a052c8b4704/html5/thumbnails/100.jpg)