Cómo Dividir Un Sitio

Tabla de contenido:

Cómo Dividir Un Sitio
Cómo Dividir Un Sitio

Video: Cómo Dividir Un Sitio

Video: Cómo Dividir Un Sitio
Video: ¿Cómo dividir un sitio web? 📰 | Etiquetas de sección html 📦 2024, Mayo
Anonim

La creación de su propio sitio web siempre comienza con el desarrollo de un boceto y un diseño futuro, y una parte integral de este desarrollo es la visualización del diseño del sitio en Photoshop y el corte del diseño terminado en bloques para su posterior diseño. La capacidad de cortar correctamente una imagen del diseño del sitio afecta directamente el éxito posterior del diseño y la ubicación correcta de los archivos gráficos en el servidor.

Cómo dividir un sitio
Cómo dividir un sitio

Instrucciones

Paso 1

Abra el diseño de diseño creado en Photoshop, que es una imagen sólida de la resolución deseada. En la barra de herramientas de Photoshop, seleccione la herramienta Cortar. Desactive temporalmente la visibilidad de todas las capas de texto, campos de entrada, iconos y elementos similares.

Paso 2

Dibuja con la herramienta elegida las líneas guía a lo largo de las cuales cortarás el sitio; estas líneas en la imagen serán verdes. Divida cuidadosamente el diseño de una pieza en elementos estructurales del tamaño y la cantidad deseados.

Paso 3

Piense en cómo va a cortar la imagen; no debería haber demasiados elementos individuales en ella. Para crear líneas de guía, coloque el cursor en la regla superior sobre la imagen, haga clic con el botón izquierdo y arrastre hacia abajo la guía. Suelta el botón del ratón.

Paso 4

Después de que todas las guías estén configuradas (tanto verticales como horizontales), proceda a cortar el diseño.

Paso 5

Con la herramienta de corte seleccionada anteriormente, corte el diseño haciendo clic con el botón izquierdo en el comienzo de cada guía y estirando el campo que aparece al tamaño del objeto deseado que desea cortar. Suelte el botón izquierdo del mouse para que aparezca un número de serie en la esquina izquierda del fragmento cortado.

Paso 6

Ajuste los bordes de los fragmentos estirándolos manualmente. Para guardar las partes cortadas de la imagen general, haga clic en la opción "Guardar para páginas web" en el menú Archivo y seleccione el formato JPEG. En la ventana de guardar, seleccione "Todos los fragmentos".

Paso 7

Después de guardar los fragmentos de imágenes recortadas por separado, guarde todos los elementos visuales del diseño de la página: bloques de texto, botones, líneas, etc.

Recomendado: