制作する方法は人それぞれですが、私は以下のやり方で制作しています。

1. 画面サイズを決めグリッドを作成
   
   カラムを作成することで、その後の制作スピードが結構変わってくると思います。
   上の画像だと灰色の部分が余白、水色の部分がカラムになります。
   なぜ作るのか？
   理由は簡単で、ブロックの計算をいちいちしなくてすむからです。

2. ワイヤーフレームを作成
   
   グリッドを作ったら今度は大雑把にどこに何を配置するかを設定します。
   どんなコンテンツを配置していくかを決めていくことによって、全体的な構成をしやすくなります。
   上の画像はこのブログのワイヤーフレームなんで結構適当ですが、通常はもっと細かいコンテンツを配置してきます。

3. 実際にデザイン
   
   ワイヤーフレームを作ったらそれを元に整形して実際にデザインを作っていきます。
   まだこの段階では一枚の絵です。

4. デザインをスライスして画像を作る
   
   デザインができたら、そのデザインをパーツ化して書き出して画像をそれぞれ作っていきます。
   私はAdobe Fireworksを使用してますが、人によってはAdobe IllustratorやAdobe Photoshopなどのソフトを使ってます。
   緑色の部分がスライス(画像パーツ化)した箇所です。

5. コーディング
   スライスしたら、実際にHTMLとCSSを使ってコーディングしていきます。
   コーディングはどんな方法でもきちんと表示されればいいわけですが、検索エンジン(GoogleやYahoo）対策や主要ブラウザ(IEやFireFoxなど)できちんと表示されるように考えながらテストしながら作成していきます。
   

人によってさまざまですが、自分はこんな感じで作成していきます。