“Conocimientos software>Photoshop

Cómo crear una plantilla web en Photoshop

2012/2/26
Una plantilla web es una página básica Diseño Web --- o --- contenedor puede volver a utilizar para crear varias páginas. La plantilla proporciona la estructura básica para su sitio web , que le permite mantener un tema recurrente y el diseño a través del sitio sin tener que volver a crear cada página. Mientras que Photoshop no es técnicamente un programa de diseño de páginas Web , se puede usar para crear plantillas web por " cortar " la imagen PSD en varias secciones y luego exportar el PSD a una página Web HTML. A continuación, puede abrir el archivo de plantilla HTML en Dreamweaver o cualquier otro programa de diseño Web y utilizarlo para crear las páginas de su sitio web . Cosas que necesitará hotel Adobe Photoshop CS3 o posterior

Mostrar más instrucciones
1

Iniciar un nuevo documento en Photoshop. Déle las dimensiones que desee utilizar para las páginas Web , así: Haga clic en " Archivo" en la barra de menú y seleccione " Nuevo" para abrir el cuadro de diálogo Nuevo . Escriba el ancho (en píxeles ) en el campo "Ancho " y la altura ( en píxeles ) en el campo "Altura " . Haga clic en " Aceptar".
2

Cree la bandera para su página Web. La bandera, por supuesto, es la imagen gráfica o la que muestra en la parte superior de la página. Por lo general, consiste en un logotipo de la empresa y algunos otros gráficos relacionados con un producto o servicio . Puede insertar una imagen existente o utilizar pintura de Photoshop y herramientas de texto para crear el banner.
3

Crear los botones para tu página Web. Estos se convertirán en enlaces, o "puntos calientes" que tienen los usuarios de la web a las distintas páginas dentro del sitio. Cualquiera de insertar imágenes de los botones existentes y colocarlos donde quieras en la plantilla , o el uso de pintura de Photoshop y herramientas de texto para crear los botones.
4

Seleccione la herramienta " Slice" ( quinto botón de la parte superior de la caja de herramientas ) . Si no ha utilizado la herramienta Slice antes, este botón es probablemente ajustado a otra herramienta. Haga clic y mantenga pulsado el botón , y luego elegir la opción " Slice Tool " en el desplegable.
5

Arrastre la herramienta Sector en todo el primer botón o área en la plantilla en la que desea crear un vínculo. Esto crea un cuadro de " Slice" alrededor del objeto. Photoshop coloca esta caja en una celda de la tabla que se convertirá en una tabla HTML independiente al exportar el documento a HTML .
6

Haga clic en el nuevo segmento y seleccione " Editar opciones Slice " de la mosca - menú fuera . Se abrirá el cuadro de diálogo Opciones de sector .
7

Escriba la dirección URL que desee en este botón para vincular en el campo " URL" . También puede introducir otra información para el botón, como la página de navegador de destino , y las etiquetas alternativas. Si desea modificar el tamaño y la posición de la corte, lo hacen con las opciones disponibles en la sección " Dimensiones " del cuadro de diálogo . Haga clic en " Aceptar".
8

Repita los pasos anteriores para crear segmentos y editar las opciones de sector para cada botón en la plantilla.
9

Haga clic en " Archivo" en el menú bar y elegir la opción " Guardar para Web y dispositivos . " Esto abre el cuadro de diálogo Guardar para Web y dispositivos. Desde aquí se puede cambiar varios aspectos de su plantilla, como el color de fondo , la compresión y calidad de imagen , tamaño del documento , etc . Estas opciones están bien etiquetados y hablan por sí mismos. ( Usted puede ver el código HTML de esta plantilla , haga clic en el botón "Vista previa " . )
10

clic en el botón " Guardar" . Nombre y guarde el archivo HTML. Ha creado la plantilla Web. Ahora puede abrirlo en un editor de páginas Web y añadir su contenido.

Photoshop
Cómo utilizar Adobe Photoshop Elements
Cómo hacer Cultivos elípticas en Photoshop
Cómo arreglar borrosas fotos con Adobe Photoshop CS2
Cómo crear Adobe Photoshop Elements Gráficos
Cómo colorear Anime Eyes en PhotoShop
Cómo hacer una llamada en Photoshop
Cómo dibujar flores en Photoshop
Cómo Comprar Photoshop CS2
Conocimientos Informáticos © http://www.ordenador.online