Tecnología

Inicio

Cómo cortar un PSD a HTML en CS4

Cómo cortar un PSD a HTML en CS4


Codificación de un archivo de sitio Web o Web puede ser una tarea difícil para los diseñadores, pero usando Adobe Photoshop CS4 para crear archivos Web es una opción que muchos diseñadores pasan por alto. Una Adobe Photoshop o un archivo PSD pueden ser fácilmente cortados en un documento HTML por aquellos que están familiarizados con el programa. Esto permite a los diseñadores a utilizar el software robusto diseño de Photoshop para crear hermoso, pero adecuadamente codificada, archivos Web con facilidad.

Instrucciones

1 Abra el documento que desea cortar en Photoshop CS4.

2 Seleccione la herramienta de corte de la barra de herramientas. La herramienta de corte está en el mismo grupo que la opción de los cultivos. Si está oculto, haga clic y mantenga pulsada la herramienta de recorte para revelar la opción.

3 Elija un ajuste de estilo de la barra de opciones. Tiene tres opciones: tamaño fijo, donde el tamaño de la rebanada son fijados por números enteros; proporción fija aspecto, donde está predeterminado relación entre altura y anchura, y normal, donde las proporciones del sector se determinan a medida que arrastra el cursor para hacer sus rebanadas.

4 Haga clic y arrastre el cursor sobre las secciones como usted desea cortarlas en rodajas.

5 Seleccione Archivo y "Guardar para Web" y en la ventana guardar seleccionar "HTML y las imágenes" para la opción de salida de archivo para crear un archivo HTML de su documento una vez que haya terminado de hacer todas sus secciones. Si realiza cambios en el documento, tendrá que volver a guardarlo de esta manera y sustituir por completo cualquier archivo HTML anterior y las imágenes relacionadas.

Consejos y advertencias

  • Cortar sus secciones por el contenido que aparece en el documento. Por ejemplo, si tiene un documento de Photoshop con texto e imágenes, cortar el texto y las imágenes por separado y, en las descripciones alt para cada rebanada, añadir una breve descripción de su contenido.
  • Asimismo, recuerda a cortar secciones de acuerdo a los enlaces que tendrán en su documento final.
  • Para los documentos de Photoshop con capas transparentes, asegúrese de que su opción de salida de imagen es GIF o PNG.