HPテンプレート NO.0093〜 +IFD+

[スポンサード リンク]

HPテンプレートNO.0106〜NO.0107

XHTML1.0+CSS zipファイル

黒と白ベース 一応2カラム左サイドメニュー

レイアウト云々よりもデザインを重視したHPテンプレートです。シンプルですがクールに作成してあります。

サンプル  ダウンロード

こちらは上のHPテンプレートの黒と白を反転させたものです。白背景同士でちょっとサムネイル画像がわかりづらいですね。

サンプル  ダウンロード

floatとテーブルを使わずに珍しく絶対配置などを使用して段組してあります。意外とできるものですね。

HPテンプレートNO.0102〜NO.0103

XHTML1.0+CSS zipファイル

マルチカラー ユニークレイアウト

久しぶりに作成したユニークレイアウトのポップなHPテンプレートです。ひたすら星の画像を使用してあります。タイトルと5つのメニューから成り立っています。

白サンプル  白ダウンロード

こちらは黒背景バージョンです。こちらはなんかクリスマスのような雰囲気です。

黒サンプル  黒ダウンロード

画像の作成は作業自体はシンプルなんですが・・非常に骨の折れる作業でした。ひたすら画像のコピーと色の変更を繰りかえしました。ユニークレイアウトなのでCSSも新たに作り直す部分も多く時間がかかりました。

タイトル部分は文字数が多く改行されるとその分は見えなくなるように設定してありますのでご注意ください。5つのメニューは多分2行くらいまでは対応できると思いますが、なるべく少ない文字数を推奨します。

IEの場合、ある程度の文字サイズの拡大、縮小に対応できますがサイト自体の拡大機能を使った場合レイアウトが崩れます。Firefoxはある程度の拡大に対応しています。

HPテンプレートNO.0099〜NO.0101


XHTML1.0+CSS zipファイル

2カラム右サイドメニュー

花の画像を大胆に使用したゴスロリ風HPテンプレートです。

黒サンプル  黒ダウンロード

以下は白とピンクのカラーバリエーションです。白バージョンでついにHPテンプレートナンバーが100に到達しました。

 

白サンプル  白ダウンロード
ピンクサンプル  ピンクダウンロード

白とピンク版は画像のサイズなどを一部変更してあります。そういえば・・白バージョンのような配色は以前作ったテンプレートにもありましたね。


初めて自分でレースのような飾り罫というものを作ってみました。他人の作品を見ているとかなり複雑な飾り罫をつくっている方がいますが、自分で作ろうとしてみるとやはり難しさを感じます。相当時間かかるんでしょうね。。。

HPテンプレートを構成するよりも画像作りの方に時間がかかっています。ただ、この花の画像などはソフトのブラシに登録したので後々は楽になるんでしょうが・・。

HP素材の検索&サイト作成役立ちサイト

テンプレートNO.0104〜NO.0105

XHTML1.0+CSS zipファイル

青と黒ベース ユニークレイアウト

暑い夏の日に作成した清涼感のあるHPテンプレートです。

青サンプル  青ダウンロード

こちらは春らしい配色の、緑を中心に構成されたHPテンプレートです。

緑サンプル  緑ダウンロード

タイトルの他に3つのメニューから構成されるトップページ向けHPテンプレートです。実は下の星のテンプレートをベースに作成してあります。

htmlのdiv要素などの順番を変えたりすると高さなどが変わってしまいますのでご注意ください。文字数が増えて複数にまたがった場合も一応ある程度までは対応できるようです。

編集していて思いましたが、HTMLファイルよりもCSSのほうが長いような感じですね。。。もしCSSを編集しないのであればすぐにHPを構築できるようなHPテンプレートです。

HPテンプレートNO.0096〜NO.0098

XHTML1.0+CSS zipファイル

黒と白ベース 2カラム右サイドメニュー

ゴシック風HPテンプレートです。かっこよく仕上げる予定でしたが、ちょっと不気味な雰囲気になってきたので中和しようと右上にハートをアクセントとして加えてあります。ハートが要らない方はGIFファイルを削除してください。


黒サンプル  黒ダウンロード

 

ピンクバージョンと背景に黒、画像に赤を使ったバージョンです。ピンクは上の黒版とは全然雰囲気が変わって、大人っぽい雰囲気の女性向きなHPテンプレートになっています。ここまで雰囲気が変わるとは・・色の選択も大事ですね・・。上の2つのHPテンプレートにハートは付いていません。

ピンクサンプル  ピンクダウンロード

黒と赤サンプル  黒と赤ダウンロード

色々と完成度に不満が残ったので後々似たような雰囲気のHPテンプレートに再チャレンジするかもしれません。

こういった柄のHP素材を作る場合イラストレーターを使用するのが王道だと思いますがどうもイラストレーターだときれいに作れないのでペイントソフトでちまちまと描いています。イラストレーターで人物とかのイラストが描ける方の技術には敬服します。

HPテンプレートNO.0093〜NO.0095

XHTML1.0+CSS zipファイル

青ベース 2カラム左サイドメニュー

シンプルにライン等を使って作成したHPテンプレートです。IT的というか、エレクトロニクスというか、そんな雰囲気です。GIFアニメーションで遊びが加えてあります。背景のCSSが多少複雑になっています。。。

青サンプル  青ダウンロード

 

こちらは黒と白のバージョンです。青バージョンとは多少 レイアウトや画像が違っています。個人的には白いバージョンが結構好きです。それぞれアニメーションが微妙に違います。アニメーションが重く感じる場合はアニメーションを構成しているGIFファイルを消去するとうまくいくと思います。黒と白バージョンのアニメーションはGIFアニメのファイルを削除しても止まった状態の画像が表示されます。

黒サンプル  黒ダウンロード

白サンプル  白ダウンロード

ホームページ素材集のIFDのトップページへ