Crea tu página web desde OpenOffice

La suite ofimática OpenOffice incluye entre sus prestaciones un editor web, llamado genéricamente Documento HTML, que suele pasar desapercibido. Sería inútil hacer comparaciones con otros productos similares del mundo Open Source, pero bien merece una oportunidad

Francisco García Jiménez

Crea tu página web desde OpenOffice

22 febrero 2010

NIVEL: BÁSICO

EL Documento HTML no es KompoZer o Bluefish, que son programas específicamente diseñados para la creación de páginas web y que ofrecen al usuario una gran variedad de ventajas, pero tiene la virtud de poder trabajar de forma coordinada con otros integrantes de OpenOffice (http://es.openoffice.org), como, por ejemplo, Draw, lo que permitirá crear e introducir elementos gráficos en nuestra página.

Es un componente de uso sencillo, de hecho trabajamos como si se tratara de un procesador de textos, colocando los distintos elementos en la superficie de la página y sin necesitar conocimientos de programación, pudiendo ver en todo momento cómo va quedando el trabajo, ya sea viendo el código HTML que se genera automáticamente o desde el navegador. Además, podremos abrir Documento HTML desde cualquier aplicación de la suite, yendo a la barra superior de menús y pulsando sobre Archivo/Nuevo/Documento HTML.

Paso 1. Estructura básica

Una vez abierto este editor, empezamos por crear la estructura básica de nuestra página web, aunque luego podamos modificarla. Vamos a la barra superior y buscamos la cadena Formato/Página, con lo que abriremos una pantalla con cuatro pestañas y otras tantas posibilidade. Por ejemplo, el apartado Página nos va a permitir modificar su anchura, altura, orientación, márgenes, etcétera, de forma tan sencilla como si utilizaramos un procesador de textos, por lo que no nos extrañará encontrar dos solapas dedicadas a la modificación del encabezado y del pie.

Por su parte, desde Fondo es posible establecer el color o añadir una imagen como motivo básico para dicha página, que, siendo la primera, llamaremos sencillamente Index. Si optamos por escoger una instantánea que tengamos previamente archivada, iremos a Fondo/Como Imagen y, tras hacer clic sobre la tecla Seleccionar, la buscaremos y podremos colocarla a nuestro gusto, ya sea en el centro de la pantalla, en alguna parte de la misma o en forma de mosaico. Hecho esto, podemos ver el resultado de forma inmediata.

Antes de seguir, resulta muy conveniente hacer dos cosas: por un lado, ir grabando nuestro trabajo (Archivo/Guardar); por otro, ir viendo cómo queda el resultado en el navegador que por defecto usemos. Para ello, seguimos la ruta Archivo/Vista previa en navegador.

PASO-1

Paso 2. A por el texto

Colocar cualquier texto en la página es muy fácil, pudiendo escribirlo directamente. No obstante, es aconsejable utilizar los marcos para poder ir distribuyendo los contenidos de forma más racional, lo que a la larga nos facilitará el trabajo. Para ello, vamos a Insertar/Marco, de manera que aparezca una ficha que nos permitirá ajustar aspectos como borde, tamaño, etc. Lo más recomendable es elegir un ajuste a la página, de modo que podamos moverlo con el puntero de nuestro ratón y colocar en cualquier parte.

El texto que introduzcamos se puede modificar usando las herramientas que encontramos en la barra de formato, como tamaño, familia tipográfica o color del caracter. Y para facilitar más las cosas, al trabajar con el marco, se activa una barra específica que nos permitirá perfilar el aspecto del mismo, por ejemplo dando un color determinado a su fondo (o añadiendo una imagen) o aumentando el grosor de la línea del perímetro.

PASO-2

Paso 3. Hiperenlaces

¿Qué sería una web sin hiperenlaces, barras de navegación o marcas de texto? Pues desde Documento HTML es posible añadirlos en poco tiempo, aunque su acabado no sea el mismo que pueden ofrecer las aplicaciones más profesionales. Para insertar un link, seguimos la ruta Insertar/Hiperenlace, con lo que aparece una pantalla de configuración específica, desde la que elegir un destino determinado que se activará al hacer clic sobre este enlace. En concreto, tenemos la posibilidad de ir a una dirección en la red de redes, abrir el gestor de correo, importar un documento creado por diferentes tipos de aplicaciones, como una joja de cálculo o de presentaciones o saltar a otra parte del documento. Si optamos por esta última opción, aparece una pantallita con todos los contenidos que llevamos incluidos hasta la fecha, con lo que solo hace falta hacer clic con el ratón sobre cualquiera de ellos para que el enlace nos lleve a esa determinada parte.

Es importante señalar que, cuando escribamos el texto que va a identificar a nuestro link, rellenemos la caja correspondiente, porque, de lo contrario, en pantalla aparecerá la dirección completa de dónde se encuentra el documento, ya sea en otra parte de nuestra página o en la Red, y no queda bien. Una etiqueta genérica (por ejemplo, Mi galería de peces) quedará mejor.

También es posible hacer que una determinada foto se convierta en un hiperenlace. Para ello, empezamos insertando y ajustando nuestro marco; luego, hacemos clic dentro del mismo y vamos a Insertar/A partir de archivo. Buscamos la imagen y, cuando esté ajustada, repetimos el camino Insertar/Hiperenlace (la imagen debe de estar resaltada con sus cuadritos verdes). Entonces, se abre la pantalla de gestión de enlaces ya vista anteriormente. De esta forma tan fácil y rápida es posible ir creando botones de navegación sencillos.

PAso-3-Hiperenlaces

Paso 4. Barras de botones

También resulta muy accesible crear barras de botones para facilitar la navegación a nuestros posibles visitantes. Para ello, echaremos mano de la herramienta Tablas. Primero, creamos el marco (Insertar/Marco) y, luego, la insertamos desde Insertar/Tabla, con lo que aparecerá una pantalla desde la que podremos establecer la cantidad de filas o columnas. A continuación, jugaremos con dos barras de menús, la de formato de texto ya conocida y la específica de las tablas, con la que podremos modificar color de relleno, anchura de las celdas..., y todo de forma intuitiva. En cada celda podemos incluir un hiperenlace, una foto, etc.

PASO-4

Paso 5. Marcas de texto

Se trata de elementos fundamentales a la hora de facilitar la navegación por nuestro documento web. Al marcar una zona de la página, podemos volver a la misma desde cualquier sitio sin tener que estar pinchando continuamente en la flecha de retroceso. Para ello, empezamos colocando el cursor en el sitio que deseamos marcar como fijo, por ejemplo, el principio de la página Index. Luego, vamos a Insertar/Marca de texto, con lo que se abre una pantalla en la que escribiremos el nombre de esta marca; por ejemplo, INICIO. Solo resta crear en cualquier parte del documento, por ejemplo al final de cada página vinculada con Index, un enlace de texto que diga Inicio. Lo enlazamos con esta marca de texto como hemos visto, eligiendo la opción de buscar dentro del documento, con lo que se abre la ventana con todos los elementos creados. Escogemos el correspondiente a Marca de texto.

PASO-5

Un punto de partida

Estas páginas suponen un repaso rápido a las posibilidades que OpenOffice Documento HTML ofrece a los usuarios que no necesitan la potencia de otros editores similares o aquellos que quieran iniciarse en el mundo del diseño web. Nos dejamos en el tintero más posibilidades, como por ejemplo los contenidos que se pueden incluir, los cuales van desde objetos multimedia hasta gráficos estadísticos. Desde luego, OpenOffice Documento HTML puede ser un buen punto de partida para empezar a crear documentos web de todo tipo.

Loading...