Para crear nuestra página web, en este manual, utilizaremos Adobe Dreamweaver CS3, aunque podemos servirnos de otras versiones de este mismo programa.

Si no tienes el Dreamweaver, descarga la versión de prueba en la web oficial de Adobe, para hacerlo, click aquí (Necesitarás registrarte).

A continuación, nos aparecerá una ventana en blanco, parecida a la que se muestra al lado. En este entorno es en el que nos moveremos desde aquí, hasta que terminemos de editar nuestra página. En primer lugar podemos observar la pestaña "Común" rodeada en color rojo, bajo ella encontramos los botones de hipervínculo, vínculo de correo electrónico, anclaje, tabla, imagen, media, etc.

En las otras pestañas encontraremos otras herramientas que utilizaremos más tarde.

El botón de dividir es el que hace que el diseño de nuestra web y su código aparezcan simultáneamente. el código que encontramos en la fotografía, es el código estándar de una página web simple, en blanco, cuyo título es "Documento sin título" como observamos en las etiquetas <title></title>.

Para determinar la apariencia de la web, su color de fondo, el color del texto, su fuente, su tamaño, posición, color de vínculos o enlaces, imagen de fondo.. etc, haremos click con el botón derecho sobre la pantalla de diseño, y seleccionaremos "Propiedades de la página", el resultado es una ventana como la que se muestra al lado.

Ahora es el momento de otorgarle a nuestro sitio un estilo característico, escoge la fuente que más se adapte a tu página (ten en cuenta de que esa fuente solo podrán diferenciarla, cuando esté on-line, aquellos internautas que la tengan instalada, por eso se recomienda utilizar fuentes conocidas que se usan por defecto en windows: verdana, arial, times new roman, comic sans, etc), el tamaño del texto, color, color de fondo, imagen de fondo, márgenes, etc.

En cuanto a los vínculos, puedes escoger un color específico para ellos (siempre que sean vínculos de texto), puedes escoger la opción de que se subrayen automáticamente, de que cambien su color cuando el ratón pasa sobre ellos (Vínculos de sustitución), una fuente y/o tamaño específico para ellos, etc.

Hay también más opciones que podemos destacar, como por ejemplo, en la categoría de título/codificación, podemos escoger un título para la página, solo para la página en la que trabajamos, esto no es el nombre entero de tu web.

Al terminar, hacemos click en Aceptar y nuestra web habrá quedado configurada a nuestro gusto, si te fijas en la ventana de código habrán aparecido nuevos mensajes, estos son consecuencia de las opciones que hemos seleccionado para configurar nuestra página.

A mí me ha quedado así:

Hemos terminado el primer paso, bastante fácil ¿verdad? Bien, ahora aprenderemos a insertar texto en nuestra página y a crear enlaces y vínculos en el paso siguiente.