Como hacer una pagina web en photoshop

Una página Web típica está compuesta por varios elementos, cada uno de ellos en sí es simple de crear. Frecuentemente, estos elementos son creados en programas gráficos separadamente, y luego se unen por primera vez en un programa editor de páginas Web como Dreamweaver o Expression Web.

Sin embargo, si tienes una copia de Adobe Photoshop, puedes diseñar tu página Web directamente en Photoshop, creando cada elemento exactamente donde deseas desde el inicio. Esto también tiene la ventaja adicional de permitirte utilizar muchas funciones de gráficas y herramientas de Photoshop mientras creas tu página.

Pasos para hacer una página Web en Photoshop

Paso 1. Graba imágenes o gráficas que deseas utilizar para tu página Web (por ejemplo un Logo) en el disco duro de tu computadora, ya sea copiándolos desde una cámara u otro medio digital. De manera alternativa, puedes utilizar un escáner para escanear versiones impresas de tus imágenes.

Paso 2. Inicia Photoshop. Selecciona “File” del menú y escoge “New”. En el recuadro de dialogo que aparece, haz clic en “Presets”. De las opciones, escoge “Web”. Luego haz clic en “Size” y de las opciones del menú escoge el tamaño que deseas para tu página, como 1024 x 768 o 800 x 600. Nombra el documento “Tu nombre página web”. Haz clic en “Ok”. Cliquea el botón “New Layer” debajo de la paleta “Layers”.

Paso 3. Selecciona la herramienta “Rectangular Shape” desde la herramienta “Palette”. Dirígete a las opciones de herramientas que aparecen en la parte superior, establece el modo para “Shape Layer” y escoge el color que deseas como background para el banner de tu página Web. Ahora dibuja la forma del banner sobre canvas. Haz clic en “New Layer” otra vez.

Paso 4. Repite el tercer paso para crear las otras formas básicas que necesitas en tu página Web, como botones divisores o de navegación. Utiliza el mismo color que usaste para el background banner para crear un tema de color general para tu página Web.

Paso 5. Selecciona “File” del menú y escoge “Open”. En el diálogo que aparece, ve a la localidad donde grabaste tus imágenes en el Paso 1 y abre la primera imagen que deseas utilizar.

Paso 6. Dirígete hacia la opción “Layers” en el lado izquierdo de la pantalla, sostén el botón “Ctrl” de tu teclado y haz clic en la vista previa de la imagen próxima al layer. Selecciona “Edit” del menú y selecciona “Copy”.

Paso 7. Regresa al documento “Tu nombre página web”. Selecciona “Edit” del menú y escoge “Paste”. Utiliza la herramienta “Move” y la función “Scale” debajo de “Edit” para posicionar la imagen donde deseas colocarla en la página Web.

Paso 8. Repite los pasos del 5 al 7 para importar todas las imágenes que deseas utilizar para tu página Web.

Paso 9. Selecciona la herramienta “Type” de la paleta de herramientas. De las opciones que aparecen escoge el tipo de fuente y el color que deseas para tu banner. Luego escribe el texto sobre el banner. Repite este paso agregando todo el texto que necesitas para los elementos de tu página.

Paso 10. Selecciona la herramienta “Slice” de la paleta de herramientas. Utiliza la herramienta para crear un corte alrededor del banner y todos los botones. Haz clic derecho en cada corte y escoge “Properties”. En el diálogo, nombra cada pieza. Selecciona “File” del menú y escoge “Save”. Photoshop almacenará una carpeta que contiene las imágenes cortadas y un archivo HTML que puedes cargar en tu sitio Web.