Diseño y Maquetado de Plantillas WEB 9 | Solo Photoshop
Tutorial Photoshop
Tutorial por Solo Photoshop
Solo Photoshop
DISEÑO Y MAQUETADO DE PLANTILLAS WEB 9
Con Adobe Photoshop, y Macromedia Dreamweaver
En esta novena entrega junto a Paquo360 llegamos a uno de los puntos mas esperados del tutorial, es el que mas han pedido los usuarios desde el comienzo, hablamos de maquetar la web con Macromedia DreamWeaver.
Abre tu diseño de Página, ahora en HTML. Dreamweaver, cuando esta en Vista Estándar , contrario a Front Page, te presenta una página limpia, libre de tantas celdas, te la muestra casi como te la mostraría un navegador. Veamos pues como se vería en internet presionando F-12 en tu teclado.
Para respetar al camino que se siguió con F.P. 2000, cambiemos el color de fondo de nuestra página, sin embargo haremos una pequeña escala en el HTML para ordenarlo y limpiarlo de los malos tratos de Image Ready.
Rápidamente demos un correcto formato al texto HTML pues Image Ready deja mucho que desear a la hora de escribir el código. Commands > Apply Source Formatting. Tal vez no distingas nada en la Vista del Diseño , pero puedes apréciar los cambios en la Vista del Código . Luego quitamos las marcas que Image Ready dejo: Commands > Clean Up HTML usas los parámetro de la imagen. Nos dice que removí y listo.
Presiona Ok (Aceptar) y listo.
Continuemos pues con el Color de Fondo. Vamos a Modify > Page Properties y seleccionamos el color de fondo que hemos venido usando, escribiendo directamente el código para este color que es ECEDF7 o muestreando con el selector de color .
De paso corregimos el Margen Superior (Top Margin) a un Valor = 0.
La imagen muestra las áreas donde se realizaron los cambios encuadradas de rojo.
Ahora hay que alinear nuestra pagina al centro, lo cual es muy simple. Nos pasamos a la Vista Layout presionando su respectivo botón .
Hacemos clic sobre la cresta principal del diseño para luego usar la Inspector de Propiedades (Window > Properties) Activamos el Tag Editor (o selector de etiquetas) Luego clic sobre el signo + Luego sobre el Menú Tag y seleccionamos Align Finalmente escribimos Center sobre el renglón emergente terminando con un Enter en tu teclado.
Este es el resultado.
Es hora de eliminar las imágenes del mismo color que el fondo de nuestra página. En algunos caso puede cambiar el tamaño de las cedas pero eso realmente poco afecta. Haz clic sobre las imágenes y presiona Supr (delete). Quitemos las imágenes de cada ventana.
Estas últimas sustitúyelas por color de fondo de celda, en este caso C3C7E5 que es el mismo color de las imagenes que las cubrían.
Toma la celda por cualquiera de los extremos y luego Sobre el Inspector de Propiedades cambia el Bg (background).
Y bueno ya solo nos falta la ultima entrega en version DreamWeaver, hasta la próxima.
Ver las demas entregas < 1 > < 2 > < 3 > < 4 > < 5 > < 6 > < 7 > < 8 > < 9 > < 10 >
Comentarios de Diseño y Maquetado de Plantillas WEB 9 | Solo Photoshop
↑ Tutorial
[»]
2006-06-07 08:36
rickblanc02
2006-06-07 10:01
krosty64
2006-06-07 19:52
kenshi
2006-06-15 16:14
Hilda Gutz
2006-09-18 14:38
miarle
2006-10-30 15:10
danielEx_666
2007-01-03 00:36
loquitonito
2007-03-30 01:17
↑ Tutorial