さて、ゼロからテンプレートを作るとなると結構、時間と根気が必要です。テンプレートを作るには、土台となる完成したhtmlが必要です。完成したhtmlとはhtmlファイルと画像とcssファイル等々からなります。そして、それらを作るには、さらに元となるデザイン画像が必要です。

デザイン画像は、サイトページの完成予想図のようなもので、Adobe Photoshopというピクセル（＝ドット＝画素）単位で絵が描けるソフトで作りました。
ここでは下記のような見本を作りました。

説明用でもあるので、非常に単純なデザインです。これを「テーブルレイアウト」でHTMLにしていきます。実寸のデザイン画像を使用します。背景の濃いグリーンは、背景画像として別に作り、淡いグリーンのフレームと中央の淡黄色は、HTML用に部分で切り出して使用します。実寸のデザイン画像とはブラウザで表示した時に自分が望むサイズです。今回の見本では淡いグリーンのフレーム幅が760pxで作っています。
デザインの構成要素としては、最低限下記の項目を抑えます。

画像に表記し忘れましたが、上部の空いたところをタイトルとバナー表示スペースとします。中央は文章などが表示されるコンテンツ表示部です。ライトポジション下にページトップへ戻るボタンを配置してます。
次に画像をHTML用に切り出しますす。この見本では下記の赤枠で囲んだ部分を切り出しています。

最近のソフトは出来がいいので切り出しもずいぶん楽になりましたね。下記にボタン画像・モジュール背景用を囲んで示します。ボタン画像は、マウスオーバー、マウスアウト用画像の２種で一組になります。spacer.gifは、透明の1px角の画像でJoomla!をインストールすれば、「rhuk_solarflare_ii」テンプレートのimagesディレクトリにも入っているものと同じです。