超初心者のためのホームページ作成講座
HTML CSS Dictionary Netscape Mozilla Color AccessUp Links SiteMap

■ ちょっとだけペイント講座 その1 ■

ホームページにみんなつけている、リンク用の『バナー』を作ってみます。
私も詳しい使い方は良くわからないので、簡単なバナーです。

とりあえず、Windows に付いているペイント ってソフトを起動します。

画面で白くなっているところが作業領域です。
この作業領域の大きさを変えて、バナーの大きさを決めます。
作業領域の右下の点にマウスポインタを当てて、左上に向かって、ツツーっと

こんな感じになります。

画面右下に「88×32」ってあるでしょ。これが大きさ。

作業領域に背景色をつけます。これ を使います。
下にあるカラーパレットで色を選択して(色の上でクリックする。ダブルクリックすると色の作成も可能)、作業領域の上にマウスポインタを持っていきクリックすると、選択した色がつきます。

ちょっと目立つように、枠をつけます。
まず、作業領域が小さいので、これ をつかって拡大します。
6倍 くらいの大きさがやりやすいでしょう。

枠を作るにはこれ をつかって直線を引きます。線の太さを適当に選んで、カラーパレットで色を選んでから、マウスを使って作業領域の外側に引きます。

これは、一番太い線を選んで、上の線を引いてる途中ですね。

同じようにして、太線の内側に、もう一本線を引きます(今度は一番細い線)。

拡大していた作業領域の大きさを元に戻すと、これ ができます。
バナーの土台になります。

今度は土台の上に文字を入れましょう。
このままでもできますが、そうすると文字を入れた後がめんどうです。
かといって、さっきのように拡大しては文字は入らないみたいです。
ってことで、作業領域(土台)の下の点にマウスポインタを当てて下にツツーっと伸ばして下さい。

これの白い部分に文字を入れて、あとから土台に重ねます。
これをクリックすると、こんなの が出るんで、下を選びます。
作業領域にマウスを持っていき、文字を入力する範囲を決めます。
点線の内側に入力します。いつの間にか、書式バーが出てきてるんで、文字サイズや書式フォントを決めます(出てないときは「表示」−「書式バー」で出ます)。
カラーパレットで色を選択してから、書き込みます。

「Welcome!」と入力し

土台の上にドラッグ

同様に、「34号のおへや」と入力

これも土台の上にもっていって、さっき拡げた作業領域を元に戻すと出来上がり。
まあまあでしょ^^
作業領域は戻しすぎないでね。戻しすぎると、せっかくつくった部分まで消えちゃうからね。
ちなみに、消えちゃったときや、間違ったときは、「編集」−「元に戻す」で元に戻せます。

ちょっと文字の位置がずれてるって思ったときは、拡大してから修正すればいいよ。
これ をクリックしてから、修正したいところを囲みます。

これでマウスを使って動かせるようになるから、適当に動かして修正して下さい。
うまく動かさないと、線が消えちゃったりしちゃうんで、そんな時はそこだけ線を引き直せばいいよね。
ちょっとした修正なら、これ を使えばいいよ。

やってみると、ペイントもおもしろいね。
「34号のおへや」の見出しとかもペイント使えばもうちょっとそれらしくなるかも・・・

あ゛〜〜〜っ!!大事なこと忘れてた。
ペイントってビットマップ形式(**.bmp)でしか保存出来ないっぽい・・・(T_T)
ホームページで使うのはジフ(**.gif)とかジェイペグ(**.jpg、jpeg)だから、このままじゃ使えないみたい。ペイントでもジフやジェイペグで保存できるのがあるらしい。
一回画像処理ソフトで読み込んでから、ファイル形式変えるしかないね。
せっかくここまでできたのに、やっぱりめんどいじゃんっ!
画像処理ソフトはデジカメとかスキャナ買えばついてくるでしょ。
無料ソフト(フリーウェア)もあるみたいだから、検索エンジンとか使って探してみてね。

というわけで、ちょっと気合いいれて作ったらこんなのができました。
次のページに影の付け方とかあるから、参考にすればできるよ。

こんなの→