Graphics and Templates

Creating a Website Banner Using Photoshop

Posted on: May 10, 2011

Photoshop is mostly considered useful as a photo editor but a lot of people don’t know that it is far more versatile and multi-purpose than their expectations as you can also create a website banner using Photoshop. This sounds great…… here I will give you some simple steps that will help you a lot in creating a website banner in Photoshop:

  • Start Photoshop and open a new file by choosing File>New from menu. You will see that menu at the top of your computer screen.
  • Next, you will set dimensions of graphic. An option box will open in which you will name the graphic. After that, select pixels from the drop-down menu by Width box. You will then set width and height according to size which you desire. As a starting point, you can set width at 780 pixels and height at 120 pixels but you can adjust these measurements according to your own choice.
  • Now you will add a new layer by selecting Layer>New from the menu appearing at the top of your screen. After this, name the layer. A box will open in which you will type the name of layer such as ‘background’. Now click “OK”.
  • Select background color. You will do it by selecting ‘Color Picker’ tool in ‘Tool Panel’. Use the mouse to select the color for backdrop (background) and then you can close ‘Color picker’ tool. From the ‘Tool Panel’, select ‘Paint Bucket’ tool and then click ‘Paint Bucket’ tool on image that you have created.
  • Next step is to create additional layers. In order to add another layer and another color, you will require selecting ‘Marquee’ tool from ‘Tool Panel’ and then draw shape of layer on the image. Then you will press right-click button and select ‘New Layer’. To add color, again use ‘Color Picker’ and ‘Paint Bucket’ tool as I have mentioned earlier.
  • Last step will be to add text. From tool panel, select the ‘Horizontal Type’ tool. Now click on the image where text will begin. Now you will select font size, style and alignment for which you will use menu options on top of screen. After this, you will type your desired text.

Follow these steps to create a website banner using Photoshop. Hopefully these steps will help you a lot.


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

About Me

Hi, My name is Tania Yellob and I love to write. This is my blog and I love to hear from you regarding my writings. Recently, I have started creating contents and templates for a famous website BuraqPrintables. Please visit it and let me know hows my work and any improvements I can do?


%d bloggers like this: