ブログカスタマイズ その3 ~ブログを自分なりにデザインしたい~
第3回目は、「画像のURL」についてのお話です。カスタマイズの解説からはちょっとだけそれますが、今後カスタマイズをすこし踏み込もう、という場合には、必ず理解しておかなければならない事柄のひとつです。
(注意)このブログカスタマイズのシリーズ記事中の解説を実際に行う際には、必ず自己責任で行ってください。自分では難しくてできない、自信がないから頼みたい、という場合は当相談所へのご相談として承りますので、ね。
■ブログの背景やデザインに画像を使うには・・・
前回回の解説で、背景の色や模様を変更するのに「画像」を利用できることを説明しましたね。
で、「スタイルシートの背景画像を指定する部分に、その画像のURLを指定する」ということもご説明しましたが・・・初心者の方や経験のない方には「?」がついたと思います。
「画像のURLってなんだ?」
ホームページでも、ブログでも、背景や文章の中に画像が表示されているのは、「そのページに画像が埋め込まれているというわけじゃない」んです。実際にソースコードという「原文」みたいなものを見てみれば分かるのですが、画像が表示されている部分には、「src="http://kspc-web.com/img01.jpg"」というような文字が記述されているだけです。これはどういう意味かというと、「この部分に、http;//kspc-web.com/img01.jpg"というファイル名の画像を表示してね」と指定しているんですね。で、それが「結果的に画面上で指定した画像が表示される」ということになるんです。
じゃあ、その画像はどうやって指定するのか・・・?指定するために使われるのが「画像のURL」です。
カンの鋭い方は理解されたかもしれませんね、「http://kspc-web.com/img01.jpg」・・・これが「画像のURL」です。
■ホームページアドレスと画像のURL
アドレス
ブログをカスタマイズしてみよう!と思っている方なら、一度くらい聞いたことがあるんじゃないでしょうか?
「ホームページアドレスっていうのは、インターネット上の住所のようなものなんだ。」・・・って
ものすごく正確に言うと、「住所」=「実際の土地の上のある特定の場所を示す情報」ですね。それと同じようなもの、つまり「インターネット上のある特定の場所を示す情報」=「アドレス」というわけです。では「URLっていうのはなに・・・?」
結論から言えば、「URL」というのは「要するにアドレスのこと」です。(厳密には異論があるかもしれません。けれどもこのコーナーの解説を理解するには、こういう理解の仕方でかまいませんので、ね)
ホームページやブログにはそれぞれ、固有のアドレスがありますね。たとえばパソコン相談所のホームページアドレスは「http://kspc-web.com」です。これは、「インターネット上での、パソコン相談所のトップページの場所を表す情報」ですね。同様に、今お読みになっているこのページにも、トップページとは別のアドレスがあります。そして別のページにも、それぞれ固有のアドレスがあります。
で実は、ここからが大切なのですが、アドレスを持っているのは、ホームページのデータだけではなく、ホームページ上で指定されている「画像」にも固有のアドレスがあるのです。・・・別の言い方をすると、「もし画像に固有のアドレスがなかったら、ホームページ上で”この画像を表示しなさい”という指定ができない」ことになりますよね?だから、画像にも固有のアドレスがなければならないんです。・・・もっというと、インターネット上で見たりダウンロードしたり利用できるデータには、すべてアドレスがあるといって良いでしょう。だから、ホームページ上で「音楽を鳴らしたい」と思ったら、その音楽データの「アドレス」を指定しなければならない、というわけですね。
ところで、「それなら画像のアドレスと言えばいいじゃんか?」と思った方、いらっしゃると思います。確かにそうなんですが・・・正確には「アドレス」という表現は間違いで、正式には「インターネット上での情報(画像やホームページなどのそれぞれのデータ)の位置を表した書式」のことを「URL」と言うのです。それで、このページではいちおう、正確に表現するために「画像のURL」と言っています。別に「アドレス」といって間違いだというわけではありませんので、ね。今のところは同じ言葉だと思っていてかまいません。
参考までに、たとえば右の写真画像にも、今読んでいるこのホームページのアドレスとは別の「URL」があります。
この画像のURLは「http://kspc-web.com/explanation/files_explanation0167/img01s_explanation0167.jpg」です。
このURLを、ブラウザのアドレスバーに打ち込んで(面倒ならコピー&ペーストでも可)「Enter」キーを押してみてください。・・・ね、画像だけが出てくるでしょ?こういう風に、画像そのものにも、URLが付与されているんです。
■画像のURLはどうやって調べる・・・?
大前提!URLはインターネット上になければ調べられない
自分のお気に入りの写真やイラストを、ブログの背景画像にしよう!そう思い立ったとき、その画像データは、どこにあります?たぶんご自分のパソコンの「マイドキュメント」とか「マイピクチャ」のなかではありませんか?
残念ながら、その状態(自分のパソコンの中にある状態)では、その画像にはURLはないのです。URLはインターネット上の固有の場所を示す情報。自分のパソコンの中のデータにはURLはありませんので、マイピクチャの中などにある画像をブログで使いたいと思ったら、まず画像をネット上にアップロードしてください。ほとんどのブログサービスで、「画像をアップロードする」機能があると思いますので、この機能を使えばOKです。
アップロードした画像を表示すればURLを調べられます。
アップロードした画像をブラウザで表示する方法は、利用しているブログやサーバーによって異なりますが、とにかく何らかの形で画像を表示させてください。この際、画像だけを表示しなくても、文章や説明文などがついた状態のページでもかまいません。とにかくその画像がブラウザ上に出ていればOKです。
画像が表示されたら、画像の上でマウスを右クリックします。いろいろメニュー項目が出てくると思いますが、その一番下に「プロパティ」という項目があるのでこれをクリックします。(右図参照)
プロパティ画面の真ん中あたりに「アドレス(URL)」というのがありますよね。これが「この画像のURL」です。
ちなみに・・・たいていの場合、画像のURLというのは右図のようにやたらめったら長い文字列になることが多いです。ブログカスタマイズで、スタイルシートにこのURLを入力する際には、一字一句間違いなく入力しなければならないのですが・・・面倒な場合、あるいは一字一句間違いなく入れる自信のない場合には、この画面のアドレスを直接コピー・ペーストすることもできますので、ね。
(注意)この画像のURLの調べ方は、「InternetExplorer6」での説明です。バージョンの違うInternetExplorerや別のブラウザ(MozillaとかOperaとか)では、多少操作方法が異なります。
さて、今回の説明はだいぶ長くなりましたが、ここまでです。
次回のカスタマイズ解説は、「ブログによく出てくるhtmlタグ」について解説します。
■カスタマイズに関するご質問・ご相談は・・・
このコーナーで説明しているカスタマイズを実際にやるときには、かならず自己責任で行ってください。
「やってみたけどわからない。」「難しくてできない」「質問したい」というような場合は、当相談所へのご質問・ご相談として承ります。その場合にはページ右上の「ご相談」ページから内容を入力して送信していただくか、あるいは直接メールでお問い合わせください。