Etapa 1. Introducción a Dreamweaver y páginas web.

            [pic 1][pic 2][pic 3][pic 4]

Ambiente Visual I

Síntesis

 Etapa 1. Introducción a Dreamweaver y páginas web.

Etapa 2. Uso de texto, imágenes y enlaces.

1799796 – Laura Yaretzi Arriaga Briones

Grupo: 2L3        Aula: 119

Turno: 1

Profr. Edith Martínez Fernández

Monterrey, Nuevo León a 19 de abril de 2016

Síntesis

Etapa 1. Introducción a Dreamweaver y páginas web

En la etapa 1 iniciamos con el software de Dreamweaver es la herramienta más avanzada que utilizamos para diseñar páginas web, hay muchas razones para utilizarlo y una de ellas es por la productividad que tiene. Logra que las páginas que realizamos tengan un aspecto más profesional y soporta más cantidad de tecnología y es más fácil de usar. Y se pueden poner tablas, editar marcos, e insertar comportamientos.  

El software de Dreamweaver es un editor de código HTML para el diseño visual y la administración de sitios y páginas web. Este software incluye numerosas herramientas y funciones de edición de código, las cuales te permitirán añadir diseño y funcionalidad sin escribir ni una sola línea de código.

Permite crear propios objetos y comandos, modificar métodos e incluso escribir para ampliar las posibilidades con nuevos comportamientos.

Una página web es un documento diseñado para que este en internet puede contener información, imágenes, videos u otros. La principal característica de las páginas web son los hipervínculos conocidos como enlaces y la función de estos es vincular páginas. Por eso a internet se le conoce como telaraña por lo mismo que vincula una página con otra y así sucesivamente hasta formar la telaraña de documentos entrelazados. Todas las páginas web se visualizan a través de Navegadores Web que ellos se encargan de interpretar el código con el que son diseñadas. Para editar las páginas se necesita conocer el lenguaje HTML (HyperText Markup Language) ya que es el que todos los navegadores utilizan para mostrar la información. Cualquier editor de texto nos permite crear una página web solo es necesario poner la extensión html o htm e incluir el código, el editor de textos más simple es el bloc de notas.

Para editar páginas web es necesario empezar a manejar el lenguaje HTML, mediante la estructura básica de un documento HTML:

        Inicio del documento

        Inicio de cabecera

        Final de titulo

        Final de cabecera

        Inicio de cuerpo del documento

        Fin de cuerpo del documento

        Final del documento

Para tener una página en internet necesitamos contratar a una empresa con servidores y que puedan alojarla y hacerla accesible a internet siempre. Los servicios pueden ser de paga o gratuitos. El hospedaje web o Housting es el espacio virtual conectado a un servidor conectado a internet siempre. El sitio web es el conjunto de páginas web conectadas entre sí. El dominio es la dirección a internet cuando adquieres el dominio personalizas tu sitio web y cuentas de correo. Cuando se contrata un servicio de manera gratuita se tiene ciertas imitaciones como menos espacio en el disco más lento y el nombre de la página se presidia por el de ellos y para generar ingresos tendrán que vender espacios publicitarios dentro de la página lo cuales no podemos negar.

Para trabajar con Dreamweaver es necesario conocer algunos elementos gráficos de la pantalla.

Barra de aplicación: se compone de los botones propios de la aplicación.                                                Barra de menús: nos muestra las opciones agrupadas de acuerdo a sus características.                                                                                                                                           Barra de herramientas estándar: contiene los iconos con acciones más comunes como archivo y edición.                                                                                                                                                                                                                                                        Pestaña del documento: cada documento que se abre muestra con el nombre que por default le ponen que es untitle-1, si nos aparece un “*” es porque el documento ya había sido guardado.                                                                                                  

Barra de herramienta de documentos: aquí nos muestra las diferentes vistas de edición del documento o la página que nos permite acceder de manera rápida al título de la página.

Estas son cada una de las vista del documento que nos podemos encontrar:

Vista de código: nos permite trabajar en el entorno de programación de código, y no permite tener referencia visual de cómo está quedando la página que estamos haciendo.

Vista de diseño: aquí podemos trabajar con el editor visual ya que nos ofrece un aspecto similar al resultado final.                                                                                                            Vista dividir: divide la ventana en dos: código y diseño.                                                                              Vista en vivo: es una representación más real de la apariencia que tendrá la página en el navegador.                                                                                                                                Vista código en vivo: es el conjunto de la vista en que divide la pantalla pero sin que se pueda editar el código.

El inspector de propiedades permite examinar y que editemos las propiedades más comunes de los elementos de la página seleccionado.                                                    

La barra de estado nos muestra las dimensiones actuales de la ventana del documento en pixeles.                                                                                                                                     Las ventanas o paneles son el conjunto de grupos que se muestran juntitos en vertical. Se acoplan o desacoplan moviéndose dentro o fuera del conjunto acoplado.                                                                                                                                                        

...