Foros del Web » Creando para Internet » HTML »

Error al pasar PSD a HTML

Estas en el tema de Error al pasar PSD a HTML en el foro de HTML en Foros del Web. Hola, me estoy volviendo loco con un fallo que me da la página. La he hecho en Photoshop y desde ahí la he pasado a ...
  #1 (permalink)  
Antiguo 05/04/2012, 12:27
Avatar de OTTO_LOTO  
Fecha de Ingreso: octubre-2009
Mensajes: 81
Antigüedad: 14 años, 4 meses
Puntos: 1
Error al pasar PSD a HTML

Hola,

me estoy volviendo loco con un fallo que me da la página. La he hecho en Photoshop y desde ahí la he pasado a html. Bien, a mí en mi ordenador no me sale el fallo, pero a otras personas, desde su ordenador, les salen como rayas vacías entre las uniones de cada fragmento de imagen...

No sé por dónde coger este error, ya que en algunos ordenadores se ve perfectamente y en otro no.

Os pongo el enlace de la página para ver si os sale a vosotros así y me podáis dar alguna solución.

http://pruebasweb2.comlu.com/
  #2 (permalink)  
Antiguo 05/04/2012, 12:58
Avatar de marioStudios
Colaborador
 
Fecha de Ingreso: octubre-2005
Ubicación: Chiapas; México.
Mensajes: 1.626
Antigüedad: 18 años, 4 meses
Puntos: 212
Respuesta: Error al pasar PSD a HTML

Mira, yo lo vi en mi IE9 y Firefox, resolución de pantalla 1400x900, se ve bien.

Eso de que n se vea bien en todos lados es por que no todos los exploradores tienen el mismo estandar, incluyendo los tipos de pantalla, pero en la internet hay mucha información de comoo corregir eso, usando varios contenedores de estilos CSS, y scripts para ello, suerte!!!
__________________
Diseño Gráfico Digital - Fotomontajes - marioStudios
Debes Mat 6:33 con Heb 11:1, DLB. Luc 2:14!!!
  #3 (permalink)  
Antiguo 05/04/2012, 13:13
Avatar de OTTO_LOTO  
Fecha de Ingreso: octubre-2009
Mensajes: 81
Antigüedad: 14 años, 4 meses
Puntos: 1
Respuesta: Error al pasar PSD a HTML

Cita:
Iniciado por marioStudios Ver Mensaje
Mira, yo lo vi en mi IE9 y Firefox, resolución de pantalla 1400x900, se ve bien.

Eso de que n se vea bien en todos lados es por que no todos los exploradores tienen el mismo estandar, incluyendo los tipos de pantalla, pero en la internet hay mucha información de comoo corregir eso, usando varios contenedores de estilos CSS, y scripts para ello, suerte!!!
Pero es que no sé cómo buscar el error, ya que en algunos sale bien y en otros no. Donde más problemas salen es concretamente en esta página:

http://pruebasweb2.comlu.com/sala-recien-nacidos.html

y yo en 4 ordenadores de mi casa la veo bien, pero las clientas para quien es la web las ven las dos así, y una está en barcelona y la otra en Sevilla.. y no sé por dónde coger el error, ya busqué en Internet, pero no sé cómo buscar ese error y no me salió nada... he recurrido aquí como último recurso
  #4 (permalink)  
Antiguo 05/04/2012, 14:29
Avatar de marioStudios
Colaborador
 
Fecha de Ingreso: octubre-2005
Ubicación: Chiapas; México.
Mensajes: 1.626
Antigüedad: 18 años, 4 meses
Puntos: 212
Respuesta: Error al pasar PSD a HTML

Es verdad salen lineas violeta en IE9 en Firefox esta bien.
¿Como puedas resolver tu problema?, talvez estas usando pixeles en vez de porcentajes, checa por ahi, tambien a veces es bueno usar la opción relative, has una Hoja de Estilo para cuando se detecte que el usuario esta usando IE9 y otra cuando esten usando Firefox.
__________________
Diseño Gráfico Digital - Fotomontajes - marioStudios
Debes Mat 6:33 con Heb 11:1, DLB. Luc 2:14!!!

Última edición por marioStudios; 05/04/2012 a las 14:33 Razón: información
  #5 (permalink)  
Antiguo 06/04/2012, 11:53
Avatar de Carlangueitor
Moderador ლ(ಠ益ಠლ)
 
Fecha de Ingreso: marzo-2008
Ubicación: México
Mensajes: 10.037
Antigüedad: 16 años
Puntos: 1329
Respuesta: Error al pasar PSD a HTML

El problema es que estás exportando directamente desde el Photoshop a HTML, y eso no genera un buen código. Si quieres tener más control tendrás que hacerlo a amano y corregir los errores.


Saludos
__________________
Grupo Telegram Docker en Español
  #6 (permalink)  
Antiguo 07/04/2012, 09:49
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 9.028
Antigüedad: 21 años
Puntos: 1826
Respuesta: Error al pasar PSD a HTML

En realidad el código se vé que está hecho a mano, pero trae errores. Por ejemplo estás usando Html sin doctype y usando elementos obsoletos como center, además de tener cosas fuera de la etiqueta </body> y </html>.

Lo muevo a Html para que te ayuden a limpiar el código.
  #7 (permalink)  
Antiguo 07/04/2012, 11:16
Avatar de pitufoweb  
Fecha de Ingreso: enero-2008
Ubicación: Un Mundo Raro
Mensajes: 1.148
Antigüedad: 16 años, 2 meses
Puntos: 181
Respuesta: Error al pasar PSD a HTML

Cita:
Iniciado por Rafael Ver Mensaje
En realidad el código se vé que está hecho a mano
No @Rafael, ese código no fue hecho a mano. El código fue exportado desde Photoshop como lo dice @Carlangueitor. El problema con eso es que crea mucho código basura, incompatible con los navegadores, es mas difícil hacer modificaciones, la pagina es mas pesada y tarda mas en renderizar los elementos, etc.

Se puede corregir un poco ese código para que funcione con la mayoría de navegadores, pero...

Lo correcto seria:

No exportes el código directamente desde Photoshop.
No uses tablas cuando no son necesarias.
Crea el código a mano
Usa código limpio y semántico

Por ultimo, prueba la pagina en la mayor cantidad de navegadores.



Saludos.
__________________
------------- " La felicidad no llega de afuera, nace desde dentro. " -------------
  #8 (permalink)  
Antiguo 07/04/2012, 11:56
Avatar de Carlangueitor
Moderador ლ(ಠ益ಠლ)
 
Fecha de Ingreso: marzo-2008
Ubicación: México
Mensajes: 10.037
Antigüedad: 16 años
Puntos: 1329
Respuesta: Error al pasar PSD a HTML

Efectivamente, solo hay que mirar los comentarios:

Código HTML:
Ver original
  1. <!-- Save for Web Styles (pagina.psd) -->
  2. <!-- Save for Web Slices (pagina.psd) -->

Saludos
__________________
Grupo Telegram Docker en Español
  #9 (permalink)  
Antiguo 07/04/2012, 18:10
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 9.028
Antigüedad: 21 años
Puntos: 1826
Respuesta: Error al pasar PSD a HTML

Mmm. qué código tan raro.

No está usando tablas sino divs con posicionamiento absoluto... ese es un concepto de "capas" que después de las tablas-tablas (table) se me hace un tanto nefasto, pero en fin. (Aunque está mejor que los que generaba antes con slices y los que genera el dreamweaver)

Otto:
1) Complétale un doctype específico.
2) Sé más especifico en que navegador se ve mal.
3) Completa quizá paddings y borders a 0.
  #10 (permalink)  
Antiguo 07/04/2012, 18:14
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 9.028
Antigüedad: 21 años
Puntos: 1826
Respuesta: Error al pasar PSD a HTML

Oh... me retracto. El código de algunas páginas interiores sí está muy feo...

Otto. Si es un proyecto en forma, hay que ir aprendiendo a ensamblarlo con html y css.
  #11 (permalink)  
Antiguo 11/04/2012, 10:56
Avatar de Dhanielson  
Fecha de Ingreso: febrero-2010
Mensajes: 97
Antigüedad: 14 años, 1 mes
Puntos: 5
Respuesta: Error al pasar PSD a HTML

Hola! Yo tambien hago lo mismo hago mi diseño en psd despues lo exporto a html. El tema esta en las opciones de exportacion a web&devices no se si estas utilizando generar un archivo css aparte que es lo mejor. Otra cosa lo primordial es el corte del sitio con el slice tool debes hacerlo bien en youtube hay tutoriales de como hacerlo de manera correcta para que no te surjan problemas con otros browsers... Por ultimo creo que el mejor consejo es aprender a ensamblarlo con html y css como dice Rafael para ir corrigiendo los errores y borrar capas inecesarias que tienes
  #12 (permalink)  
Antiguo 13/04/2012, 11:18
 
Fecha de Ingreso: abril-2012
Ubicación: California, USA
Mensajes: 5
Antigüedad: 11 años, 11 meses
Puntos: 2
Respuesta: Error al pasar PSD a HTML

Hola, yo hago mis diseños en photoshop y los importo a Enerwings, sólo basta con crear el layout previamente y los sitios se ven bien. Por ejemplo: [URL="http://www.fruttalisty.enerwings.com"]fruttalisty.enerwings.com[/URL]

Este es un proyecto en el cuál estaba trabajando.

Última edición por henryrow; 13/04/2012 a las 11:18 Razón: Añadir enlace
  #13 (permalink)  
Antiguo 13/04/2012, 11:22
Avatar de Carlangueitor
Moderador ლ(ಠ益ಠლ)
 
Fecha de Ingreso: marzo-2008
Ubicación: México
Mensajes: 10.037
Antigüedad: 16 años
Puntos: 1329
Respuesta: Error al pasar PSD a HTML

Claro y todo maquetado con tablas, así tan 90's
__________________
Grupo Telegram Docker en Español
  #14 (permalink)  
Antiguo 19/04/2012, 14:49
 
Fecha de Ingreso: diciembre-2003
Mensajes: 310
Antigüedad: 20 años, 3 meses
Puntos: 4
Respuesta: Error al pasar PSD a HTML

OTTO
Lo que te pasa es lo que le pasa a muchos cuando quieren convertir un PSD en HTML: lo hacen desde Photoshop.
Grave error!

La conversion de PSD a HTML, o maquetacion web, es una actividad muy importante a la que hay que dedicarle un buen rato.
De hecho, hay gente que se dedica exclusivamente a la maquetacion en HTML y CSS. (como yo, entre otras cosas)

Como bien te han dicho aqui, no debes "maquetar" exportando con Photoshop, sino que deber armarlo de la forma tradicional esribiendo codigo y armando la estructura con XHTML y luego estilizando con CSS, o CSS3.

Mirando rapidamente el codigo de tu sitio, veo un par de errores o cosas a corregir como por ejemplo la declaracion de DOCTYPE (directamente ni la has puesto)

Pasa por mi blog, alli hay mucho material de como convertir PSD a HTML y maquetar con XHTML y CSS tal cual se hace de forma profesional.

Saludos!
Cristian

Etiquetas: photoshop, psd
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 05:42.