domingo, 26 de enero de 2014

Sitio Web con Dreamweaver

 Elaborar un Sitio Web en  Dreamweaver

Para que Dreamweaver le ayude eficazmente en la confección de un sitio web, debe seguir una serie de pasos, como comunicarle a Dreamweaver dónde se encuentran en su ordenador los componentes del sitio, por ejemplo, hojas de estilo CSS, imágenes o documentos HTML. 

Estos archivos deben estar organizados en subcarpetas dentro de una carpeta principal. Con una estructura ordenada, Dreamweaver podrá controlar los cambios que se produzcan en los archivos y mantendrá actualizados los enlaces de su sitio web. Sin esta organización de datos a través de Dreamweaver, el cambio de una sola imagen podría provocar una serie de errores en su sitio web. En este tutorial vamos a aprender a definir en Dreamweaver un sitio web nueva o ya existente.

 Como crear una página web

En esta lección, creará un sitio Web que contiene información  acerca de la materia de evaluación  de sistemas, materia muy importante en la carrera de Licenciado en sistemas de información administrativa. El sitio tendrá información básica ya que solo será para ejemplificar como se crea una pagina Web.


Preparemos una carpeta con los archivos que estaremos utilizando, ya sea imágenes  o otras paginas vinculadas en esta, ya que así resulta mas fácil administrar una pagina Web.


Aprenderá a:

  • Abrir FrontPage.
  • Crear páginas Web.
  • Trabajar con texto e hipervínculos.
  • Insertar imágenes y archivos.
  • Aplicar formato a listas.
  • Colocar objetos.
  • Agregar un formulario de comentarios.
  • Diseñar una galería de fotografías.
  • Crear una estructura de sitio Web.
  • Guardar el trabajo realizado.

Para manejar este programa trabajaremos muy similar a como se trabaja en Microsoft word ya que de la misma manera le daremos formato al texto que estemos plasmando en nuestras paginas.


Empecemos por teclear el titulo de nuestra página, en este caso lo haremos referente a Evaluación de sistemas y sera nuestra pagina principal, lo hacemos como se muestra  en la siguiente imagen

Para darle formato a nuestro texto lo hacemos similar al  procesador  de textos Word.

Seleccionamos y después damos el formato, también podemos utilizar nuestras barras deherramientas  para dar justificado y alineación


 Así es como queda el texto después de dar formato



Para estar visualizado como va quedando nuestra pagina, damos clic en la pestaña, en la parte inferior izquierda.

Al entender como podemos dar formato al texto de una pagina Web, pasaremos a explicar como insertamos una imagen.

Insertar una imagen en la página principal

En este paso agregamos la imagen desde el menú insertar y en la opción imagen desde archivo y ahí nos iremos hasta donde tenemos guardada nuestra imagen.

 
Ya teniendo una imagen en nuestra pagina principal, con ella misma aprenderemos a como tener un hipervínculo

  Para crear un hipervínculo a partir de una imagen


Teniendo la imagen insertada en nuestra pagina, seguiremos a seleccionarla, ya seleccionada le damos clic derecho y seleccionamos la opción hipervínculo. Nos aparecerá una ventana en donde pondremos la  dirección a la estaremos vinculados, en este caso será la de nuestra página.


Para saber que esta operación ha sido satisfactoria, nos vamos a vista previa, como antes ya lo habíamos mencionado, y ponemos el cursor sobre la imagen, y se pondrá la manita de vínculo, y en la parte inferior izquierda aparecerá la dirección que vinculamos.


Si queremos hacer un vinculo a partir de texto, se hace la misma operación, seleccionando el texto a vincular, ya sea una palabra, frase o dirección Web.

Por ultimo aprenderemos a crear hipervínculos a otras paginas creadas en esta misma estructura.

Crear una estructura de exploración

En la vista Exploración, haga clic en Nueva página, en la barra de herramientas estándar.
FrontPage crea una nueva página de nominada "Página nueva 1" bajo la página principal. 

Las páginas de la vista Exploración no son las páginas reales del sitio Web actual, sino marcadores de posición que llevan hasta las mismas. De este modo, puede hacer  pruebas  con la estructura y la organización  del sitio Web antes de crear el contenido.

Para crear rápidamente mas as páginas, mantenga presionada la tecla CTRL del  teclado y presione U.


Conclusión

Se aprendió a como empezar a crear una pagina Web, ya conocemos los pasos que la crean, ahora solo queda por ampliar nuestra imaginación y empezar a generar ideas para darle forma a nuestras futuras paginas, y así mismo invito a que sigan con este generado de paginas, ya que es de mucha excelencia, y a seguir investigando par adquirir mas conocimientos.

Cómo crear un sitio web CS3

1. Abra Dreamweaver

 2. Para empezar, vaya a Crear nuevo > Sitio de Dreamweaver y abra la ventana Definición de sitios 


3. Vaya a Avanzadas y pulse Datos locales.


4. En Nombre del sitio, escriba "Sitio Aquo". Este nombre es sólo para uso propio y no aparecerá en el sitio web.

5. Vaya al icono Carpeta, junto a Carpeta de raíz local. Este punto es el más importante del proceso, porque define la carpeta principal de almacenamiento de datos para el sitio web.

6.Vaya a la carpeta "Sitio _Aquo" y pulse Seleccionar. Con esto Dreamweaver ya posee la información mínima para crear un sitio web.

7. Pulse Aceptar. Dreamweaver abre entonces la carpeta principal y muestra en el panel Archivos un menú con todas las carpetas, imágenes y documentos contenidos en ella.

8. Observe que en la parte superior del panel Archivos existe un menú desplegable en el que aparece "Sitio Aquo". Aquí están los nombres de todos los sitios que están siendo creados. Si es necesario, se puede navegar por el disco duro para buscar otras carpetas.

9. Dreamweaver no puede registrar cambios efectuados fuera de Dreamweaver. Utilice por tanto el panel Archivo para llevar a cabo todos los cambios en la estructura de los documentos del sitio web, y no herramientas del sistema operativo.

 

La Estructura de la Web


El programa Dreamweaver dispone de un sencillo y práctico sistema para gestionar las Webs.
  •  Para gestionar un sitio lo abrimos pulsando sobre Sitio en la Barra superior y abrir sitio


  • Si tenemos definido uno o varios sitios apareceran para que podamos seleccionarlos. En nuestro ejemplo seleccionamos el sitio Mismascotas que definimos en páginas anteriores de este curso. 
  • Para visualizar la estructura del Sitio pulsamos sobre el Botón Mapa del Sitio o Site Map
  
  • Y como resultado se muestra las relaciones entre las distintas páginas que componen la Web.



 
 



No hay comentarios:

Publicar un comentario