diseñar webs en photoshop

[annel_galvez]

Hola a todos los foristas....

Si alguien me puede ayudar.....mi problema es el siguiente:

Estoy tratando de diseñar una plantilla en photoshop que quiero que sea mi pagina de bienvenida en mi sitio pero lo que no se es de que tamaño tengo que hacerla o que medidas para que al momento de pasarla y editarla con dreamwever me respete las resoluciones de cada maquina en la que se vea esta pagina, ademas de que quiero evitar que aparescan las barras de desplazamento es decir, que la imagen o plantilla quede exactamente a la medida de la pantalla...

Si alguien me puede ayudar se lo agradeceria mucho ya que no puedo avanzar por ese problemilla y como soy principiante en esto de Photoshop, por eso.

Gracias....

[ruedito]

hombre, no todos usamos la misma resolución. Yo aquí tengo 1024x768 pero en el monitor de al lado tengo 800x600 y en el curro otra distinta...

Yo creo que lo mejor es centrarte en 800x600

Pero ya sabes...

[Caminante]

En las faqs, hay una guia interactiva

Capacidades del monitor
Equilibrio entre la legibilidad y la integridad:

Cuando se despliega a 200 dpi en un monitor de 800 x 600, sólo se puede ver una pequeña porción de la página (izquierda). A 60 dpi, se despliega completamente toda la página, pero a expensas de la legibilidad (abajo a la derecha).

La solución al escalar la imagen a 100 dpi permite mantener la legibilidad y limitar el desplazamiento a una dimensión (arriba a la derecha).

Cómo calcular el porcentaje visualizado.

http://www.library.cornell.edu/pres...ntation-06.html

[ruedito]

Ten encuenta que en photoshop diseñas imagenes (digamos) es de cir que no se van a estirar ni nada. Eso lo hacen las tablas. Tú en photoshop diseña lo que quieras, pero no esperes que se te vaya a adecuar a una resolución o a otra... ¿capicci compañero?

[camaleon79]

Algo mas, siempre calcula el espacio de la pantalla que te quita la barra de scroll de los navegadores. Para resoluciones de 800x600 yo uso de ancho 780x430 y encaja exacto en el ie (con las barras estandar) y NS (no he probado con opera) en todo caso, captura la pantalla con PrintScreen y mides el tamaño del area visible de la web.

[RM8]

Hola,
Te recomiendo uses otro programa para disenar paginas, si tienes el Front Page 2002 o XP mejor, o el Dreamweaver MX, esos dos los puedes usar en combinacion porque lo que uno tiene el otro no y viceversa. Photoshop es para diseno grafico al 100% y a pesar que puedes hacer paginas, es muy complicado y no tienes tanta flexibilidad como los otros en mencion.

Espero haber sido de tu ayuda.

RM8

[roro]

haz tu documento de photoshop de 770 x 450
y listo.
a 72 dpi

[efal]

Yo por experiencia uso 750 x 420.
La resolución es de 72 dpi
Tu regla deberá estar en pixels.
Trata que los botones y los gráficos tengan medidas enterás para cuando lo sectorizes no tnegas problemas en dramweaver.
Suerte

[Tubulars]

O si quieres usar mi forma de diseñar.
Monto el esqueleto de la web,solamente las tablas.
Despues voy al photoshop y voy haciendo parte por parte,por ejemplo... Primero el logo,despues un fondo por aquí y otro por alla... Siempre utilizando las medidas (pixels) que haya seleccionado en cada tabla.

[Wakkos]

Hummm, y porqué no te usas photoshop para las imágenes solamente?

O si quieres úsalo para tener una guía de como te va a quedar la web final, pero luego prográmala en CSS y tu verás si la haces líquida, fija o gelatinos, según el estilo que más te provoque, pero no dejes que photoshop te cree el código, sería malo malo malo, tanto como para cambios de resolución como para cambios de exploradores como para un montón de cosas.
Yo?
Yo hago el esquema (layout) de la web en Freehand, luego traduzco todo eso a CSS, HTML o lo que sea y luego las imágenes (logos, menú, etc) en Photoshop.

[varian]

Y que onda con el Adobe Live Motion, que es un estilo de Photoshop pero diseña el Layout, alguien lo usa realmente???

[asinox]

Bueno como lo hago yo con Firesworks....hago mi escenario de 770px para tener una vision de como se veria la pagina en 1024 x768 o en 800 x 600....

pues trabajo con una sola imagen....le doy sombra si quiero, bordes, 1 pixel Bevel o como sea.... el caso es que hay que trabajar en las esquinas, lados, top y la parte del pie del grafico...lo del centro por lo general siempre lleva el mismo color...

ahora bien, el truco esta en saber cortar las esquinas, las cuales siempre son 4... cortar la parte top, la cual se inserta en la celda de la tabla como bg con css y lo mismo para el grafico que va al pie de la pagina...

ahora bien, los dos lados laterales tambien se insertan como bg (por cierto son imagenes pequeñitas las que usas para todo esto...)..... este bg de los lados tambien debes ponerlo en las celdas que insertas las esquinas...(teniendo en cuenta si insertas el bg del top o el bg de los lados)....

esto te da la gran ventaja de que sin importar que definas tus tablas en Dreamweaver en 100% o 770px, de ambos casos se veran bien y no habra problemas...gracias al css para los BG.

Saludos.

[asinox]

perdon por la S de fireSworks ejej

[efal]

Tiene miles de maneras de hacerlo como te lo recomendamos todos.
Lo que si dale un tamaño que se pueda ver en todas las pantallas desde 800 x 600 hacia adelante.
Yo te recomiendo el 750 x 420.
De todas maneras si usas photoshop. tendras que usar dreamweaver asi no quieras.

[Wakkos]

dreamweaver?
no existen otros?
no existe el block de notas?
pues yo uso Photoshop y he usado Dreamweaver un par de veces solo para aprender...

[ea00d009]

si señor wakkos, opino lo mismo he usado dreamweaver muy pocas veces, solo cuando tengo que hacer alguna tabla muy compleja, para no matarme escribiendo el html. :)
Aguante en block de notas cheeee!!
y photoshop a full

[alvgarci]

Algunas cosas que me gustaría precisar.

La resolución dpi, no importa a la hora de trabajar para web, un imagen de 200 pixeles de ancho, se mostrará en 200 pixeles, sin importar los dpi de la imagen.

LiveMotion no es un programa para realizar páginas web, sino para realizar principalmente animaciones flash. El producto de Adobe para páginas web es GoLive.

Saludos.

[masterwww]

Te recomiendo uses otro programa para disenar paginas, si tienes el Front Page 2002 o XP mejor, o el Dreamweaver MX, esos dos los puedes usar en combinacion porque lo que uno tiene el otro no y viceversa. Photoshop es para diseno grafico al 100% y a pesar que puedes hacer paginas, es muy complicado y no tienes tanta flexibilidad como los otros en mencion.

a lo que el se refiere es a hacer el diseño de su web, que pueden ser bordes, imagenes, etc... me imagino que ya sabe que el photoshop es solo para el diseño grafico ... a lo que el se refiere es que el necesita conocer ciertas medidas para que en base a ello el pueda crear sus imagenes e insertarlas en su web y que quede como el quiere, con ayuda de algun editor, como el dream.. home site, etc etc

[asinox]

y cual es el problema con Dreamweaver o el Block de notas?...si ya manejas el html a plenitud para que peder tiempo en block de notas?....con editores como DW ahoras tiempo.... cito: cuanto ya sabes manejar el HTML a CodeHand.

[GonLarKov]

Mensaje Original por asinox
y cual es el problema con Dreamweaver o el Block de notas?...si ya manejas el html a plenitud para que peder tiempo en block de notas?....con editores como DW ahoras tiempo.... cito: cuanto ya sabes manejar el HTML a CodeHand.

No es ningun problema, me parece ke se refiere a que tambien existen alternativas y ke no solo de DW o Block de notas vive el hombre (ahi esta Adobe Golive por ejemplo)