Atom Feed (xml)
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.
Long gone are the days when web or graphic design work meant hiring someone to do all of your website work for you. This undoubtedly meant spending money to get exactly what you wanted. But even then, there was no guarantee how that was going to turn out. With so many programs now, you can have full reign to completely redesign the website you already use, as well as creating that stunning first website. One of the easiest programs we have found to work with yet is Photoshop.
With Photoshop, you can easily find yourself with a finished product in the style you really want in no time. By doing the work by yourself from your own office, on your own computer you are already saving money and we haven't even started yet! By choosing to use this method of header creation, with the look and feel you want, you'll only have to add it to your site codes. But let's not get ahead of ourselves.
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.
Select the image outline or header, followed by selecting the tool resembling a rounded rectangle. Drag the pointer to the top left side corner of the image. Next left click to draw a rectangle which will cross from left to right of your image. This shows you the outline of your header section.
Continue now by selecting "Layer" from the navigation tool bar, found at the top of the window you are working in. Your next option to choose is the "Layer Style", followed by "Add Drop Shadow" from amongst the various options. You will now find a new pop-up window with the option "Drop Shadow, Inner Glow and Outer Glow." Check the box in front of this option.
Next, you want choose the "bevel" option. This will result in the rectangle having a professional style with depth, added by your chosen shadow. Clicking on the "Layer" icon will add a new layer to your header.
Now, open the text tool, while dragging it to the top left corner of the image. This is where you will type the name of your company or website. Take the time to play with different font types, sizes and colors to find the one that really "pops". On the top of the image, in the navigation bar you can find various other text option tools.
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.
Now click the "Direct Selection" tool, selecting the rectangle by left-clicking on it. This will result in small squares appearing at each corner. Click the lower left corner of this shape, dragging it toward the right side and creating an angled edge for this 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.
In order to add this new header to your web pages, you need to use it as a background image. You will be placing it in the first row of your first table of the website, right under where you see the head tag.
When all is said and done, you will see just how easy it is to not only create your own website headers, but how to do it for free. Depending on the nature of your website, you may decide to change things up for each season. Or maybe create different headers for other pages of your website. Why not? You can, and for free to boot!
Long gone are the days when web or graphic design work meant hiring someone to do all of your website work for you. This undoubtedly meant spending money to get exactly what you wanted. But even then, there was no guarantee how that was going to turn out. With so many programs now, you can have full reign to completely redesign the website you already use, as well as creating that stunning first website. One of the easiest programs we have found to work with yet is Photoshop.
With Photoshop, you can easily find yourself with a finished product in the style you really want in no time. By doing the work by yourself from your own office, on your own computer you are already saving money and we haven't even started yet! By choosing to use this method of header creation, with the look and feel you want, you'll only have to add it to your site codes. But let's not get ahead of ourselves.
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.
Select the image outline or header, followed by selecting the tool resembling a rounded rectangle. Drag the pointer to the top left side corner of the image. Next left click to draw a rectangle which will cross from left to right of your image. This shows you the outline of your header section.
Continue now by selecting "Layer" from the navigation tool bar, found at the top of the window you are working in. Your next option to choose is the "Layer Style", followed by "Add Drop Shadow" from amongst the various options. You will now find a new pop-up window with the option "Drop Shadow, Inner Glow and Outer Glow." Check the box in front of this option.
Next, you want choose the "bevel" option. This will result in the rectangle having a professional style with depth, added by your chosen shadow. Clicking on the "Layer" icon will add a new layer to your header.
Now, open the text tool, while dragging it to the top left corner of the image. This is where you will type the name of your company or website. Take the time to play with different font types, sizes and colors to find the one that really "pops". On the top of the image, in the navigation bar you can find various other text option tools.
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.
Now click the "Direct Selection" tool, selecting the rectangle by left-clicking on it. This will result in small squares appearing at each corner. Click the lower left corner of this shape, dragging it toward the right side and creating an angled edge for this 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.
In order to add this new header to your web pages, you need to use it as a background image. You will be placing it in the first row of your first table of the website, right under where you see the head tag.
When all is said and done, you will see just how easy it is to not only create your own website headers, but how to do it for free. Depending on the nature of your website, you may decide to change things up for each season. Or maybe create different headers for other pages of your website. Why not? You can, and for free to boot!
About the Author:
You can get free access to customizable web page headers and you'll also receive tons of private label & resell rights products, training and more at PLRWholesaler.com.
No comments:
Post a Comment