este trabajo es de:PROCEDIMIENTOS PARA INSERTAR COLORES, IMÁGENES Y VÍNCULOS EN EL DISEÑO DE LAS PAGINAS WEB.

1. PROCEDIMIENTOS PARA INSERTAR COLORES, IMÁGENES Y VINCULOS EN EL
DISEÑO DE LAS PAGUINAS WED.
KARELIS ADRIANA RIVERA PARALES
2018
INSTITUCION EDUCATIVA SIMON BOLIVAR.
ARAUCA-ARAUCA.
INFORMATICA

2. ii
Copyright © 2018 por KARELIS ADRIANA RIVERA PARALES Todos los derechos
reservados.

3. iii
Agradecimientos
Agradezco a Dios, por permitirme realizar este trabajo, en donde podre aprender más acerca de
el formato de las normas APA.

4. iv
Tabla de Contenido
PROCEDIMIENTOS PARA INSERTAR COLORES, IMÁGENES Y VINCULOS EN EL
DISEÑO DE LAS PAGUINAS WED................................................................................ 1
APRENDA A INSERTAR, EDITAR, REEMPLAZAR Y CAMBIAR EL TAMAÑO DE
IMÁGENES EN DREAMWEAVER......................................................................................... 2
Mover el panel de estilos, especificar el estilo de los elementos en el bloque de texto e
imágenes ..................................................................................................................................... 7
Mapa y Herramientas de zona interactiva ............................................................................. 9
imagen 2: Como dimensionar un elemento visualmente ...................................................... 12
CAMBIAR DE TAMAÑO UNA IMAGEN .................................................................... 13
Lista de referencias ........................................................................................................... 14
Vita.................................................................................................................................... 16

5. vLista de figuras
ILUSTRACIÓN 1.. .............................................……………COMO INSERTAR IMÁGENES A LA PAG WEB 4
ILUSTRACIÓ 2…………….……………………………………………………...VINCULOS 7

6. 1
Capítulo 1
PROCEDIMIENTOS PARA INSERTAR COLORES, IMÁGENES Y VINCULOS
EN EL DISEÑO DE LAS PAGUINAS WED.
Antes de empezar a preparar el contenido de un sitio web, le recomendamos seleccionar
el idioma apropiado para el sitio web en la
pestaña Configuración Idiomas menú Idioma del sitio web.
El idioma del sitio web es una opción a nivel de sitio que define el idioma en el que
añadirá el contenido a su sitio web. Esto afecta a lo siguiente:
 El idioma en que se mostrarán ciertos elementos del sitio web (en particular aquellos
proporcionados por servicios de terceros), como puede ser la búsqueda de Google y los
botones de navegación en galerías de imágenes. Tenga en cuenta que no todos los
módulos y servicios de terceros proporcionados por el editor soportan todos los idiomas
disponibles.
 La dirección en la que tecleará el texto en el editor (de izquierda a derecha o de derecha a
izquierda). Si selecciona un idioma que se escribe de derecha a izquierda, el diseño y el
contenido de su sitio web permitirá RTL.
Nota: el cambio de idioma de un sitio web no vuelve a cargar el tema de sitio web
seleccionado en este momento en otro idioma. El idioma del tema permanecerá intacto,
aunque la orientación del texto sí que cambiará.

7. 2
Para añadir texto, listas, tablas o imágenes a una página:
1. Vaya a la pestaña Módulos, seleccione Texto e imágenes y arrastre el módulo a
la página.
2. Introduzca el texto en la pantalla y use los iconos presentes en la barra de herramientas del
módulo para dar formato al texto, añadir tablas, hipervínculos e imágenes.
Título 2
APRENDA A INSERTAR, EDITAR, REEMPLAZAR Y CAMBIAR EL TAMAÑO DE
IMÁGENES EN DREAMWEAVER.
Las imágenes forman parte integrante de un sitio web, proporcionando contexto adicional
a los visitantes del sitio. Aunque existe una amplia variedad de formatos de archivos
gráficos, los formatos GIF, JPEG y PNG son los habitualmente utilizados en páginas
web. Los formatos de archivo GIF y JPEG son compatibles con las páginas web y pueden
verse en la mayoría de los navegadores. El texto siguiente proporciona más información
sobre estos formatos de archivo:
GIF (formato de intercambio de gráficos): los archivos GIF utilizan un máximo de 256
colores y son los mejores para visualizar imágenes de tonos discontinuos. Los archivos
GIF son ideales para visualizar grandes áreas de color homogéneo, como barras de
navegación, botones, iconos, logotipos u otras imágenes con colores y tonos uniformes.

8. 3
JPEG (grupo conjunto de expertos fotográficos): el formato de archivo JPEG es el
mejor para imágenes fotográficas o de tonos continuos, ya que los archivos JPEG pueden
contener millones de colores. A medida que aumenta la calidad de un archivo JPEG,
también lo hace su tamaño y su tiempo de descarga. Comprimiendo un archivo JPEG
puede conseguirse un equilibrio adecuado entre la calidad de la imagen y el tamaño de
archivo.
PNG (grupo de red portable): el formato de archivo PNG es un sustituto sin patente del
GIF, que admite imágenes con color indexado, escala de grises y color verdadero, así
como compatibilidad con las transparencias, mediante canal alfa. Los archivos PNG
conservan la información de capa, vector, color y efectos, como las sombras paralelas.
Además, todos los elementos son siempre completamente editables. Los archivos deben
tener la extensión de nombre de archivo .png para que Dreamweaver pueda reconocerlos
como archivos PNG.
Dreamweaver no es un editor WYSIWYG (lo que ve es lo que obtiene). Es decir, puede
añadir o insertar imágenes mediante Dreamweaver, pero no puede mover o situar las
imágenes mediante la interfaz.
Para mover sus imágenes en el diseño, debe utilizar CSS, que muestra el contenido
HTML en la forma que desee. Puede dirigirse a los tutoriales básicos
de HTML y CSS para aprender a trabajar con imágenes utilizando código. También
puede ver el tutorial sobre cómo trabajar con imágenes en Dreamweaver.
Para saber cómo insertar y usar imágenes mediante la aplicación Dreamweaver, consulte
las siguientes secciones.

9. 4
Capítulo 2
Figuras y tablas
Ilustración 1.. como insertar imágenes a la pag web

10. 5
1. Mover la barra de herramientas.
2. Seleccionar el estilo de párrafo y la fuente. Tenga en cuenta que la fuente Terminal no es
soportada por Google Chrome.
3. Seleccionar el tamaño de la fuente.
4. Seleccionar el estilo de la fuente: negrita, cursiva, subrayado y tachado.
5. Seleccionar los colores de fondo y del texto.
6. Seleccionar la alineación del texto: izquierda, centro, derecha o justificado (alineado
tanto en ambos márgenes izquierdo y derecho con espacios adicionales añadidos entre
palabras).
7. Aumentar y reducir el nivel de sangría del párrafo.
8. Iniciar una lista numerada o con viñetas.
9. Insertar una tabla y especificar el número de filas y columnas.
Una vez haya insertado una tabla, en la barra de herramientas aparecerá un número de
iconos adicionales. Úselos para cambiar las propiedades de las filas y celdas de la tabla,
para insertar y eliminar filas y columnas o para dividir y combinar celdas de la tabla.
10. Insertar símbolos que no estén presentes en su teclado, como los signos de copyright y
marca registrada y otros símbolos Unicode.

11. 6
11. Insertar una línea horizontal.
12. Editar el código fuente HTML de la página.
13. Deshacer y rehacer cambios.
14. Insertar un objeto Flash en formato SWF.
15. Insertar una imagen, ajustar su tamaño, especificar una descripción y ajustar el texto.
Puede optar por mostrar la descripción debajo de la imagen, mostrarla encima de la
imagen únicamente cuando los usuarios pasen el ratón encima de la imagen o bien no
mostrarla. La descripción también actúa como texto alternativo: en aquellos navegadores
que no soporten o no estén configurados para mostrar imágenes, se mostrará la
descripción de la misma.
Si desea insertar muchas fotografías en una única página, considere usar el
módulo Galería de imágenes en vez del módulo Texto e imágenes. A través de
la Galería de imágenes, usted puede cargar fotografías de su ordenador local o usar
fotografías publicadas en el servicio de compartición de fotos Picasa Web Albums. Si
desea más información acerca del módulo Galería de imágenes, consulte la
sección Galería de imágenes.
Si desea añadir una presentación con múltiples imágenes, use el módulo Control
deslizante de imágenes. Si desea más información acerca del módulo Control
deslizante de imágenes, consulte la sección Control deslizante de imágenes.
16. Insertar anclas HTML a secciones particulares de las páginas web para así poder crear
vínculos desde la misma página u otras páginas de su sitio.

12. 7
17. Eliminar hipervínculos del texto seleccionado.
18. Añadir hipervínculos a páginas de su sitio web o recursos externos.
19. Añadir un enlace a una dirección de email.
Si desea más información acerca de la adición de hipervínculos, consulte la
sección Hipervínculos, enlaces a direcciones de email y anclas.
20. Mover el bloque de imagen y texto dentro de la página web, eliminar el bloque con sus
contenidos, guardar cambios y cancelar los cambios realizados.
Mover el panel de estilos, especificar el estilo de los elementos en el bloque de texto e
imágenes
Título 2
Definición de propiedades de imagen
El inspector de propiedades de imagen permite establecer las propiedades de una imagen.
Si no ve todas las propiedades de imagen, haga clic en la flecha de ampliación situada en
la esquina inferior derecha.
Ilustración 2..vinculos

13. 8
1. Para ver el inspector de propiedades de una imagen seleccionada, haga clic en la imagen
y seleccione Ventana > Propiedades.
2. En el cuadro de texto de debajo de la imagen en miniatura, introduzca un nombre. Puede
usar este nombre para hacer referencia a la imagen al utilizar un comportamiento de
Dreamweaver (como Intercambiar imagen) o al utilizar un lenguaje de creación de scripts
como JavaScript o VBScript.
3. Defina cualquiera de las opciones de imagen.
An (Anchura) y Al (Altura)
3.Tablas y figuras pueden ser puestas en un apéndice al final de la tesis o disertación. Si
se hace esto se debe estar seguro de indicar que las tablas y figuras están ubicadas en el
apéndice. Esto puede ser a través de paréntesis o con pies de página. Es posible poner
todas o solo algunas de las tablas y figuras en el apéndice, si todas las tablas y figuras son
puestas en el apéndice se debe indicar que “Todas las tablas y figuras están ubicadas en el
apéndice” después de la primera mención de una tabla o figuras..
Si establece valores de An (Anchura) y Al (Altura) que no se corresponden con la
anchura y la altura reales de la imagen, es posible que esta no se muestre correctamente
en los navegadores. Para restaurar los valores originales, haga clic en las etiquetas de los
cuadros de texto An (Anchura) y Al (Altura), o bien haga clic en el botón
Restablecimiento del tamaño de la imagen situado a la derecha de los cuadros de texto
An y Al.
Nota:

14. 9
Puede cambiar estos valores para establecer la escala del tamaño de la visualización de
esta instancia de imagen. Sin embargo, el cambio no reduce el tiempo de descarga, ya que
el navegador descarga todos los datos de la imagen antes de escalar la imagen. Para
reducir el tiempo de descarga y asegurarse de que todas las instancias de una imagen
aparezcan con el mismo tamaño, utilice una aplicación de edición de imágenes para
escalarlas.
Origen
Especifica el archivo de origen para la imagen. Haga clic en el icono de carpeta para
localizar el archivo de origen o escriba la ruta correspondiente.
Vínculo
Especifica un hipervínculo para la imagen. Arrastre el icono Señalar archivo hasta un
archivo del panel Archivos. Haga clic en el icono de carpeta para buscar un documento
del sitio o escriba manualmente el URL.
Alt
Especifica el texto alternativo que aparecerá en lugar de la imagen en los navegadores
que solo admiten texto o en aquellos configurados para descargar las imágenes
manualmente. Para usuarios con deficiencias visuales que usan sintetizadores de voz con
navegadores que solo admiten texto, el texto se reproduce en voz alta. En algunos
navegadores, este texto también aparece al situar el puntero sobre la imagen.
Mapa y Herramientas de zona interactiva
Permiten asignar una etiqueta y crear un mapa de imagen en el lado del cliente.

15. 10
Destino Especifica el marco o la ventana donde se cargará la página vinculada. Esta
opción no está disponible cuando la imagen no está vinculada a otro archivo. En la lista
Destino figuran los nombres de todos los marcos del conjunto de marcos actual. También
puede seleccionar estos nombres de destino reservados:
 _blank carga el archivo vinculado en una ventana de navegador nueva y sin nombre.
 _new carga el archivo vinculado en una nueva ventana del navegador.
 _parent carga el archivo vinculado en el conjunto de marcos padre o en la ventana del
marco que contiene el vínculo. Si el marco que contiene el vínculo no está anidado, el
archivo vinculado se cargará en la ventana completa del navegador.
 _self carga el archivo vinculado en el mismo marco o ventana que el vínculo. Este
destino es el predeterminado. No necesita especificar este valor de forma explícita.
 _top carga el archivo vinculado en la ventana completa del navegador, quitando así todos
los marcos.
Editar
Inicia el editor de imágenes que ha especificado en las preferencias de editores externos y
abre la imagen seleccionada.
Editar configuración de imagen
Abre el cuadro de diálogo Optimización de imágenes y le permite optimizar la imagen.
Actualizar desde el original
Cuando la imagen que aparece en la página de Dreamweaver está sin sincronizar con el
archivo original de Photoshop, Dreamweaver detecta que el archivo original se ha

16. 11
actualizado. La aplicación muestra en color rojo una de las flechas del icono de objeto
inteligente. Al seleccionar la imagen web en Vista de diseño y hacer clic en el
botón Actualizar desde el original en el inspector de propiedades, la imagen se actualiza
automáticamente. La imagen actualizada refleja los cambios que ha realizado en el
archivo original de Photoshop.
Recorte
Recorta el tamaño de una imagen y elimina las zonas no deseadas de la imagen
seleccionada.
Volver a muestrear
Muestrea de nuevo una imagen cuyo tamaño se ha cambiado, lo que mejora su calidad en
su nuevo tamaño y forma.
Brillo y contraste
Ajusta el brillo y el contraste de una imagen.
Perfilar
Ajusta la intensidad de una imagen.
Nota:
También puede editar los atributos de una imagen en la Vista en vivo mediante
el Inspector de propiedades de visualización rápida.

17. 12
Estas líneas son la línea incluida en la parte superior de la tabla, la línea entre el la
cabecera de la tabla y el contenido y la línea debajo de la tabla.
Título 4
imagen 1: Como dimensionar un elemento visualmente

18. 13
Capítulo 4
CAMBIAR DE TAMAÑO UNA IMAGEN
Puede cambiar visualmente en Dreamweaver el tamaño de elementos, como imágenes,
plug-in, archivos de Shockwave o SWF, applets y controles ActiveX.
Cambiar de tamaño visualmente una imagen le permite ver cómo afecta la imagen al
diseño en diferentes dimensiones, pero no cambia la escala del archivo de imagen a las
proporciones que especifique. Si cambia el tamaño de una imagen visualmente en
Dreamweaver sin utilizar una aplicación de edición de imágenes, el navegador del
usuario escalará la imagen cuando se cargue la página. Esto puede provocar un retraso en
la descarga de la página y que la imagen no se vea correctamente en el navegador del
usuario.

19. 14
Lista de referencias
Andrews, S. Fastqc, (2010). A quality control tool for high throughput sequence data.
Augen, J. (2004). Bioinformatics in the post-genomic era: Genome, transcriptome,
proteome, and information-based medicine. Addison-Wesley Professional.
Blankenberg, D., Kuster, G. V., Coraor, N., Ananda, G., Lazarus, R., Mangan, M., ... &
Taylor, J. (2010). Galaxy: a web‐based genome analysis tool for experimentalists.
Current protocols in molecular biology, 19-10.
Bolger, A., & Giorgi, F. Trimmomatic: A Flexible Read Trimming Tool for Illumina
NGS Data. URL http://www. usadellab. org/cms/index. php.
Giardine, B., Riemer, C., Hardison, R. C., Burhans, R., Elnitski, L., Shah, P., ... &
Nekrutenko, A. (2005). Galaxy: a platform for interactive large-scale genome
analysis. Genome research, 15(10), 1451-1455.

20. 15

21. 16
Vita
Me llamo Karelis Adriana Rivera Parales, estudio en la Institución Educativa
Simón Bolívar, y estoy aprendiendo más ha profundidad sobre el tema del formato de las
normas APPA.