Formato de texto

Aplicación de formato al texto
La aplicación de formato a texto en Dreamweaver es similar a la utilización de un programa estándar de tratamiento de texto. Puede establecer estilos de formato predeterminados (Párrafo, Encabezado 1, Encabezado 2, etc.) para un bloque de texto, cambiar la fuente, el tamaño, el color y la alineación del texto seleccionado o aplicar estilos de texto, como negrita, cursiva, monoespacio y subrayado.
De forma predeterminada, Dreamweaver aplica formato a texto mediante hojas de estilos en cascada (CSS). Los estilos CSS ofrecen a los diseñadores y desarrolladores Web un mayor control sobre el diseño de la página Web, a la vez que les permite utilizar funciones mejoradas que optimizan la accesibilidad y reducen el tamaño de archivo. Puesto que el formato y la alineación se aplican mediante los comandos de formato de Dreamweaver, las reglas CSS están incrustadas en el documento actual. Esto le permite reutilizar fácilmente los estilos existentes, así como asignar nombre a los estilos que cree. CSS se está convirtiendo en el método preferido para aplicar formato a texto y presentar páginas Web.
Si lo prefiere, puede optar por utilizar etiquetas de formato HTML para aplicar formato y alinear el texto de las páginas Web. Si necesita utilizar etiquetas HTML en lugar de CSS, debe cambiar las preferencias de formato de texto predeterminadas de Dreamweaver. (Para más información, consulte Especificación HTML en lugar de CSS.)
La utilización de CSS es una forma de controlar el estilo de una página Web sin implicaciones para su estructura. Al separar los elementos visuales de diseño (fuentes, colores, márgenes, etc.) de la estructura lógica de una página Web, CSS permite a los diseñadores Web tener un control visual y tipográfico de la página Web sin que ello repercuta negativamente en la integridad del contenido. Además, al definir el diseño tipográfico y el diseño de la página a partir de un solo bloque de código, sin tener que recurrir a mapas de imagen, etiquetas font, tablas y GIF espaciadores, se pueden llevar a cabo descargas más rápidamente, mejorar el mantenimiento del sitio Web y establecer un punto central desde el que se pueden controlar los atributos de diseño de varias páginas Web.
Los estilos CSS definen el formato del texto de una determinada clase o redefinen el formato de una etiqueta HTML específica (como h1, h2, p o li).
Puede almacenar los estilos CSS que cree directamente en el documento (la configuración predeterminada al aplicar formato al texto empleando el inspector de propiedades) o, si desea tener mayor control y flexibilidad, en una hoja de estilos externa. Si adjunta una hoja de estilos externa a varias páginas Web, todas las páginas reflejarán automáticamente los cambios realizados en la hoja. Para acceder a todas las reglas de estilos CSS de una página, utilice el panel Estilos CSS (Ventana > Estilos CSS).
Para más información sobre la utilización del inspector de propiedades de texto para aplicar HTML o CSS, consulte Configuración de opciones de propiedades de texto en el apartado Utilización de Dreamweaver de la Ayuda. Para más información sobre cómo utilizar el panel Estilos CSS para aplicar estilos, consulte Utilización del panel Estilos CSS en el apartado Utilización de Dreamweaver de la Ayuda.
NOTA

Puede combinar formato CSS y HTML 3.2 en la misma página. La aplicación de formato se realiza de forma jerárquica: el formato HTML 3.2 tiene prioridad sobre el formato aplicado mediante hojas de estilo CSS externas y el estilo CSS incrustado en un documento tiene prioridad sobre el estilo CSS externo. Para más información, consulte Utilización de hojas de estilos en cascada para aplicar formato al texto.
Temas relacionados

Hiperenlace

Un hiperenlace (también llamado enlace, vínculo, o hipervínculo) es un elemento de un documento electrónico que hace referencia a otro recurso, por ejemplo, otro documento o un punto específico del mismo o de otro documento. Combinado con una red de datos y un protocolo de acceso, un hiperenlace permite acceder al recurso referenciado en diferentes formas, como visitarlo con un agente de navegación, mostrarlo como parte del documento referenciador o guardarlo localmente.
Existen diferentes clases de rutas de acceso a la hora de definir los vínculos.
Referencia absoluta:
Conduce a una ubicación externa al sitio en el que se encuentra el documento. La ubicación es en Internet, por ejemplo, "http://www.aulaclic.com".
Referencia relativa al sitio:
Conduce a un documento situado dentro del mismo sitio que el documento actual.
Referencia relativa al documento:
Conduce a un documento situado dentro del mismo sitio que el documento actual, pero partiendo del directorio en el que se encuentra el documento actual.
Puntos de fijación:
Conduce a un punto dentro de un documento, ya sea dentro del actual o de otro diferente. Para ello el vínvulo debe ser "nombre_de_documento#nombre_de_punto". El punto se define dentro de un documento a través del menú Insertar, opción Anclaje con nombre.

La forma más sencilla de crear un enlace es a través del inspector de propiedades. Para ello es necesario seleccionar el texto o el objeto que va a servir de enlace, y seguidamente establecer el Vínculo en el inspector.
Por ejemplo, aquí hay un enlace a www.elpais.es, que es de referencia absoluta, por eso contiene HTTP://
Otra forma de crear un enlace es a través del menú Insertar, opción Hipervínculo.
Es posible crear también vínculos vacíos, que pueden ser útiles cuando se utilizan comportamientos, etc. Para ello es necesario escribir en Vínculo únicamente una almohadilla '#'.

Configuración de un sitio de Dreamweaver nuevo

Configuración de un sitio de Dreamweaver nuevo

Después de planificar la estructura del sitio, o si ya posee un sitio, debe definir un sitio en Dreamweaver antes de iniciar el desarrollo. Configurar un sitio de Dreamweaver permite organizar todos los documentos asociados con un sitio Web. Para más información, consulte Acerca de los sitios de Dreamweaver.
NOTA

También puede editar archivos sin configurar un sitio de Dreamweaver. Para más información, consulte Acceso a sitios, a un servidor y a unidades locales.
Después de configurar un sitio de Dreamweaver, es recomendable exportar el sitio para disponer de una copia de seguridad local. Para más información, consulte Importación y exportación de sitios.
Para definir un sitio de Dreamweaver:
Seleccione Sitio > Administrar sitios.
Aparece el cuadro de diálogo Administrar sitios.
NOTA

Si no tiene ningún sitio de Dreamweaver definido, aparecerá el cuadro de diálogo Definición del sitio y podrá omitir este paso y continuar con el siguiente.
Haga clic en el botón Nuevo.
Aparecerá el cuadro de diálogo Definición del sitio.
Siga uno de estos procedimientos:
Haga clic en la ficha Básicas para utilizar el asistente para la Definición del sitio, que le guiará a través del proceso de configuración.
NOTA

Se recomienda que los nuevos usuarios de Dreamweaver utilicen el asistente para la Definición del sitio. Es probable que los usuarios que tengan más experiencia con Dreamweaver prefieran las opciones avanzadas.
Haga clic en la ficha Avanzadas para utilizar las opciones avanzadas, que le permiten configurar carpetas locales, remotas y de prueba por separado según convenga.
NOTA

Para empezar, puede configurar un sitio de Dreamweaver completo, o simplemente realizar el primer paso, la configuración de la carpeta local.
Realice el proceso de definición del sitio de Dreamweaver:
En el asistente para la Definición del sitio, responda a las preguntas de cada pantalla y, a continuación, haga clic en Siguiente para avanzar en el proceso de configuración o haga clic en Atrás para regresar a una pantalla anterior.
Como opciones avanzadas, complete las categorías Datos locales, Datos remotos y Servidor de prueba según convenga (véase Utilización de las opciones avanzadas para configurar un sitio de Dreamweaver).
SUGERENCIA

Después de configurar un sitio de Dreamweaver, es recomendable exportar el sitio para disponer de una copia de seguridad local. Para más información, consulte Importación y exportación de sitios.
Si está configurando un sitio de Dreamweaver para una aplicación Web, véase Configuración de una aplicación Web.

Adobe Dreamweaver

Adobe Dreamweaver es una aplicación en forma de estudio (basada en la forma de estudio de Adobe Flash) enfocada a la construcción y edición de sitios y aplicaciones Web basados en estándares. Creado inicialmente por Macromedia (actualmente producido por Adobe Systems). Es el programa de este tipo más utilizado en el sector del diseño y la programación web, por sus funcionalidades, su integración con otras herramientas como Adobe Flash y, recientemente, por su soporte de los estándares del World Wide Web Consortium. Su principal competidor es Microsoft Expression Web y tiene soporte tanto para edición de imágenes como para animación a través de su integración con otras. Hasta la versión MX, fue duramente criticado por su escaso soporte de los estándares de la web, ya que el código que generaba era con frecuencia sólo válido para Internet Explorer, y no validaba como HTML estándar. Esto se ha ido corrigiendo en las versiones recientes.

Se vende como parte de la suite Adobe Creative Suite 3 y 4.
La gran ventaja de este editor sobre otros es su gran poder de ampliación y personalización del mismo, puesto que en este programa, sus rutinas (como la de insertar un hipervinculo, una imagen o añadir un comportamiento) están hechas en Javascript-C, lo que le ofrece una gran flexibilidad en estas materias. Esto hace que los archivos del programa no sean instrucciones de C++ sino, rutinas de Javascript que hace que sea un programa muy fluido, que todo ello hace, que programadores y editores web hagan extensiones para su programa y lo ponga a su gusto.
Las versiones originales de la aplicación se utilizaban como simples editores WYSIWYG. Sin embargo, versiones más recientes soportan otras tecnologías web como CSS, JavaScript y algunos frameworks del lado servidor.
Dreamweaver ha tenido un gran éxito desde finales de los 90 y actualmente mantiene el 90% del mercado de editores HTML. Esta aplicación está disponible tanto para la platafoma MAC como para Windows, aunque también se puede ejecutar en plataformas basadas en UNIX utilizando programas que implementan las API's de Windows, tipo Wine.
Como editor WYSIWYG que es, Dreamweaver oculta el código HTML de cara al usuario, haciendo posible que alguien no entendido pueda crear páginas y sitios web fácilmente.
Algunos desarrolladores web critican esta propuesta ya que crean páginas HTML más largas de lo que solían ser al incluir mucho código inútil, lo cual va en detrimento de la ejecución de las páginas en el navegador web. Esto puede ser especialmente cierto ya que la aplicación facilita en exceso el diseño de las páginas mediante tablas. Además, algunos desarrolladores web han criticado Dreamweaver en el pasado porque creaba código que no cumplía con los estándares del consorcio Web (W3C).
No obstante, Adobe ha aumentado el soporte CSS y otras maneras de diseñar páginas sin tablas en versiones posteriores de la aplicación.
Dreamweaver permite al usuario utilizar la mayoría de los navegadores Web instalados en su ordenador para previsualizar las páginas web. También dispone de herramientas de administración de sitios dirigidas a principiantes como, por ejemplo, la habilidad de encontrar y reemplazar líneas de texto y código por cualquier tipo de parámetro especificado, hasta el sitio web completo. El panel de comportamientos también permite crear JavaScript básico sin conocimientos de código.

HTML

HTML, siglas de HyperText Markup Language (Lenguaje de Marcado de Hipertexto), es el lenguaje de marcado predominante para la elaboración de páginas web. Es usado para describir la estructura y el contenido en forma de texto, así como para complementar el texto con objetos tales como imágenes. HTML se escribe en forma de "etiquetas", rodeadas por corchetes angulares (<,>). HTML también puede describir, hasta un cierto punto, la apariencia de un documento, y puede incluir un script (por ejemplo Javascript), el cual puede afectar el comportamiento de navegadores web y otros procesadores de HTML.
HTML también es usado para referirse al contenido del tipo de MIME text/html o todavía más ampliamente como un término genérico para el HTML, ya sea en forma descendida del XML (como XHTML 1.0 y posteriores) o en forma descendida directamente de SGML (como HTML 4.01 y anteriores).

Elementos
Los elementos son la estructura básica de HTML. Los elementos tienen dos propiedades básicas: atributos y contenido. Cada atributo y contenido tiene ciertas restricciones para que se considere válido al documento HTML. Un elemento generalmente tiene una etiqueta de inicio (p.ej. ) y una etiqueta de cierre (p.ej. ). Los atributos del elemento están contenidos en la etiqueta de inicio y el contenido está ubicado entre las dos etiquetas (p.ej. Contenido). Algunos elementos, tales como
, no tienen contenido ni llevan una etiqueta de cierre. Debajo se listan varios tipos de elementos de marcado usados en HTML.

El marcado estructural describe el propósito del texto. Por ejemplo,

Golf

establece a "Golf" como un encabezamiento de segundo nivel, el cual se mostraría en un navegador de una manera similar al título "Marcado HTML" al principio de esta sección. El marcado estructural no define cómo se verá el elemento, pero la mayoría de los navegadores web han estandarizado el formato de los elementos. Un formato específico puede ser aplicado al texto por medio de hojas de estilo en cascada.

El marcado presentacional describe la apariencia del texto, sin importar su función. Por ejemplo, negrita indica que los navegadores web visuales deben mostrar el texto en negrita, pero no indica qué deben hacer los navegadores web que muestran el contenido de otra manera (por ejemplo, los que leen el texto en voz alta). En el caso de negrita e itálica, existen elementos que se ven de la misma manera pero tienen una naturaleza más semántica: enfásis fuerte y énfasis. Es fácil ver cómo un lector de pantalla debería interpretar estos dos elementos. Sin embargo, son equivalentes a sus correspondientes elementos presentacionales: un lector de pantalla no debería decir más fuerte el nombre de un libro, aunque éste esté en itálicas en una pantalla. La mayoría del marcado presentacional ha sido desechada con HTML 4.0, en favor de Hojas de estilo en cascada.

El marcado hipertextual se utiliza para enlazar partes del documento con otros documentos o con otras partes del mismo documento. Para crear un enlace es necesario utilizar la etiqueta de ancla junto con el atributo href, que establecerá la dirección URL a la que apunta el enlace. Por ejemplo, un enlace a la Wikipedia sería de la forma Wikipedia. También se pueden crear enlaces sobre otros objetos, tales como imágenes .