¿A que resolución se diseñan las webs en Photoshop?
11 seguidores
A la hora de hacer una plantilla para una web en photoshop mi duda es la siguiente ¿a que resolución trabajais en el photoshop de inicio? ¿72ppp? ¿o se trabaja a mayor resolucion y luego se optimiza?
Gracias por la ayuda.
JAFERR
Yo no sé si hago una burrada, pero si trabajas a 72 ppp, muchas veces las imágenes y sobre todo los textos quedan bajos de calidad.
Yo suelo crear la plantilla o el banner o lo que vaya a hacer para web a su tamaño en pixels final a 72ppp. Una vez creado y para que me guarde las proporciones lo pongo a 250ppp interpolando (sin ningún elemento todavía creado) y trabajo todo en esa resolución. Una vez acabado, acoplo todas las capas, una vez acopladas lo bajo a 72ppp y ya lo grabo para web en jpg o png. De esta forma siempre consigo que el texto tenga una calidad muy buena, y de la otra forma no...
Juanjo Rodríguez
A 72ppp no sólo está bien, sino que es lo correcto.
Un saludo.
smalonso Mod
Se trabaja a 72ppp S-I-E-M-P-R-E
JAFERR
¿Sabéis por qué cuando por ejemplo en photoshop trabajas el texto a 72 ppp muchas veces sale pixelado al exportar la imagen para web? No me ocurre si lo hago a una resolución mayor y una vez acopladas las capas lo bajo todo a 72ppp y después lo exporto. Imagino que es un problema de conversión de vector a imagen si lo hace automático a 72ppp, pero lo que está claro que me queda todo perfecto y nítido haciéndolo a mi modo, y de la otra forma no.....???????
Alex Bailon
JAFERR
Supongo que eso te pasará por que al exportar para web, tendrás la calidad a 60 o más baja todavía. la calidad normalmente a 60 está bien, pero hay colores como el rojo, que se nota la perdida de calidad. se suele poner a 80 para que todos los colores se vean bien.
Pero las webs se diseñan a 72ppp a no ser que sean para iphone/ipad, que se aumenta la calidad debido al zoom y la pantalla retina de este.
Photonika
Me temo que estáis confundiendo las cosas de manera muy seria.
1. Lo más importante de todo: no importa a que ppp trabajes para pantalla (insisto, para pantalla), porque eso no se va a imprimir, y lo que estás indicando con la resolución es la densidad de pixels. En pantalla (web, etc) lo único que importa son las dimensiones del lienzo en pixels, 1000x650, 1900x1200, etc...
2. Lo de los 72ppp para pantalla es una leyenda urbana, un mito, y no es ni lo correcto ni lo incorrecto. No tenéis más que hacer la prueba: abrís un nuevo lienzo de, digamos, por poner un ejemplo, 1000x800 a 72 ppp, haced lo que queráis con él.. ponéis texto, fotos, lo que sea... y luego reducís la resolución, por ejemplo a 2ppp o 23ppp o los que queráis, pero manteniendo el tamaño del lienzo en 1000x800 pixels y a ver si encontráis diferencias. Veréis que en el cajetín cambia el tamaño de impresión, pero como no vamos a imprimir, no importa, sólamente tenemos que mantener el tamaño (largo por ancho en pixels) del archivo inicial.
Así de sencillo.
Jaferr: efectivamente, lo que estás haciendo no tiene ningún sentido.
EME
Me paso el día con ello y te puedo decir que como mejor trabajo es con las dimensiones del banner/pantalla/loquesea a su tamaño final en pixel y a 72dpi. El porqué a 72, porque sobre todo con los textos un cuerpo 10 es un cuerpo 10, mientras que si aumento la resolución para mantener la proporción del texto este tienes que indicar tamaños muy pequeños (2.5, 3...).
Por otro lado no hace falta fusionar las capas ni rasterizar el texto ya que la propia herramienta de guardar/web te lo hace, y nunca he tenido problemas con la visualización de los textos.
Otro consejo es trabajar iconos y demás elementos que puedan ser vectoriales en Illustrator/freehand y pegar como vectores en photoshop ya que podrás aumentar/reducir los mismos sin pérdida de calidad.
Photonika
Veamos, una cosa es como trabaje cada uno y otra es cómo son las cosas y lo que es correcto o no, y eso es invariable.
A ver, de nuevo: si trabajas para web, no importa si lo haces a 72, 9, o 13445 ppp, siempre que mantengas las dimensiones del canvas (o lienzo, como prefieras llamarlo). No hay ni que hacer proporciones, ni aumentar, ni disminuir ni experimentar con gaseosa.
Lo digo con más claridad, con lenguaje llano: sólo importa el largo x ancho del lienzo. Tanto la tipografía como la fotografía que utilices se van a ver exactamente igual dentro de ese lienzo: con el mismo tamaño, sin ningún tipo de modificación de calidad, ni pérdidas, ni nada raro, tanto si lo tienes a 72, 4, o 9432 ppp. Tanto si usas tipografía de 25 pixels o de 14 se van a ver también igual estés a 2, 4, o 72 ppp, y así sucesivamente.
Más claro imposible.
El problema está en que estáis confundiendo las cosas y mezclando conceptos: dimensiones de un documento para web con resolución, densidad de píxels, tamaño de impresión, etc.
Y lo mejor de todo viene ahora: ese archivo que has hecho a 2, 5, 72, o 1345 va a pesar exactamente lo mismo cuando lo guardes, siempre, repito y reitero, que mantengas las dimensiones (largo x ancho) del lienzo.
Espero que esté claro un concepto tan básico para un diseñador.
Y si me equivoco, que me expatrien de doméstika!
JAFERR
Efectivamente sea la resolución que sea, siempre manda el tamaño en pixels. Yo me expresé mal, porque lo que yo hago es poner por ejemplo una imagen de 500x500px a 72ppp.
Una vez la tengo, con todas las opciones marcadas para que remuestree la imagen proporcionalmente, la pongo a 250ppp. Con eso la imagen mide 1736x1736px. Trabajo a ese tamaño en alta resolución, y cuando está terminado, una vez acopladas las capas, vuelvo a hacer la operación a la inversa, remuestreando todo a 72ppp, por lo que la imagen final una vez trabajada vuelve a tener 500x500px. Ahora es cuando la grabo para web. De esta forma, siempre consigo imágenes más limpias y nítidas, sobre todo en los textos, que trabajando directamente en el documento de 500x500px.
Photonika
Vale, pero ahora deberías tener claro que no importa si pones 72 o 4 ppp.
Esto sí que ya me rompe los esquemas, Jaferr, nunca he visto a nadie hacer algo así, y de hecho no tiene sentido lógico. Algo estás haciendo para que ese documento que dices que no te queda bien trabajándolo con su dimensión final (que no resolución), no te quede correctamente. No hace falta para nada reescalar ni modifcar la resolución. ¿Qué tipo de antialiasing usas con la tipografía si trabajas en el documento original sin hacer todo ese proceso de modificar la resolución? ¿Qué tratamiento haces a las fotografías? Hay muchos detalles que influyen para que un trabajo no quede fino, pero lo que haces, ya te digo.. primera vez en mi vida que lo veo, y no le veo el sentido por ninguna parte.
Es que a ver, antes que hacer todo eso me hago la web en Illustrator, que también es una estupenda y correcta forma de trabajar y te queda todo niquelado.
HHACHE
la verdad es que me habeis solucionado las dudas hasta el extremo :D
muchísimas gracias a todos!!!!!!
EME
Photonika totalmente de acuerdo contigo.
Jaferr, tampoco encuentro sentido a lo que haces ya que nunca he tenido problemas ni con las imágenes ni con los textos.
abrahamnavas
Photonika
chuchonieto
Bien explicado Photonika!
Es la misma teoría que podemos aplicar a las webs y aplicaciones específicas para iPhone/iPad/etc (lo cuento porque hace nada tuve que pasar un buen rato buscándolo para aclararme con el tema y así refresco conocimientos... y me corregís si me equivoco!)
El iPhone4 tiene exactamente el mismo tamaño de pantalla que el iPhone3 (3,5pulgadas) pero en el último modelo han logrado duplicar la densidad de píxeles (de 164 a 326ppp), por eso el tamaño "digital" de la pantalla ha cambiado de 320x480px a 640x960px.
Total, que aunque en las especificaciones veamos 164/326ppp, podremos trabajar los archivos destinados a estos dispositivos a la resolución que queramos (1, 5 o 1000ppp) ya que esta especificación no tiene nada que ver con la resolución de impresión, solo siendo importante el ancho y alto en px del archivo.
ricciardo19
Yo no me he enterado de nada, porque los textos me siguen quedando serrados.... Al final en web ¿¿da igual que trabaje a 72ppp o 90ppp??