Configurar sitio y pginas web

Tema 3. Formato de texto y propiedades de pginas web en Adobe Dreamweaver CS6

Propiedades de pgina
Recuerde que la pgina web permite alojar texto, imgenes, videos, hipervnculos, mens y
objetos multimedia, sta tiene como tal un nombre y una extensin, asimismo, posibilita
configurar la presentacin por defecto, admitiendo constituir el ttulo de la pgina, los colores
de los hipervnculos, la fuente, el tamao, el estilo de las hojas, entre otras.
Procedimiento - configuracin de pgina web
1. En el inspector de propiedades se encuentra el cono para configurar las caractersticas
de la pgina web, tambin puede acceder a ellas desde el men Propiedades de la
pgina.





Activar propiedades de la pgina.


Inspector de propiedades

2. Aparece el cuadro de dilogo con todas las categoras y opciones de configuracin. En
la alternativa Apariencia (CSS) puede predeterminar todo lo relacionado con el texto,
margen e imagen de fondo.

3. En la categora Vnculos (CSS) es posible configurar las propiedades de los
hipervnculos, as como la fuente y los colores.



4. En Ttulo/Codificacin se pone el encabezamiento a la pgina, ste aparecer en la
barra del ttulo del navegador, tambin puede configurar estndares de despliegue.



Formato de texto
Inspector de propiedades
El inspector de propiedades posibilita la visualizacin de las caractersticas de los elementos
o del texto seleccionado. Adobe Dreamweaver CS6 deja ver el formato de las caractersticas
de texto de dos maneras: <> HTML y CSS (hojas de estilo).
Con la opcin HTML se tiene acceso al formato de texto para los hipervnculos, clases de
estilo, justificado, negrita, cursiva, hipervnculos y propiedades de pgina.


Con la alternativa CSS se tiene acceso al formato de texto, a las reglas de destino u hojas de
estilo, a la fuente, al tamao, al color, al justificado, a la negrita, a la cursiva y a las
propiedades de pgina.

Las propiedades del texto tambin se pueden modificar desde el men Formato.
Opcin CSS en el inspector de propiedades
Para dar formato al texto, Adobe Dreamweaver CS6 hace uso de las hojas de estilo (CSS),
pero para su creacin y configuracin provee una interfaz grfica, tal y como lo muestran las
imgenes.
Si se quiere dar formato a un prrafo de texto, es necesario crear una regla de destino (lo
que en s es una hoja de estilo CSS) con todas las caractersticas que se deseen adicionar.



HTML
y
CSS.
Activar / Desactivar inspector o
Men Ventana / Propiedades.


En regla de destino seleccione la opcin <Nueva regla CSS>.

Seleccione el texto al cual le va a dar las propiedades, luego d clic en Editar regla.
Posteriormente se despliega un cuadro para introducir el nombre del selector (estilo), d clic
en Aceptar.
En este ejemplo se cre el estilo Ttulo:



Despus de haber brindado el nombre del selector, se abre un cuadro de dilogo con las
opciones y tipos de caractersticas para asignar valores. La categora Tipo permite
especificar las modificaciones a realizar en el texto, en cuanto a fuente, tamao, color,
subrayado, negrita, entre otras.

En la categora Bloque se cambia el justificado del texto.



Al aplicar y aceptar la configuracin, se puede observar que el texto presenta las
propiedades asignadas.

Si desea que el ttulo tambin quede centrado, entonces en la regla de destino elija el
selector Ttulo y luego d clic en Editar Regla.



Se extiende el cuadro de dilogo para seleccionar categora y caractersticas. En la
propiedad Font-weight, elija bold (negrita).

Observe que ahora el ttulo HISTORIA DE COLOMBIA est centrado, con negrita, con
verdana, de color azul y subrayado.
Estas mismas propiedades van hacer aplicadas al ttulo INDEPENDENCIA DE COLOMBIA,
por ende, seleccione el texto y en Regla de destino ubique el selector Ttulo.



Visualice como el segundo ttulo queda con las mismas propiedades del primero.

1. Seleccione el texto.
2. Elija el selector.
(estilo).


Ahora se va a crear un estilo para los prrafos, el procedimiento es el mismo que el utilizado
para dar formato a los ttulos. Seleccione el texto, luego en Regla de Destino elija <Nueva
regla CSS> y posteriormente d clic en Editar regla.

Aparece el cuadro de dilogo para darle nombre al selector (estilo), en este caso Prrafo1,
despus d clic en Aceptar.
1. Seleccin del texto.
2. <Nueva regla CSS>.
3. Editar regla.




D la configuracin deseada en las categoras Tipo y Bloque.






Despus de dar clic en Aplicar y Aceptar, se ve que el texto queda justificado y con las
propiedades dadas, por lo que ahora se va hacer lo mismo con el segundo prrafo.
Seleccione el texto y en la opcin Regla de destino, escoja el selector Prrafo1.

Contemple el resultado despus de haber aplicado los diferentes formatos de texto por medio
de las hojas de estilo.




1. Seleccione el texto.
2. Elija el selector (estilo).


Referencias
Servicio Nacional de Aprendizaje, SENA. (2009). Diseo web con Adobe
Dreamweaver CS3. Colombia: Autor.

Control del documento
Nombre Cargo Dependencia Fecha
Autor

Jos Geovanny
Angulo Imbachi
Instructor
Centro de
Teleinformtica y
Produccin
Industrial. Regional
Cauca
Diciembre
de 2013
Guillermo Alexander
Burgos Ibarra
Instructor
Centro de
Teleinformtica y
Produccin
Industrial. Regional
Cauca
Diciembre
de 2013
Adaptacin
Rachman Bustillo
Martnez
Guionista -
Lnea de
Produccin
Centro
Agroindustrial.
Regional Quindo
Diciembre
de 2013
Andrs Felipe
Velandia Espitia
Integracin
de
Contenidos y
Actividades
Centro
Agroindustrial.
Regional Quindo
Diciembre
de 2013