Marcador (Arrastra con el ratón)

 Abrir el FrontPage

Archivo / Nuevo se abrirá un panel a la derecha y pinchamos en Pagina en blanco

aquí es donde vamos a trabajar, no olvidéis cerrar el panel de la derecha para tener mas espacio de trabajo

Ponemos el cursor en el centro

Tabla / insertar / Tabla

(Mi layout mide 736 de ancho, le di un poco menos a la tabla, para que quede ajustadita)

Aparecerá esta ventana, poner estos valores, no olvidéis marcar pixeles

Donde pone Examinar es para meter la URL de la parte central

que será la que aparece seleccionada en la captura  siguiente, vamos al Photobucket,

copiamos y pegamos en ese apartado

 

Vamos a Vista previa..

ya tenemos nuestro fondo

Volvemos a Diseño

Ponemos el cursor en la 1ª fila y lo centramos

de esta forma lo encontraremos mas fácil al meternos en código

vamos a código veréis el cursor parpadeando, ahí mismo es donde pegaremos la URL de la parte alta

Copiamos en el Photobucket

y pegamos  justo donde parpadea el cursor, antes borramos el  

ya tenemos la parte alta pegada, vamos a vista previa para asegurarnos

Volvemos a Diseño

Ponemos el cursor en la 3ª Fila, centrado

Copiamos la URL de la parte baja y repetimos los mismos pasos que antes

vamos a código y donde parpadee pegamos, borrando antes el  

Vista previa..

ya tenemos nuestro layout completo

Volvemos a Diseño

Ahora vamos a crear aquí en el centro una tabla donde ira el texto

a esta tabla se le da un medida mas pequeña que la del ancho de layout , dependerá del adorno del borde

para que el escrito siempre quede dentro de la textura lisa

Cursor centrado, Tabla / Insertar / Tabla

Ponemos estos valores

veis que el borde de mi layout es finito, por eso  he puesto 675 de ancho (en pixeles)

veis los márgenes, dentro de esta tabla escribimos y el texto queda sujeto

Yo siempre escribo esta palabra "TEXTO" es para localizarlo mejor en el código

Vamos a Código, fijaros en el width (ancho) de esta tabla, siempre aparece encima de donde escribimos "TEXTO"  asi es fácil localizarlo por si queremos modificar la medida

si necesitáis modificarla cambiar el numero respetando siempre las comillas

Vamos  Diseño, y escribir y comprobar que el texto no se sale y deforma el layout

Para cambiar el color del texto, nos ponemos en Diseño, seleccionar todo el texto

y aquí podemos elegir color

(lo voy explicando por orden, yo suelo cambiarlo al final de mi trabajo, cuando ya lo voy a guardar)

También podemos corregir la ortografía

Mi consejo es que estos dos pasos, color de texto y ortografía, se hagan al fin al antes de guardar,

mientras trabajamos siempre estamos modificando.

Damos a Intro y bajamos tres espacios, comprobareis que se va estirando la tabla

aquí ya podéis poner tanto, escrito como gráficos

si al poner un grafico os queda a la izquierda, lo seleccionáis y dais en centrar

Hasta aquí si todo ha ido bien, ya tenemos nuestro layout montado, en Vista previa se selecciona todo copiar y listo para pegar en un mensaje en el grupo

Pero vamos  avanzar un poquito mas, puesto que esto, ya es una pagina web, la terminamos para guardarla bien

pinchar en un trozo en el fondo de la pagina en lo blanco

Botón derecho / Propiedades de pagina

Aparece esta ventana, en la pestaña General, en Titulo, ponemos el nombre de como se llamara nuestra pagina

En caso de que quisierais meterle música, seria en el apartado

Sonido de fondo / Ubicación ahí se mete la URL de la canción

(la música tiene que estar subida a un alojamiento)

Sin cerrar esta ventana, vamos a la pestaña Formato, para poner color al fondo

Pinchar donde señala la captura

os saldrá esta paleta de colores

Pinchando es Mas colores, os saldrá esta nueva ventana

para mi gusto esta paleta es muy pobre en tonos de color, yo hago lo siguiente:

con el gotero de seleccionar, chupo color de la parte de mi pagina que me guste

o bien copio el código en la paleta de colores del PSP y lo pego donde pone Valor

si queremos un color sólido como lleva este tutorial, estos serian los pasos, damos aceptar y listo

En caso de querer poner una textura de fondo, lo haremos así:

Fijaros en la captura y hacer las diferentes pruebas

Ejemplos:

1. casilla Imagen de fondo picada

AQUÍ

2. casilla Convertir en marca de agua

AQUÍ

Unos consejos extras:

A veces según copiemos nuestro grafico del Photobucket, al poner el cursor encima de el

(en Vista Previa, lo comprobáis)

La verdad a mi me resulta feo

Podemos corregirlo así:

Pinchar encima de la Imagen botón derecho / Propiedades de imagen

 

En la pestaña General veis que aparece el nombre banner.jpg picture ese texto podemos quitarlo

o bien escribir lo que nos guste, que se lea al poner el cursor encima de esa imagen

 

Yo escribí esto

 

Ejemplo: Poner el cursor encima del banner

Ya tenemos una pagina WEB

Vamos a guardarla

(Otro consejito, durante la realización de nuestro trabajo es conveniente ir guardando,

por si hay algún problema, no lo perdamos todo)

A l principio dije la importancia de la organización,  de antemano habíamos creado una carpeta con todo lo relacionado a esta pagina

Archivo / Guardar como..

OJO!! Muy importante, en nombre de archivo todo minúsculas, seguido, sin signos raros,

ni que contenga la letra "Ñ"

asi no tendremos problemas si en un futuro queremos subir la pagina a un servidor

Buscamos la carpeta que creamos y le damos a guardar

 

 

 

Tutorial creado por Mane -1-11-2008