|
DREAMWEAVER
Bien, iremos de a poco, un sitio web es un documento
que se aloja en el servidor si se quiere que se tenga acceso a este, es
decir que si queremos publicar nuestro sitio en Internet para que sea accesible
debemos subirlo a un servidor web.
Lo primero
que vemos en Dreamweaver
Al abrir el programa nos van a aparecer divido
en dos, en la parte de arriba vemos el codigo, en la de abajo es la parte
gráfica, es decir sino sabemos programar sitios web mediante código
podremos hacerlo de manera gráfica, muy similar a un documento Office.
| Podemos cambiar la
vista a solo código o solo entorno gráfico, seguramente para
los más nuevo el entorno gráfico será lo más
apropiado. Esto lo elegimos mediante la opción VER
- DISEÑO, de esta manera
se nos abre la pantalla completa para que podamos comenzar a trabajar en
el entorno grafico. También existe otra manera de acceder a la misma
opción de forma más rápida, esto lo hacemos mediante
unos botones en la esquina superior izquierda. |
|
El que está seleccionado en la imagen que
vemos es el de diseño, es decir el entorno gráfico, el de
medio es el de código y diseño juntos y el de la izquierda
es el de código solo.
Comenzar
a diseñar
Vamos a ir de a poco, primero veremos lo básico,
escribimos un texto cualquiera en la hoja, por ejemplo "Esta es mi página
web", ahora la probaremos en nuestro navegador, de esta manera iremos viendo
como va quedando nuestra página en Internet Explorer, entonces vamos
a ARCHIVO-VISTA PREVIA EN
EL EXPLORADOR-IEXPLORE o presionando
simplemente F12 el programa lanzará la vista previa de la página.
Bueno, ahora a ese simple texto vamos a darle
forma, pero primero vamos a darle el titulo a la página, si ese
que aparece arriba a la izquierda en el explorador, esto lo hacemos en
la parte donde dice Título, arriba donde en la imagen ves "web,
creacion de sitios, curso" seguramente lo tendrás en blanco, ahí
pones el título que le queres dar a la página, ahora dale
F12
y nos aparecerá.
Todo sobre
formatos de textos
Ahora es hora de darle formato a un texto, es
decir cambiarle la letra, tamaño, color, ponerlo en negrita, etc.
Esto también es bastante simple, seleccionando
primero el texto vamos a donde dice "Texto" en el menú de arriba,
allí nos saldrás varias opciones, por ahora veremos de darle
negrita y subrayado, dentro del menú texto elegimos "Estilo" que
verás que tiene una flecha hacia la derecha, esto quiere decir que
hay más opciones, elegimos Negrita y ahora vemos que el texto tiene
negrita, para subrayarlo, son los mismos pasos, solo que elegimos Subrayado.
Ahora veremos como centrar los textos, o mandarlos
a la izquierda, derecha, etc. Esto es bien sencillo, seleccionando el texto
vamos al menú TEXTO
allí elegimos ALINEAR
y veremos que tenemos 4 opciones, IZQUIERDA,
DERECHA, CENTRO y JUSTIFICAR.
Creando
enlaces
Aquí veremos como enlazar páginas,
es decir crear licks o unir cada una de las páginas del sitio. Primero
que nada vamos a probar enlazando un texto a un sitio web, por ejemplo
este www.trucosinformaticos.com, para lograr esto es muy sencillo, ponemos
por ejemplo en la página "Visitá TrucosInformaticos.com "
sin comillas obviamente, seleccionamos ese texto, le damos click con el
botón derecho del mouse y elegimosCREARVINCULO,
nos aparecerá un recuadro, en la parte que dice URLponemos
http://www.mglnet.com.ar
y le damos aceptar entonces veremos que ya se ha creado!
Todo sobre
imágenes en Dreamweaver
Bueno, en esta oportunidad veremos como insertar
imagenes con Dreamweaver, es muy muy fácil aunque ya hay que empezar
a ver un poco la parte del código, ya que necesitaremos cambiar
unas cosas que veremos adelante.
Para insertar una imágen es muy simple,
solo basta con ir a INSERTAR-IMAGEN
se nos abrirá el ya conocido menú donde elegimos la imagen
que queremos mostrar y listo. Si se quiere poner en el medio o a la derecha
solo basta hacer lo mismo que se hace con el texto.
Le damos F12así
probamos como se ve. Todo muy lindo, pero que sucederá cuando la
página este alojada en la web?, la imágen solo la tenemos
nosotros, entonces habrá que subirla, lo haremos por FTP
. Ahora la imágen ya está en el servidor, solo queda que
desde nuestra página accedamos y la mostremos, entonces allí
si se verá correctamente la imágen. Esto se hace con el botón
derecho sobre la imágen y elegimos PROPIEDADES,
se nos abrirá un menú abajo seguramente, vemos una opción
que dice: ORIGEN,
bien, allí colocamos la dirección donde esta la imágen.
Ya tenemos nuestra imágen en la página,
ahora veremos como hacer para que la imágen tenga un vínculo
a algún sitio o a donde queramos, otra vez le damos click botón
derecho y luego PROPIEDADES,
veremos el mismo cuadro y en vínculo ponemos la dirección
a donde queremos que al hacer click sobre la imágen se diriga.
Todo sobre tablas en Dreamweaver
Ahora viene la parte más aburrida que es
donde vemos las tablas, aunque es la parte más importante quizas
de este manual, ya que todo sitio bien hecho y bien ordenado está
hecho con tablas, sino uno se da cuenta que el sitio es hecho por un usuario
común o inexperto.
Primero iremos viendo de a poco, para conocer
más o menos como trabajan las tablas, crearemos una para el titulo
de la página y otra para el texto que irá debajo del mismo.
Para insertar una nueva tabla es muy simple,INSERTAR-TABLA
al ir allí se nos abrirá un nuevo recuadro, en el se nos
pregunta la cantidad de filas y columnas, ponemos 2 filas y 0 columnas,
ok, ahora se han creado, en la primera introducimos el titulo, le damos
algun color, le ponemos negrita y si quieren subrayado, en la tabla de
abajo empezamos a escribir un texto....
Por cierto podemos agrandar las tablas y achicar
a nuestro gusto,apretando el mouse sobre las lineas con el botón
izquierdo, podremos darle el espacio que querramos. Vemos como queda con
F12 y se ve que queda bastante bien, ok, pero ese borde queda mal así,
nos queda o cambiarle el color o quitarlo, iremos por paso, para cambiarle
el color, hacemos click en la tabla y vemos en la parte de código
de arriba esto: <table width="75%" height="96" border="1"> , donde border="1"
es el que debemos cambiar, el 1 por el 0, de esta manera la tabla no tendrá
borde. Para cambiarle el color, es botón derecho sobre la tabla,
allí seleccionamos PROPIEDADES,
y nos aparece nuevamente el recuadro, vemos la parte que dice Borde
Hacemos un click sobre la flecha negra que apunta
hacia abajo y elegimos el color, sino si sabemos los códigos de
los colores simplemente los escribimos.
|