|
Portfolio Website Template |
|
We'll begin this tutorial by creating a new canvas with a size of 850 x 750 pixels. Color does not matter at this point.
Next, download the background pattern found here.
|
|
|
Now right click on the background layer and select, "Blending Options...". Now click on "Color Overlay". |
| |
use settings at left |
Do not click "OK" yet. Still more to do. |
|
|
|
|
Now click on "Pattern Overlay". |
| |
use settings at left |
You may now click OK. |
|
|
You should now have the below image. |
|
|
Now, select the "Rectangle Tool" and draw the following shape using 362609 as the color. |
|
|
|
|
Now right click on the new layer and select, "Blending Options...". Now click on "Drop Shadow". |
| |
use settings at left |
Do not click "OK" yet. Still more to do. |
|
|
|
|
Now click on "Bevel and Emboss". |
| |
use settings at left |
You may now click OK. |
|
|
You should now have the below image. |
|
|
Now duplicate the layer and clear the layer style by right clicking on the layer in the Layers Palette and selecting "Clear Layer Style". Then turn the Fill down to 0%.
|
|
|
|
|
Now right click on the new layer and select, "Blending Options...". Now click on "Stroke". |
| |
use settings at left |
You may now click OK. |
|
|
You should now have the below image. |
|
|
Select the "Text Tool" and use the below settings: |
Name left color settings |
Name right color settings |
 |
|
|
Now type your website name. To change the color of a particular letter or word in this case, simply highlight the letter/word and change color. |
|
|
|
|
Next, select the "Pen Tool" and draw the below tab that sits above the head of the layout. Use e9e3c9 as the color. Place this layer beneath all other layers except the background layer in the Layers Palette.
|
|
|
|
|
Now right click on the tab layer and select, "Blending Options...". Now click on "Drop Shadow". |
| |
use settings at left |
Do not click "OK" yet. Still more to do. |
|
|
|
|
Now click on "Bevel and Emboss". |
| |
use settings at left |
You may now click OK. |
|
|
You should now have the below image.
|
|
|
Select the "Text Tool" and use the below settings.
|
|
|
Now type your prefered menu title. |
|
|
Now duplicate the tab layer and the table title two times and place accordingly as I have done below. |
|
|
Following steps 4 through 10, finish the remaining 4 sections of the layout as I have illustrated below. |
|
|
|
Select the "Text Tool" and use the below settings. |
Menu Header settings |
Menu Item settings |
|
 |
|
Now type your prefered menu items. |
|
|
Select the "Text Tool" and use the below settings. |
|
|
Now type your prefered body copy. |
|
|
Do the same with the last couple sections. |
|
|
The Results!!! |
All that is remaining is a logo and other graphical essentials to finish it off. Please make yours original. I hope you enjoyed this tutorial. |
|
|
| Comments |
| |
|
Be the first to comment about this tutorial.
|
| Leave a comment |
|
|
|