El contenido es el rey de una página Web. La introducción, edición y aplicación de formatos de texto es una de las partes que mayor tiempo requieren en la creación de una página. Esta lección explica los fundamentos de la introducción de texto. Dreamweaver MX 2004 incorpora mejores herramientas de texto que sus anteriores versiones, aunque no llega al nivel de posibilidades de un procesador de textos. Si conoces el manejo de algún procesador de textos, posiblemente algunos de estos procedimientos ya los sepas.

Veremos cómo, al aplicar formato, ésta nueva versión 2004 nos ayuda con la fácil utilización de los Estilos para textos.

Es importante familiarizarnos con las etiquetas que determinan el estilo del objeto de texto. Al ser la piedra angular del contenido se van a repetir, no solo en la vista de código sino también en el Selector de etiquetas, nada más que empecemos a escribir en la ventana de documento.

Se utilizan para generar títulos con una determinada jerarquía, el de mayor nivel es H1, mientras que el de menor nivel es H6.

La etiqueta <font> determina el estilo de las letras del texto. Cada una de sus características la delimitan los atributos de esta etiqueta.

Estas etiquetas FONT con sus atributos de color, tamaño, etc. están en desuso ya que complican el código HTML multiplicando el número de etiquetas y atributos para aplicar formatos de texto.

La utilización de Estilos de texto resume el código HTML al mínimo necesario haciéndolo más ligero y fácil de "digerir" por los navegadores.

No sólo modifican etiquetas de texto, como veremos pueden encontrarse dentro de cualquier etiqueta (de texto, de imagen, de tablas, ...). Determinan la alineación de ese objeto con respecto a la página o a lo que le rodea.

Explicación de las referencias HTML

En Dreamweaver el texto se introduce como en un procesador de texto normal, escribiendo directamente en la ventana de documento en la vista de diseño.

• Introducir Párrafo: la entidad fundamental de texto, se consigue pulsando la tecla ENTER para finalizar el mismo.
• Introducir Salto de Línea: romper una línea perteneciente a un párrafo, pulsamos MAY+ENTER en el punto de ruptura.
• Introducir Caracteres raros: Caracteres que no se encuentran en el teclado o que requieren código HTML especial. Para todo esto Dreamweaver incluye la solapa Texto dentro del panel Insertar. El último icono de esta solapa despliega un menú de caracteres raros a insertar
  Por ejemplo, HTML solo permite 1 espacio entre caracteres. Para introducir más tenemos que insertar espacios indivisibles pulsando el segundo icono del menú de caracteres raros.
  

Dentro de una página Web nos será necesario situar el cursor en una posición determinada para introducir un carácter o hacer una corrección. Esta operación se puede realizar de múltiples formas, se describen a continuación las más importantes.

Con el ratón:

Basta con situar el puntero del ratón en la posición adecuada y hacer un clic, el cursor se situará en esa posición. Si se quieren realizar desplazamientos más largos primero se visualiza la zona empleando las barras de desplazamiento vertical u horizontal.

Con el teclado:

Movimiento Tecla Carácter Anterior (Izquierda) Carácter Siguiente (Derecha) Línea anterior (Arriba) Línea Siguiente (Abajo) Palabra Anterior CONTROL + Palabra Siguiente CONTROL + Inicio de Línea INICIO

Movimiento Tecla Fin de Línea FIN Inicio de Párrafo CONTROL + Fin de Párrafo CONTROL + Pantalla anterior RE PAG Pantalla Siguiente AV PAG Inicio del documento CONTROL + INICIO Fin del documento CONTROL + FIN

Movimiento en la ventana de Dreamweaver.

Para actuar sobre un texto ya escrito, será necesario seleccionarlo previamente, al seleccionar una porción de texto ésta queda en vídeo inverso (negro). No se pueden hacer selecciones discontinuas de texto. Los procedimientos más usuales para seleccionar texto, son los siguiente:

Arrastre

Se sitúa el cursor al inicio del bloque de texto y realizamos un arrastre con el botón izquierdo del ratón, observamos cómo el bloque de texto queda resaltado en vídeo inverso. Para eliminar la selección basta con picar con el ratón en cualquier parte del texto.

MAY + POSICIÓN

Para seleccionar un bloque de texto situamos el cursor en el inicio del bloque (hacemos clic con el ratón), pulsamos y mantenemos pulsada la tecla MAY, situamos el cursor con el ratón y pulsamos en el final del bloque de texto que se quiere seleccionar.

MAY + MOVIMIENTO

Situamos el cursor en el inicio del bloque a seleccionar, pulsamos y mantenemos la tecla MAY, movemos el cursor con cualquiera de los métodos descritos en el apartado de "Movimiento del Cursor".

SELECCIÓN PICANDO

• Una palabra: Doble clic sobre la palabra
• Una línea: Clic en la parte izquierda de la línea, el cursor cambia a flecha.
• Un párrafo: Triple clic en la parte izquierda del párrafo.

Selección de Texto

El portapapeles es un espacio destinado a almacenar temporalmente bloques de texto o gráficos. El contenido del portapapeles es único, si se almacena en el portapapeles un bloque de texto, éste sustituye a lo que estuviese almacenado en el portapapeles hasta el momento. El uso del portapapeles permite copiar y mover selecciones en un documento de Dreamweaver, en documentos distintos de Dreamweaver o en documentos distintos de diferentes aplicaciones, ésto se consigue gracias a que el contenido del portapapeles no desaparece cuando se cierra la aplicación actual. Las herramientas del Portapapeles se sitúan en la barra de herramientas Estándar.

Copiar. Edición/Copiar. Almacena en el portapapeles la selección actual. Si no hay nada seleccionado el botón está desactivado. Tecla rápida CONTROL + C

Cortar. Edición/Cortar. Almacena en el portapapeles la selección actual, borra del documento la selección. Al cortar se mueve la selección actual al portapapeles, desapareciendo del documento. Tecla rápida CONTROL + X

Pegar. Edición/Pegar. Pone en el documento actual, en donde esté situado el cursor, el contenido actual del portapapeles. Tecla rápida CONTROL + V

El procedimiento para mover o copiar un bloque seleccionado sin tener que utilizar las opciones de COPIAR, CORTAR y PEGAR. es:

• Seleccionamos el bloque de texto.
• Hacemos clic sobre el texto seleccionado y lo arrastramos, sin soltar el botón del ratón, hasta la nueva posición.
• Si se quiere mover el texto soltar el botón del ratón cuando el cursor se encuentre en la posición adecuada. Si se quiere copiar el texto mantener pulsada la tecla Ctrl mientras se realiza el arrastre.

Utilización del Portapapeles

BUSCAR Y REEMPLAZAR

Este comando nos ayudará a ahorrar tiempo y trabajo: Edición>Buscar y reemplazar.

La ventana que nos aparece nos ofrece un menú bastante intuitivo, donde destacan los campos donde incluimos el texto a buscar y aquel por el que queremos sustituirlo. Pero ésto es solo la punta del iceberg a la hora de hablar de las posibilidades de este comando y la precisión con que se puede utilizar.

Buscar en: Permite buscar en la página actual, en un conjunto de páginas seleccionadas desde la solapa de Sitio, en una carpeta o en todo el sitio Web. Los resultados de la búsqueda se presentarán en la solapa Búsqueda del panel de Resultados en el caso de que la opción elegida no sea Documento actual.

Buscar: Podemos buscar en el código fuente o en el texto (vista diseño). De una manera mas avanzada podemos buscar una determinada etiqueta o un modificador de una determinada etiqueta.

Remplazar con: si queremos reemplazar lo buscado por algo debemos indicar el texto en este cuadro de texto.

Podemos configurar las opciones de búsqueda:

• Coincidir mayúsculas y minúsculas.
• Omitir diferencias de espacios en blanco.
• Emplear expresiones regulares, las expresiones regulares son comodines que permiten encontrar distintos patrones de texto.

Una vez configurado el cuadro de diálogo tenemos la posibilidad de buscar o remplazar, uno por uno o todos a la vez.

Nota: Al realizar cualquier búsqueda o reparación con esta herramienta se abre el panel de Resultados para dar una relación de los cambios realizados en el código. Solamente se abre a título informativo.

 

Utilización de Buscar y reemplazar

DESHACER Y REHACER

El comando Deshacer debe de ser uno de los mejores inventos del siglo veinte. Que nos equivocamos, ¡Deshacer! Que cambiamos de idea ¡Rehacer!. El comando Deshacer deshace la última acción realizada. El comando Rehacer lo contrario. Retrocede tantos pasos como le permita la memoria de su equipo.

• Deshacer (Control + Z): seleccionamos Edición>Deshacer o botón de la barra de herramienta Estándar.
• Rehacer (Control + Y): seleccionamos Edición/Rehacer botón de la barra de herramienta Estándar.

El historial permite retroceder hasta un punto en particular, esta herramienta se estudia en profundidad en la lección de Productividad.

COMPROBACIÓN ORTOGRÁFICA

Para poder poner en marcha esta utilidad debemos seleccionar Texto>Ortografía. Ésto hará aparecer un cuadro de dialogo como este:

Una vez hayamos abierto el cuadro de dialogo, Dreamweaver comenzará a buscar fallos que pueda haber en el texto. Situamos por lo general el cursor al principio de la página Web antes de ejecutar el corrector, ya que si no puede que no compruebe todo el texto. Dreamweaver nos preguntará de todos modos, al llegar al final del texto si deseamos continuar la comprobación desde el principio. A continuación describimos cada una de las acciones que se pueden tomar desde este cuadro de diálogo.

• Agregar a personal: Incluye la palabra seleccionada a nuestro diccionario personal e impide que Dreamweaver la etiquete como palabra errónea.
• Omitir: Indica al programa que ignore la palabra seleccionada y continúe la búsqueda.
• Omitir todas: Omitirá todas las repeticiones de la palabra seleccionada en el documento entero.
• Cambiar: Si encontramos la palabra correcta en la lista de sugerencias y deseamos cambiar la errónea por ésta, la seleccionamos y presionamos este botón. Si no encontrásemos ninguna podemos escribir la correcta en el cuadro de texto Cambiar por.
• Cambiar todas: Todas las repeticiones de la palabra en cuestión encontradas en el documento serán reemplazadas por la palabra seleccionada en el cuadro Sugerencias.

El programa comprueba el texto usando dos diccionarios diferentes: uno Estándar. para el idioma seleccionado y otro personalizado. Para seleccionar el idioma seguimos estos pasos:

• Seleccionamos la opción Edición>Preferencias de página.
• En el cuadro de diálogo que se presenta hacemos clic sobre la categoría General.
• Desplegamos la lista Diccionario Ortográfico y seleccionamos la opción adecuada.

Utilización de la Comprobación Ortográfica

Twitter Meneame Delicious Technorati Digg Facebook