15. Now we start throwing in the text. The font matters a lot. Depending on your website, you can use default system fonts, cursive script fonts, or premium designer fonts that will lighten your pockets a bit. I suggest using DaFont for some awesome free fonts.

Here I have used “Myriad Pro” for the menu items. These should be bold, clear and easy to read. Very important.

13 How to make a Chess based Website Design in photoshop

Used font “Orater Std” for the title. It is a bundled font. You probably have it already.

14 How to make a Chess based Website Design in photoshop

Added a description in the same font. Give special attention to placement,colors and alignment of such text which doesnt have a special container of its own.

15 How to make a Chess based Website Design in photoshop

16. Use the “Rectangular Marquee Tool” with “Fixed Size” set to 125×125 px for placing ads on your website. Make the colors match with your theme.

16 How to make a Chess based Website Design in photoshop

17. Throw in some text and some subscription buttons (Get these here), and VOILA!!! You are done.

17 How to make a Chess based Website Design in photoshop

Final Design:
chess template design 300x218 How to make a Chess based Website Design in photoshop
This template has been designed specifically keeping in mind the valid XHTML and CSS coding. The semitrasparent figure forms the #outer-wrapper, the two white rectangles inside form the #main-wrapper and #sidebar-wrapper. Similarly, the #header-wrapper and #footer-wrapper take care of the rest of the containers. I will start coding on this template now that this tutorial is complete.

<!–nextpage–>

1 2 3 4

Delivered by FeedBurner

Share this Post