¿Cuáles son los mejores consejos para la conversión de HTML a PSD?

Muchos diseñadores de sitios web utilizaron Adobe® Photoshop® para crear maquetas rápidas de un sitio web antes de enviar el diseño a un archivo de lenguaje de marcado de hipertexto (HTML), y hay muchos programas que pueden convertir un documento de Photoshop® (PSD) en un documento HTML, pero hay muy pocas utilidades que conviertan HTML a PSD. Un consejo importante al realizar la conversión es asegurarse de que cualquier contenido dinámico, como subprogramas, animaciones o contenido multimedia, tenga una pantalla estática o se haya convertido en una imagen de marcador de posición para que se convierta correctamente. Hay algunos trucos que se pueden usar para convertir HTML a PSD, como usar la función de impresión a archivo en la mayoría de los navegadores web para crear un archivo de formato de documento portátil (PDF) que luego se puede abrir en Photoshop®. Independientemente del método que se utilice para convertir HTML a PSD, la página resultante finalmente requerirá algunas modificaciones, como aislar y mover elementos de una página a diferentes capas o afinar el texto de la página para eliminar el alias que ocurre naturalmente durante la conversión. ser aceptable.

Los documentos PSD de Photoshop® contienen de forma innata imágenes rasterizadas, por lo que en su mayoría se almacenan como una colección de píxeles. HTML es un lenguaje diseñado para proporcionar instrucciones de formato y diseño que se acercan más a los gráficos basados ​​en vectores como los que utiliza Adobe® Illustrator®. La conversión de HTML a PSD implica encontrar una forma de convertir los píxeles que se procesaron en el navegador web a un formato de archivo de imagen que Photoshop® pueda leer.

Hay dos formas sencillas de convertir HTML a PSD de forma eficaz. La primera es usar un programa de captura de pantalla, capturando cada segmento visible del sitio web y luego uniéndolos dentro de Photoshop®. Esto tiene la ventaja de capturar con precisión lo que se ve en la pantalla, por lo que las animaciones y otros contenidos dinámicos no tienen que eliminarse, pero tiene el inconveniente de ser un proceso bastante complicado. Además, las capturas de pantalla de un sitio web tendrán una resolución de píxeles establecida y la imagen puede aparecer de manera diferente en monitores separados, porque no hay corrección de color.

Una segunda forma de convertir HTML a PSD es utilizar el comando de impresión integrado que implementan la mayoría de los navegadores web. Esto creará un archivo, a veces una imagen, a veces un PDF, que Photoshop® podrá abrir y editar. Al utilizar este método, es posible que el contenido dinámico, los subprogramas, las animaciones y las imágenes generadas a través de secuencias de comandos no se impriman correctamente, y los formatos o marcos complejos en un documento pueden aparecer como áreas desconectadas dentro del documento PSD. Reemplazar el contenido dinámico con imágenes de marcador de posición del mismo tamaño o escala puede solucionar algunos de estos problemas, aunque el formato complejo con hojas de estilo en cascada (CSS) y marcos aún puede causar problemas.

Cuando se utiliza un programa de gráficos de trama como Photoshop®, será necesario realizar algunos trabajos de edición en la imagen resultante de una conversión de HTML a PSD. El texto generalmente se vuelve muy alias y, a veces, hay artefactos visuales como bordes pequeños y tenues alrededor de los elementos o gráficos pequeños que se desvanecen debido a la escala. Para un sitio web muy complejo con múltiples elementos, el uso de otros programas, como Adobe® Illustrator o Adobe® InDesign®, podría ser una mejor opción y podría ahorrar tiempo.