Being the owner of a new website, or an existing one needing a bit of work, there are always certain aspects to be considered. Perhaps you would like your viewers to see a very professional looking business page. Or maybe your site caters more to families leaving you wanting to have a family-friendly ‘feel’ to it when they find your page.
The days of hiring someone to do your web or graphic design work are long gone. Remember those days? It was once a natural practice to hire someone, which meant spending money, to get precisely what it was you were looking for. Even then, there were still no guarantees. There are now many different programs available, permitting you to totally revamp your current website, or even helps you create a great first site. Of all the choices, we have found Photoshop to be the easiest to work with.
When you use Photoshop, you can easily have a finished product in your own style in no time at all. You’ll be doing the work yourself, using your own computer and on your own time you’ll be saving money from the get go. While choosing this method of creation for all your header needs, with your personal style and feel to them, you will simply have to add them to your site codes once you’re done. Let’s not get too far ahead of ourselves though.
Your first step is to open your Photoshop software and create a new image. You can either set the size of your image by choosing the pixels at1025 x 150 (or the size you wish your website to be) or by using the image-size tools available to you so you can set the dimensions properly to fit the size you wish to work with.
Selecting the image outline or header, select the tool resembling a rounded rectangle. Drag this pointer to the corner of the image found at the top left side. Now left click to draw a rectangle crossing from the left to right side of your image. This will show you the outline of your header section.
Continue by selecting “Layer” from the navigation tool bar, which you can find at the top of the window you are working in. Your next option is to choose the “Layer Style”, followed by “Add Drop Shadow” from the various options. You will now see a new pop-up window with the option “Drop Shadow, Inner Glow and Outer Glow.” Be sure to check the box in front of this option.
The next option you want to choose is the “bevel” option. This option will result in the rectangle now having a professional style with depth, which is added by the shadow you have chosen. Click on the “Layer” icon to add a new layer to your header.
We’re going to open the text tool now, dragging it to the top left corner of your image. Type here either the name of your website or company name. Have fun playing around with different font types, sizes and colors until you find what really suits your ideas. There are also other text option tools on the navigation bar at the top of the present window.
Now we are going to add a bit more style to your header. Start by selecting the rectangle tool, left-clicking in the top right-hand corner. By dragging the pointer along the top of the header, you will be creating a smaller navigation bar at the top of the image.
You can now click the “Direct Selection” tool, and by left-clicking on it you can select the rectangle. You will now see small squares appear in each corner. By clicking the lower left corner and dragging it toward the right, you will create an angled edge for this new navigation bar.
If you wish to add color or effects to this upper navigation bar, you would be choosing the “Fill” tool and making your choices from the options there. You can also crop and/or cut your image to any exact size you may need with the “Crop” tool.
Since you have put all this hard work and effort into this project, you don’t want to lose it. Click “File” then “Save for Web and Devices” to save this image. You might want to consider creating a folder for all your business website information so you can keep everything together. Once you have saved this new header, you need to upload it to the “Images” file of your website codes.
To add the new header to your web pages, you will be using it as a background image. It will be located in the first row of the first table of your website, right under where you see the head tag.
Now you know just how easy it is to create your own website headers for free. Depending on the nature or purpose of your website, you may decide to change things up more often. How about for each season? Or the other pages of your site? It’s no longer a question of money, but of imagination.
No comments:
Post a Comment