My First Template made with Photoshop!

Hello,
This is my first template made with photoshop: Here it is: Can anyone send me a tut how to code to html?:


First try

Best Regards
Saddiq Iqbal
Saddiq Designs 2008

 

Any suggestions?

 

You can use the slice tool and export it to html. Thats the cheap and dirty way to do it.

The way I do it is I make a design up in the program like Photoshop or Fireworks and then code it from scratch in html using notepad. It does take some time but at least you don't get all the crappy tables and spacer.gif's lying around and adding so much extra markup.

Any html tutorial should help you a lot with converting that to html + css.

 

More suggestions?

 

Slice the overall image up into horizontal sections. That design should be little trouble as it's not too graphics intensive. Basically you want anything that needs to be graphics separated from what you can do using your code. For example that big gray area for your content can be done entirely in CSS, you just need to know what dimensions your doing it to, which you can get out of photoshop.

The only thing is the difference between your title image and your menu images. While you could chop out your logo and save that as an image, you'd be better having the menu bar done with code and then saving the individual images and putting them into the coded menu bar.

If you were asking for specifics on WHAT code rather than WAYS you should check out some starter tutorials on HTML and CSS.

 

I always tell people to find a website they like then try to recreate it exactly in photoshop. It's a GREAT way to learn how to design.

From there do slice up practice; just follow the tutorials you can find on google.