How to Create a Header or Banner in Minutes – Easy Photoshop Lesson

November 20, 2008

Here is an easy instructional article regarding the steps in making a website logo and banner using Photoshop.

A header or banner can be seen at the topmost portion of a website. Most of the time, this contains the logo and name of the company it represents. A banner or header is important because it gives an initial impression on the company or a person that the website represents.

The color mixture should immediately catch the attention of people, it should be compelling, easy to use and has the capability to make the readers stay and visit your website again.

The color of the banner should be easy and cool on the eyes. The design should also match the nature of the website.

Here are the ways by which you can make a banner:

1. Making the size of your banner.

Make an original file by pressing on “File” then click “Open”. Maintain the size of the file as 780px in width and 120px in height. You can also try 140px in height. A banner can be adaptable based on its design.

Open a new file by clicking on File>Open. Make the file size width of 780px and height of 120px. You can go till 140px for the height. You can make a banner flexible according to your design.

2. Setting the color of the background.

Make an original layer. Coin it as “bgcolor”. Now the color of the background can be done by doing these steps.

• Revise the color of the foreground to #E4D1B8.
• Press on the Tool, “Paint Bucket” which can be clicked on the panels for tools at the right side.
• Using your mouse press on the canvas. The color of the background now has another color.

3. Setting the inside color of the background

Make a fresh layer. Give it a filename “insidecolor”. Click on “Rectangular Marquee Tool” which can be viewed on the right side of the panel for tools. Set the width of the rectangle at 760px and make the height of the background from the inside at 100px. Paint it with hue number C64866 utilizing the tool for paint bucket.

4. Making the logo of the background.

Set a fresh layer. Give it the filename, “logobkg”. Click on the tool, “Rectangular Marquee”. Set the width of the rectangle at 120px and 100px in height. Place the rectangle on banner’s leftmost part. Paint it with black hue #000000.

5. Making a logo through the tool custom shape

Make a fresh layer. Give it a filename, “logo”. Pick the tool, “custom shape” which is located on the right side of the panel. Press on the menu, “Shape drop down” located above the toolbar. Press on arrow and choose “Ornaments”. Find the ornament inside the banner. Move it the space for the logo and place it at the center of the background logo. This momentary ornament logo is interchangeable with the logo of the company.

6. Making the banner’s vertical lines

Make a fresh layer. Give it a filename “band”. Choose tool, Rectangular Marquee”. Set rectangle width at 7px and 120px height. Place the rectangle at the banner’s center. Paint it with hue #E8BOBD. Create four layer copies by right clicking the layer and press “duplicate”.
Input the layer “band copy”. Press “OK”. Repeat for band copy 3 up to 4. Place them on the banner.

7. Making the Border of the Logo

Make a fresh layer. Filename it “border”. Choose tool, “Rectangular Marquee”. Set rectangle width at 20px with 100px height. Paint it with #A63D56. Place it at the right of the background. Duplicate and place it on the left of the logo.

8. Dashed Lines

Click tool, “Horizontal Type” and set it on top. Duplicate and put it at the bottom.

9. Company Name

Using text tool, input name of company using hue #FCF3E5.

Written by admin · Filed Under Photoshop Lessons