|
|
|
2004年10月09日
カテゴリ：バカネコＰＣ講座
ネコでも分かるバナーの作り方、その２回目。 バナーには国際規格というものがあるらしい。 横幅×高さをピクセルで表すと、次のようになる。 横長 460×60 390×72 234×60 125×125 120×90 120×60 88×31 縦長 120×240 また、国内の個人では 200×40 などというのもよく使われるようだ。 アイコンと同サイズの 32×32 なんてのもある。 だが、規格にこだわってみたところで仕方がない。 好きなように作って、好きなように貼ればよろしい。 しょせんは画像のサイズにすぎぬ。 絵心が無くともパソコンの場合は、画像を作るのはそれほど難しくはない。 ペイントで、落書きしてもよし、写真を貼り付けてもよし。 写真を背景にして文字を入れれば、たちまち、それらしいものが仕上がる。 写真に文字を入れる方法については、すでに解説済みなので、 バカネコ講座をご参照いただきたい。 文字だって、明朝体やゴシック体だけが能ではない。 ワードなどのワープロには、たくさんのフォントが最初から付属している。 他のソフトからも使えるようになっているから、それを流用するもよし。 マウスを使ってフリーハンドで書いても味が出る。 さて、ペイントで画像のサイズを指定する方法についてしよう。 これも、無茶苦茶カンタンである。 これが出来なければ、自分はネコ以下だと思って、がっかりしてかまわない。 【操作法】 １．ペイントを起動する。  通常はスタートボタン→プログラム→アクセサリ→ペイント、で見つかる。 ２．メニューの「変形」から「キャンバスの色とサイズ」をクリック。  ３．幅(W)と高さ(H)の欄に、お好みの数字を指定する。  たとえば、200×40 の帯状にしたければ、幅(W)の200、高さ(H)に40と 入力するだけだ。 ４．単位はピクセルを、色はカラーのところにチェックが 入っているのを確認してＯＫボタンをクリックする。  これだけで、瞬時にサイズが変更され、ご希望のバナーサイズになる。 これに好きなものを書き込んで仕上げる。 まあ、寸法が厳密に正確でなくとも良いのなら、マウスでつかんで ドラッグするという手もある。  出来上がったら、メニューのファイルから「名前を付けて保存」を選んで 内容を示す名前を付けて、自分の分かりやすいところに保存しておこう。 作った画像ファイルを、どこに保存したか忘れる、などというのは、 相当なマヌケか、ボケ症状だとお思いになるかもしれないが、 意外に多いのだ、これが。 たくさん作ると、１ヶ月もしないうちに、「アレ？」ということは 良くある場面である。 筆者がよく遭遇するからといって、別にボケて来たわけではない。 ん？ 整理下手のイイワケに聞こえるか．．． この記事がおもしろかったと思う人は１票！ クリック →  何でこんな規格や標準があるのだろう。 覚えるのが面倒なだけなのに。 これはバナーを貼ってくれる相手が、この規格を元にレイアウトしている ことがあるからだ。 つまり、あまり大きな画像や変形画像だと、複数貼る時にページのデザインが 壊れてしまうのだ。 だからサイトによっては、バナーはヨコ○○、タテ○○で お願いします、などと書かれていることもある。 相互リンクページなどに良く見られる。 やっと、画像倉庫はやめて別スペースを確保することにした。 次回は寸法を規格に合わせたバナーのサンプルを載せてみる。 ※バカネコ講座では、安全な方法を選んで紹介していますが、 途中でわけがわからなくなっても、責任は負えませんので、あらかじめご了承下さい。 ネコでもわかるＰＣ講座はこちら。 →バカネコ講座 パソコン買い替えの前に叩き込め → 費用の削り方 ラクしてユーザビリティ改善 → ずぼらなアクセスアップ 画面右上「日記リンク追加」をクリック、「◎追加する」ボタンを押すとこの日記がリンクできます。 子猫の里親募集にお力添えをいただける方、または、このサイトの新着記事の通知をご希望の方はご利用ください。 お気に入りの記事を「いいね！」で応援しよう
[バカネコＰＣ講座] カテゴリの最新記事
うーん、フォトショップと格闘してますが
無駄な労力をかけるより、ペイントでさっくり作ったほうがいいかもしんない気がしてきた(^_^;;; で、今日はコロンちゃんは？ (2004年10月12日 18時15分35秒)
ぉお!!(ﾟﾛﾟ屮)屮ありがとうございます＾＾
私も今度、何か作ってみようかしら・・・(*´ｪ｀*) 案の定バーナーと言ってましたよ・・・(Ｔ▽Ｔ） バナーですねっ♪ ところですみませんが、このタグを見てやってください。 トドさんからレスを頂いて作ってみたのですが、楽天が受けつけてくれません・・・エラーがでます・・・困ったものです。(Ｔ▽Ｔ） <a href=" http://plaza.rakuten.co.jp/nyancolon/" ; target="_blank"= alt="ｶﾜｲｲｺﾛﾝちゃんの飼い主♪超初心者向けのＨＰ作りに必要な講座もあります">トドさんのサイト</a>から別画面で見れます＾＾ どこが間違っているのでしょうか？ トップページの紹介のところをぜひとも説明文入りの別画面が出る凄いリンクにしたいのですが（笑） どうぞよろしくご指導くださいｍ（）ｍ (2004年10月12日 18時43分51秒)
こんばんわ！
バナーを作ってみたかったので、とても勉強になりました！ サイズを変えるやり方が分かったので、嬉しかったです！ ところで、２枚の画像でバナーを作るときはどうすればいいんですか？ ペイントで何度かやってみたんですが、出来ないんです・・・。 教えていただけると助かります。 よろしくお願いします。 (2004年10月12日 18時47分44秒)
＞うーん、フォトショップと格闘してますが
＞無駄な労力をかけるより、ペイントでさっくり作ったほうがいいかもしんない気がしてきた(^_^;;; にゃはは、バナーごときにフォトショップは大げさかも。 高機能すぎて、覚えるのが大変でしょ。 (2004年10月12日 20時49分32秒)
フムフムなるほど♪
面白いページです♪ (2004年10月12日 20時52分04秒)
海獣トドさん
＞高機能すぎて、覚えるのが大変でしょ。 ハイ、そのとおりでございます(T-T) いつも同じような機能しか使わない･･･てか使えない。 宝の持ち腐れとはまさにこのこと（がっくり） (2004年10月12日 21時08分05秒)
＞ところで、２枚の画像でバナーを作るときはどうすればいいんですか？
２枚の画像をそれぞれ、画像１、画像２とします。 母体となる方の画像のサイズをペイントで調整し、決定しておきます。 ここで、いったん保存しておくと良いでしょう。 次に、もうひとつペイントを立ち上げ、画像２を開きます。 左のツールボックスから点線の四角のボタンを押して範囲設定モードにします 画像２の中の切り抜きたい部分をマウスでドラッグして、範囲指定後、 その中で右クリックして「コピー」をクリックします。 画像１のペイントに戻って、右クリックから貼り付けます。 点線で囲まれているうちは、自由にドラッグで移動できますから、 位置を決めて確定します。 当然ですが、貼り付けるものは画像１より小さくないといけません。 ペイントの場合、貼り付けるものが元画像よりも大きいと、 自動的にサイズが変わってしまいます。 (2004年10月12日 21時18分23秒)
こんばんは～。
今日は日記お休みでした。 残念です。 また面白いお話が読めるかなと思っていました。 毎回ちょっと気付かないところが書いてありお勉強になります。 最近やっと日記のテンプレートやらに振り回されずになんとかでしょうか？ (2004年10月12日 21時52分02秒)
＜a href=" http://plaza.rakuten.co.jp/nyancolon/" ; ; target="_blank"= alt="ｶﾜｲｲｺﾛﾝちゃんの飼い主♪超初心者向けのＨＰ作りに必要な講座もあります"＞トドさんのサイト＜/a＞から別画面で見れます＾＾
どこが間違っているのでしょうか？ まず、httpのアタマにスペースが入っているのでこれがダメです。 taget属性の前にも全角のセミコロンが入っていますが、これもペケ。 区切りは半角スペース１個で行います。 target="_blank" のあとに「=」が入っているのも異常です。 alt属性は、＜img＞タグの中で使うものです。 サーバによっては文字化けするので、半角のカタカナは全角を使いましょう。 さて、これは画像リンクではなく、テキストリンクですから、alt属性は使いません。 で、この場合は、title属性を指定すれば似たようなことが出来ます。 正解は、 ＜a href=" http://plaza.rakuten.co.jp/nyancolon/" ; target="_blank" title="カワイイコロンちゃんの飼い主♪超初心者向けのＨＰ作りに必要な講座もあります"＞トドさんのサイト＜/a＞から別画面で見れます＾＾ 画像を使う場合は ＜a href=" http://plaza.rakuten.co.jp/nyancolon/" ; target="_blank"＞＜img src="画像のURL" alt="カワイイコロン．．．"＞＜/a＞ となります。 ＜や＞は、半角に直してお使い下さい。 この欄では制限があって書けないので。 (2004年10月12日 21時57分07秒)
＞今日は日記お休みでした。
＞残念です。 ＞また面白いお話が読めるかなと思っていました。 すんません。 更新が大幅に遅れているんでしゅ(涙) まだ、晩ご飯も食べずに頑張ってましゅ．．． ごめんちゃい。 (2004年10月12日 21時59分56秒)
＞画像倉庫じゃない別のスペースってなんですか？
＞写真をいっぱい使いたいのに、思う存分使えない（；＿；） 別のサーバです。 たとえば、プロバイダと契約していると、たいてい、 無料のホームページスペースが付いてきますよね？ ああいうのを使うんです。 (2004年10月12日 22時32分16秒)
海獣トドさん
＞＜a href=" http://plaza.rakuten.co.jp/nyancolon/" ; ; ; target="_blank"= alt="ｶﾜｲｲｺﾛﾝちゃんの飼い主♪超初心者向けのＨＰ作りに必要な講座もあります"＞トドさんのサイト＜/a＞から別画面で見れます＾＾ ＞ ＞どこが間違っているのでしょうか？ ＞ ＞まず、httpのアタマにスペースが入っているのでこれがダメです。 ＞taget属性の前にも全角のセミコロンが入っていますが、これもペケ。 ＞区切りは半角スペース１個で行います。 ＞target="_blank" のあとに「=」が入っているのも異常です。 ＞ ＞alt属性は、＜img＞タグの中で使うものです。 ＞サーバによっては文字化けするので、半角のカタカナは全角を使いましょう。 ＞ ＞さて、これは画像リンクではなく、テキストリンクですから、alt属性は使いません。 ＞で、この場合は、title属性を指定すれば似たようなことが出来ます。 ＞正解は、 ＞＜a href=" http://plaza.rakuten.co.jp/nyancolon/" ; ; target="_blank" title="カワイイコロンちゃんの飼い主♪超初心者向けのＨＰ作りに必要な講座もあります"＞トドさんのサイト＜/a＞から別画面で見れます＾＾ ＞ ＞画像を使う場合は ＞＜a href=" http://plaza.rakuten.co.jp/nyancolon/" ; ; target="_blank"＞＜img src="画像のURL" alt="カワイイコロン．．．"＞＜/a＞ ＞となります。 ＞ ＞＜や＞は、半角に直してお使い下さい。 この欄では制限があって書けないので。 ----- ありがとうございました♪♪♪ (*´ｪ｀*)ｴﾍっ (2004年10月13日 04時44分53秒)
バナーには国際規格があるんですね。。。
し・し・知らなかった(\_\; でもまっ、よろしい♪と言うことで･･･そのままにしときます（*＾ーﾟ)v (2004年10月13日 13時55分09秒) |
|
|||||||||||||||||||||||||||||||||||||||
Re:ペイントで画像サイズを指定する(10/09)
Re:MIE@VPさんへ(10/09)
