Utilizar Photoshop

[innes]

Buenas tardes a todos:

Acabo de descubrir que Photoshop CS3, tiene una bonita función para exportar los sectores generando las CSS, ¿es un método bueno para diseñar/maquetar webs? ¿lo soleis usar?

gracias

[Calizman]

Yo no tengo Photoshop... pero a mi ver... te diria que no... porque imagina esto:

Tienes un grave problema con el CSS, algo no cuadra donde tu quieres y tienes que cambiarlo! pero como no sabes donde esta porque no lo generaste tu... te desesperas y vuelves a comenzar...

Esto te quita tiempo y se hace mas tardado!

Te invito a que aprendas CSS e intentes hacer todo con codigo propio.. asi al final tendras el orgullo de decir que tu lo hiciste y sera propio tu codigo...

Saludos!

[innes]

No lo veo así exactamente (lo de que al final para modificar algo tardes más, sino prueba a instalarte un photoshop demo o algo así, generas el css y verás que es exactamente igual que si lo hicieras tu mismo) aunque coincido en algo que es una verdad universal que es que cuantos más conocimientos se tengan, en general de lo que sea, pues mejor, pero claro, ya sabemos como funcionan las empresas:

EL TRABAJO ES PARA AYER

Y si uno sabe algo (porque yo sé algo de css, no he dicho que sea totalmente novata en el asunto) pero no es un eduardo manostijeras del código, pues por qué no servirse de las ayudas y los avances en software?

Bueno, está claro que es mi opinión pero intento ser objetiva

Alguien usa esta función o la conoce?

[Mikmoro]

Pero la respuesta que tú buscas ya la das tu y además no admite discusión: ¿tu empresa lo quieres super-rápido y que parezca decente, sin importarle en realidad si el código es más o menos limpio, más o menos legible y aceptable por lo motores de búsqueda, si está optimizado para ahorrar ancho de banda, si está pensado para una mejor accesibilidad, y un largo etcétera?
Está claro: debes "servirte de las ayudas y los avances en software".

Era eso, ¿no?. Porque al menos ha sido tu respuesta a quien te dice que no le parece buena práctica.

En realidad: ¿sirve para sacar de un apuro de auténtica prisa? seguramente sí, igual que Frontpage (aunque no sé porque no lo he visto) pero con el compromiso de revisarlo en cuanto tengas algo de tiempo, porque probablemente algo fallará.
¿Significa eso que genere un código óptimo para uso profesional? lo dudo. Dudo bastante que sepa evitar los problemas entre navegadores, resoluciones o evitar problemas y ruido de accesibilidad.

Es mi opinión.

[MasterXNicoX]

Se, yo opino lo mismo que Mik, no creo que un programa sea tan inteligente como para armar un código mejor que el que uno puede llegar a hacer a mano y que a la vez se fije en la accesibilidad, resoluciones y demás...

[innes]

Bueno, acepto vuestras opiniones pero aun nadie de los que habeis contestado realmente lo habeis usado...

yo a primera vista, he mirado el código generado con photoshop y lo he visto completamente normal, lo cual no quita que luego haya que revisarlo (cosa que también se ha de hacer cuando lo hace desde cero uno) o añadir o modificar ciertas pequeñas cosas...También hace años se podría haber pensado que como iba photoshop a ser un buen programa para hacer animaciones sencillas y hoy en día, junto al flash por supuesto, es un standard para la creación de gifs animados o banners, con sus mejoras en las funciones de animación...

Pues nada, que sigo insistiendo en si alguien lo ha probado o lo usa de vez en cuando para que me cuente los puntos débiles o aquello para lo que no esté indicado O si de lo contrario no hay ninguna pega :)

[JavierB]

Hola innes

¿Puedes poner un enlace a alguna página que hayas hecho de esa forma?

Saldos,

[innes]

No trabajo actualmente por desgracia, solo comenté que había descubierto esta función y la he probado pero no he tenido la oportunidad de usarla todavía a nivel profesional. Por eso insisto tanto en preguntar alguien que lo use a nivel profesional, pero claro, en este foro que todo el mundo es un máquina de la programación pues quizás no es para nada indicado...

[Calizman]

Saludos innes!

Que mal que aun no trabajes con la herramienta... y si yo no trabajo en ella, no es porque sea una "maquina de la programacion", al contrario... me catalogo como un novato en el CSS y en el HTML, lo que pasa es que me gusta programar y aprender mas sobre cada uno de los dos mencionados...

Te recomiendo que lo uses! (ya que el recomendar que no lo usaras me trajo problemas) tambien te recomiendo que hagas una web con esa herramienta y que la subas a un host gratuito para ver como es... luego la pones aqui y asi aprendemos todos... no?

jeje.. Saludos! y Suerte!

[McPinkY18]

calizz vi tu reto con aresillo tu pagina esta bien currada :)

R= innes

Lo mejor seria que aprendas html y css una vez aprendas mas o menos los tag y reglas de estas 2 cosas puedes empezar a usar photoshop o fireworks una ves eso tambien puedes usar dreamweaver que son cosas q facilitan el trabajo yo lo e visto usar en personal q hace paginas web pero de todas formas esas personas saben el codigo y no solo se guian del famoso WYSWYG (lo que ves es lo que obtienes) = Dreamweaver.

Solo eso SAludos!

[Calizman]

Gracias! McPinkY18!

Espera la revancha en Enero 2009 xD

[Mikmoro]

Iniciado por innes

ya sabemos como funcionan las empresas:
EL TRABAJO ES PARA AYER

Iniciado por innes

No trabajo actualmente por desgracia, solo comenté que había descubierto esta función y la he probado pero no he tenido la oportunidad de usarla todavía a nivel profesional.

Osea que no era que te exigieran velocidad, sino que querías saber si llegado el caso te serviría para ahorrarte mucho tiempo. Bien, por eso dije "lo dudo", y creo que argumenté claramente por qué no creo que sea posible. Tienes razón con que sigue sin contestarte alguien que lo haya probado de verdad, pero a veces hay cosas obvias. Parecía mentira, quién iba a decir que un programa como Frontpage generaría miles y miles de páginas web, y ahí está la realidad. Pero eso no evita en absoluto la realidad de que Frontpage genera el código HTML más espantoso que puedes encontrar.

Imagina: Photoshop acaba de sacar una herramienta increíble para crear carteles publicitarios; metes 4 fotos, eliges dos colores, tres tamaños de texto y metes unos textos y en unos segundos te genera 6 carteles diferentes. ¿Qué te parece?

Si eres diseñadora dirás: "o sí, quizá alguna composición le puede quedar bonita, pero, ¿de dónde sacará la capacidad de entender al cliente, de producir arte, de emocionar a la persona que lo mira, de crear el auténtico impacto publicitario, y un enorme etcétera?". Esto es una obviedad para ti por dedicarte al diseño, y seguramente no necesitas haberlo probado personalmente para poner en duda todas esas cosas, esas posibilidades o capacidades de un programa de software.

Pues lo mismo ocurre con CSS y la accesibilidad, la usabilidad, los distintos navegadores, resoluciones, tipos de pantalla, y otro largo etcétera.

¿Te servirá de mucho la opinión de alguien que lo ha probado? ¿y ese alguien, qué conocimientos tendrá? ¿sabrá lo que son los estándares y las validaciones? ¿o irá a batalla sin preocuparse de lo limpio o no?

Si como has dicho ya sabes algo de CSS (por lo que todavía entiendo menos tu consulta), ponlo a prueba sencillamente, y como te ha dicho JavierB, haz un diseño de prueba, pon una captura, genera esa CSS y mira cómo lo hace, y luego nos la pones para saber con exactitud qué tal código ha generado. El resto es especular, pero apuesto contigo a que no irá muy lejos de lo que hemos hablado.

[Calizman]

Totalmente deacuerdo Mik! una vez mas sorprendes con tus respuestas!

[innes]

Jo, que polémica con el tema

A ver, en cierto modo os entiendo, pero teneis que comprender, que no se puede ser bueno en todo, o mejor dicho experto en todo, y si yo soy profesional del diseño gráfico por formación y por trayectoria profesional, puedo haberme intentado meter en el mundo del diseño web y medio defenderme pero evidentemente no voy a ser igual que un tipo que ha estudiado informática o teleco y sabe varios lenguajes diferentes, sabe el porqué de las cosas, etc...

A lo que yo voy es que si algun día entro en alguna empresa en calidad de diseñadora web, ya se sabe que hoy en día lo que buscan es un híbrido entre diseñador y programador y me tocaría programar algo, con lo cual, al no ser tan experta como otro, pues lo que se podría hacer en 1 hora por decir algo, a mi seguramente me llevaría 3 y al final no sale rentable sobre todo a la empresa (y a mi tampoco porque con la crisis y la competencia que hay hoy día seguramente me pegarían la patada y meterían a otra persona).

Si puedo agilizar el proceso de trabajo en aquellas partes que me cuestan más pues no veo el porque de no usar las herramientas que te ayudan, es que además me gustaría que lo hubierais probado esto del Photoshop, porque yo sinceramente que he mirado el código y teniendo en cuenta que hablo de diseñar una web "normalita", un html y unos estilos para las capas, pensando que luego las cosas complejas las va a programar el desarrollador (las partes que requieran programación del lado del servidor, se dice así no? jeje) pues lo veo perfecto..pero claro, no me quedo tranquila y por eso me metí en el foro...aunque veo que me seguiré quedando con la duda...

gracias por opinar de todos modos a todos

[Mikmoro]

Repito: ¿pero quién te podría quitar la duda? ¿de qué manera?

1.- Soy un experto en CSS y te digo que ni se te ocurra, que el código que te genera es tan malo que no te va a sacar del apuro. ¿Te saca de la duda?
2.- Soy un diseñador que sabe poco de CSS y te digo que esa herramienta es excelente, porque me ha sacado de apuros de cosas que he podido entregar en un hora. ¿Te saca esto de la duda?
¿Qué esperas oir?

Iniciado por innes

A ver, en cierto modo os entiendo, pero teneis que comprender, que no se puede ser bueno en todo, o mejor dicho experto en todo, y si yo soy profesional del diseño gráfico por formación y por trayectoria profesional, puedo haberme intentado meter en el mundo del diseño web y medio defenderme pero evidentemente no voy a ser igual que un tipo que ha estudiado informática o teleco y sabe varios lenguajes diferentes, sabe el porqué de las cosas, etc...

¿Y bien? No entiendo qué quieres decir con esta obviedad. Nadie sabe de todo. Supongo que has ido a preguntar donde la gente que sabe de CSS por algo, ¿no? Según tu planteamiento deberías haber preguntado en diseño gráfico, a gente en tu situación. ¿O no querías la opinión de gente que sabe CSS?

Iniciado por innes

A lo que yo voy es que si algun día entro en alguna empresa en calidad de diseñadora web, ya se sabe que hoy en día lo que buscan es un híbrido entre diseñador y programador y me tocaría programar algo, con lo cual, al no ser tan experta como otro, pues lo que se podría hacer en 1 hora por decir algo, a mi seguramente me llevaría 3 y al final no sale rentable sobre todo a la empresa

Estás contemplando la posibiliad de entrar en una empresa en calidad de diseñadora web (que no lo eres), y en lugar de aprovechar y formarte en lo posible en espera de que llegue ese momento, has decidido no hacer nada y confiar en la herramienta que acabas de encontrar. Pero por favor: ¿cuánto tiempo crees que te puede costar aprender a hacer las dos tonterías de colores y demás de las que hablas? Pues mucho menos que aprender a limpiar el código que te genere el programa, y como al programador le mandes una basura de css sólo para hacer dos tonterías, ese sí que sabrá ya que no eres diseñadora web.

Iniciado por innes

es que además me gustaría que lo hubierais probado esto del Photoshop

Vamos, que el ejemplo que te he puesto antes dándole la vuelta hacia tu terreno no te ha hecho reflexionar ni un poquito.

Pues ya está, no sé lo que quieres oir, pero lo que sí está claro es que no quieres oir algo diferente de lo que quieres oir. Relájate y no hagas nada, y si un día te sale ese trabajo, pues ya pensarás qué hacer.

En fin, que tengas suerte.

P.D.: ¿polemica? No, debate, que no es lo mismo.

[McPinkY18]

bueno photohop lo uso para las imagenes y fondos de barras de navegacion y fondos y la verdad escribir html y css es realmente facinante una cosa si q podrias utilizar es un editor texto plano q resalte etiquetas y esas cosas q aun no entiendo pero asi es mejor y tienes control sobre lo que haces

[Calizman]

Ok... Vamos por partes...

Photoshop.. (creo yo, porque como dije antes... no lo tengo! porque uso Ubuntu) si no estoy mal se usa para la edicion y desarrollo de imagenes no? y a mi no hay nada que mas me explote que las herramientas "multi-usos" que ni hacen una cosa bien, ni la otra mal. Entonces no hacen nada bueno y te terminan mareando...

Encontraste una herramienta en Photoshop que te acelera el trabajo? Perfecto! bien por ti! haz una web, subela a un host gratuito y asi nos callas a todos de una sola vez no?

A mi pensar.. creo que no lo usaria... ni aunque lo tuviera, por razones que ya dijo mik... el codigo sucio y los problemas que daria con los exploradores... (que ya a mano son bastantes...) entonces... A mi humilde criterio! YO no lo usaria! pero si quieres hacerlo para ahorrar trabajo y tiempo! adelante!

Contestando al McPinkY18 es bueno usar los editores de texto para aprender CSS, porque es muy sencillo generar codigo con DreamWeaver, pero al final cuando necesites modificar algo, o cuando el validador CSS no te valide tu pagina.. o incluso el HTML Strict no valide.. no sabras ni donde arreglar.. porque no es TU codigo, que al final, considero yo, es el orgullo de todo programador!

Saludos y Suerte

Innes: Espero no te sientas atacada, realmente las opiniones de cada uno son muy diferentes y como te dije... si crees que esa herramienta es buena para hacer tu web, hazlo! al fin de cuentas cada programador usa tecnicas diferentes...

[McPinkY18]

Iniciado por CaLiZzZ

Ok... Vamos por partes...


Contestando al McPinkY18 es bueno usar los editores de texto para aprender CSS, porque es muy sencillo generar codigo con DreamWeaver, pero al final cuando necesites modificar algo, o cuando el validador CSS no te valide tu pagina.. o incluso el HTML Strict no valide.. no sabras ni donde arreglar.. porque no es TU codigo, que al final, considero yo, es el orgullo de todo programador!
[/COLOR]

tio yo no uso dreamweaver si no que uso un programa texto plano pero q resalta las etiquetas html y css los tag y reglas y todo eso pero no es dreamweaver

se llama webuilder2008 ahi estoy aprendiendo yo dije q uso photoshop cs3 para otras cosas como un header imagenes solo eso no para diseñar :D

y mola mas escribir html y css :D Saludos

[Calizman]

Ok... no decia que lo usaras sino que era mi ejemplo! xD

Sigue programando con el editor de texto! al final de cuentas aprenderas mas y tendras mayor control sobre tu codigo!

Saludos!

[SPAWN3000]

Bueno, para comenzar... yo también utilizo photoshop y hace mediano tiempo CSS, así que hago una fusión con CSS.

La función es para maquetar, hacia mucho se integraba en el paquete Adobe Image ready... Aunque desde la versión CS2 se integro al photoshop(Junto con otras).


Soy desarrollador de software, pero no me impide ganar algo extra si también abarco el diseño. No puedes intentar ser bueno en todo(O nunca seras bueno en nada), pero si especializarte en cada herramienta apetecida en el mercado!

Digamos: En photoshop creo toda mi plantilla(Luz, sombras, relieves, reflejos, marcos, logos...) Realmente nos ayuda a plazmar nuestra idea a su máxima expresión sin perder detalle(Por que photoshop es lo máximo... y que nadie me diga lo contrario, por que estuve ciego en otras herramientas y vi la luz al conocer photoshop), luego con la herramienta separo los fragmentos que necesito para luego ser usados por mi maqueta CSS.

1. Si lo haces solo photoshop:
- Puedes aprovechar filtros, efectos, pinceles y todo lo que desees.
- Ganas tiempo cuando deseas algo para mostrar únicamente.
- Tener tu plantilla PSD, te permite hacer cambios de forma rápida a tu diseño.
- Es muy seguro que tu diseño adquiera mejor presentación en solo photoshop.
- ...Pero es lo mas Optimo y practico? mmm, lo dudo!

2. Si lo Trabajas en CSS.
- Puedes crear diseños Liquidos y flexibles.
- Facilita la integración de contenido dinámico(Muy util si tu aplicación no busca ser la de siempre, la misma información, (principalmente util si tambien eres programador, o diseñas para empresas de desarrollo). Lo cual representa mejores ingresos!
- Facilitas la actualización del sitio web.
- Facilitas el cambio de plantillas.
- Puedes disminuir radicalmente el peso de tu página web(Esto es muy importante).
- Puedes estandarizar tu web a diferentes navegadores y monitores.
- Css no vale nada, photoshop... hay unas chichiguas.
- Facilitas la organización dinámica de contenido(Aun mejor si también aplicas Java script).

3. Consejo:
- CSS y Photoshop, son el uno para el otro... "un buen diseñador" no puede prescindir de uno u otro solo por ignorancia... Si te dedicas al diseño no podrás vivir sin ambos una vez que aprendas a utilizarlos.

Aunque en photoshop puedes trabajar con rollover, y rollover remotos, crear links, animaciones naturalmente aunque no de mi agrado(Prefiero flash, es mucho mas sutil que los Gifs), Capas de transparencia, filtros, hasta algo de 3d sin mucha dificultad...

Y te genera una maqueta en Tablas, y basadas en combinación de celdas?... Que tal si intentas cambiar la posición de algunos de tus objetos... desde el conocido Dreamweaber... Lindo cierto? No es lo mismo realmente con CSS, ya que tu siempre tienes el control... (Y todo en un archivo!).

Para mi, definitivamente... Photoshop al diseño y CSS a maquetar webs. Punto!


Un saludo!

[Calizman]

Esperemos que esto responda la duda que tanto se ha discutido por aca!

Gracias por el aporte! yo seguire con mi CSS... xD

Saludos!

[SPAWN3000]

Los pasos ha seguir, un buen diseño:


0. Una buena maquina... 2gb ram, 2.x+Mhz core 2 duo.

1. Visitar otros lugares(Por inspiración.)!

2. Crear el diseño en photoshop(hasta encontrar el modelo que os gusta). Tambien utilizo "Pixie(Nattyware)". para copiar el color hexadecimal de cualquier lugar de la pantalla(Muy util).

3. Crear la maqueta css(nuestro contenedor de imagenes y texto).

3.1 Aplicar alguno modelos CSS para reiniciar, youtube facilita uno bien elaborado... aunque yo utilizo otro de un autor que no recuerdo.

4. Diseccionar la imagen photoshop y exportar para web...

5. Utilizar dreamWeaber(Ganar tiempo) para agregar background a las capas o DIV que lo necesitan, con su respectiva orientación y posición en pixeles(repeat-x, repeat-y, repeat, left, top, width, height).(tambien uso Notepad++ y GVIM un programa de expresiones regulares "Pequeño, multiplataforma, gratis, y lo principal...muy potente. Una joya si se sabe usar. Ya me lo agraderan!")

6. Utilizar 4 navegadores en los cuales probar tu diseño(Preferiblemente portables-Una buena costumbre). Yo utilizo por default mozilla con algunos accesorios como: Web developer(Para probar mis diseños a distintas resoluciones, validar mi codigo con estandares W3C, entre otras), FireBug(No puede faltar un buen analisis estructural ya que todo esta dado por etiquetas en forma de arbol, y validar errores), ScreenGrab(Para enviarles una muestra en jpg a mis clientes de lo que les espera).

7. Para rematar, no esta de mas un Header en Flash(ActionScript en lo posible) retomando tus imágenes principales creadas en photoshop(Aunque es mejor si son vectorizadas en flash)-las imágenes Renderizadas tienden a pezar mucho mas.

Mas dudas?

Un saludo desde Colombia, y claro una feliz navidad en especial a Mikmoro, el real maestro de este foro en CSS!