i-8jo.com（Yahoo!blog入門）

記事本文を飾り付けてみよう「（その１）HTML超入門１」

このコーナーでは、記事本文を飾りつける方法をご紹介します。

HTMLを利用すると、記事本文を飾りつけることができます。

今回は、文字を装飾する機能を持ったものをご紹介します。

文字を装飾するには「タグ」という文字列でその文字を挟み込みます。

例）
<タグ>ここに強調したい文字</タグ>

という感じです。

おしまいのタグに"/"が付けることと、半角英数で書くことを忘れないでください。
本来、HTMLには、このタグの種類が沢山あるのですが、Yahoo!blogで利用できるのは限られているようです。

前置きが長くなりましたね。それでは、早速やってみましょう。


※注）本文にHTMLを適用させたいときは、右上のwiki文法使用のチェックは外しておいてください。




■[強調]（Bタグ）

文法）
<B>これが強調です</B>

結果）　
これが強調です

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

■[斜体]（Iタグ）

文法）
<I>これが斜体です</I>

結果）　
これが斜体です

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

■[下線]（Uタグ）

文法）
<U>これが下線です</U>

結果）　
これが下線です

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

■[取り消し線]（Sタグ）

文法）
<S>これが取り消し線です</S>

結果）
これが取り消し線です

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

如何ですか？細かく利用すれば、いろいろな表現ができると思います。
どうぞ、チャレンジしてみてください。


[記事本文を飾り付けてみよう（その２）HTML超入門２]へ進む
http://blogs.yahoo.co.jp/i_8jo/183994.html



[お願い]
この記事が参考になりましたら、右下の[傑作]ボタンを押して頂けるとありがたいです。

[☆歓迎☆]
コメント・トラックバック大歓迎！
転載をご希望の方は右下の[転載]ボタンを押してください。

Yahoo!blogを飾り付けてみましょう「（番外編１）名前アイコンを作ってみよう」

前回、名前アイコンの設定の説明を行いましたが、アイコン自体を作れない方もいると思います。そんなあなたに、ピッタリのサイトさんがありました。

Hyper Banner Maker(http://hbm.suepon.com/)

こちらは、Web上でバナーなどの画像を作成できるサイトなのですが、はっきり言って素晴らしいです。

今回は、こちらのサイトを利用させて頂いて、名前アイコンを作成してみたいと思います。

はじめに、ここでどのように画像を作成するかを説明しておきます。

基本的には、以下のように大きく分けて4つの設定が必要になります。
１、背景となる「ベース画像」を決める
２、その上に乗せる「アクセサリ画像」を決める
３、その上に乗せる「挿入する文字列」を決める
４、出力の設定を決める

まあ、ケーキ作りに例えると、「ベース画像」というスポンジに、「アクセサリ画像」というデコレーションをして、最後に"誕生日おめでとう！"みたいな「文字列」を入れるって感じでしょうか？

あ、余計分からなくなるかもしれませんので、とっとと始めましょう。
※注）今回、設定するにあたり、数字を入力するときには必ず半角文字を使用してください。

１、「ベース画像」を決める（図1）

[図1]

いろんなやり方があるようなのですが、今回はシンプルにベース画像は単色で作成します。

まずは、ベース画像の部分にある「色を指定して作成」ラジオボタン（図2）を選択し、その後にサイズを入力します。
今回の名前アイコンはサイズが（横60px・縦17px）ということなので、その数値を入力します。
さらに「ボタンの高さ」とあるのは、アイコンを作成した時に光や影を付けることで、立体的に見えるようになります。その立体の高さを入力します。とりあえず今回は「2」としておきます。

[図2]

次にカラーを選択します。ルービックキューブのようなアイコン（図3）（古くてわからないかな？）をクリックするとカラーパレットが現れます。そこで、好きな色を選択すると枠の中に色の値（例：00ff33等）が自動で入力されますので、決まったら、もう一度ルービックキューブをクリックしてください。

[図3]

２、「アクセサリ画像」を決める
デコレーションははお好みですので、今回はシンプルになしで作成します。（図4）

[図4]

３、「挿入する文字列を決める」
アイコンに挿入したい文字列の設定をします。（図5）

[図5]

以下、各項目設定事項（図6）です。
・[文字列]
好きな文字列を入れてください。あまり長すぎると入りませんね。

・[影を付ける]
チェックすると文字に影を付けます。

・[文字色]
先ほどと同様のやり方で、好きな色を選択してください。

・[文字サイズ]
これもお好みですが、8〜10位が無難な気がします。

・[配置設定]
文字をどこに挿入するかを決めます。特にこだわりが無ければ、横縦ともに中揃えで良いのではないでしょうか。

・[余白調整]
配置設定で、「中揃え」以外を設定した時に、余白をどれくらい取るかを設定します。結果を見ながらこまめに設定すると良いと思います。

・[フォント]
右側に見本がでますので、お好きなフォントを選んでください。

[図6]

４、「出力形式」を決める
出力形式を決定します。名前アイコンではgif形式しか利用できませんので、ここではその設定を行います。（図7）

[図7]

以下、設定項目です。（図8）
・[ファイル形式]
「*.GIF」を選択します。右側の保存品質は気にしないでください。

・[インターレース化する]
これは画像がゆっくり表示される時に必要なので、今の時代ではあまり必要ありません。と言う事で、チェックは要りません。

・[処理中に256色を越えた場合は近似色を探して処理を続ける]
これは、お好きな方で良いと思うのですが、いちいちエラーがでるのも面倒なので、チェックしておいた方が良いと思います。

・[文字が画像をはみ出しても処理を続ける]
あえて文字をはみ出させたい！という方以外はチェックは要らないと思います。

[図8]

さて、ここまで設定すれば、あとは下にある「MAKE!」ボタン（図9）を押すだけ！

[図9]

すると、別ウィンドウにて作成されたアイコン（図10）が現れました。おめでとうございまーす。もしも気に入らなかった場合は、入力した部分を微調整をして「MAKE!」をクリックしてください。

[図10]

もう少しでおしまいです。最後に出来上がった名前アイコンを右クリックして保存（図11）します。（念のため、右クリックとはマウスの右側のボタンを押すことです。Macを使っている方は「Controlキー」を押しながらクリックしてください。）

[図11]

すると、保存ウィンドウ（図12）が開きますので、保存場所を選んで保存してください。

[図12]

いあー、うだうだ、ダラダラと説明してしまいました。最後まで読んでくれた方ありがとうございます。お疲れ様でした。

[お願い]
この記事が参考になりましたら、右下のボタンを押して頂けるとありがたいです。

[☆歓迎☆]
コメント・トラックバック大歓迎！
転載をご希望の方は右下のを押してください。

Yahoo!blogを飾り付けてみましょう「（その８）名前アイコンを設定してみよう」

今回は、「名前アイコン」を設定してみたいと思います。名前アイコンとは、Yahoo!blog内のコメント欄やゲストブックなどで、Yahoo!IDやニックネームの代わりに表示される画像（図1）のことです。

[図1]

設定に入る前に、画像を用意しておきましょう。名前アイコンで使用できるのは、gif形式の画像のみで、画像サイズ（横60px・縦17px）以内です。「そんな画像は持っていないよ！」とお考えになったそこのあなた。どうぞ、ご安心ください。作り方については次回説明します。

それでは、設定に入りましょう。はまずはいつも通り、ログインした画面の右上にある「ブログ設定」ボタン（図2）をクリックしてください。

[図2]

するとプロフィール設定画面（図3）になりますので、画像情報にある「名前アイコン」の部分の「参照」ボタンをクリックします。

[図3]

次に画像ファイルを参照するためのウィンドウが開きますので、名前アイコンにしたい画像ファイルを選択して「開く」を押します。（図4：WindowsXPの場合）

[図4]

参照の部分にファイル名が入っているのを確認したら（図5）、最後に画面右下の「決定」ボタンを押して完了です。

[図5]

すると、再びプロフィール設定画面にもどります。その時に名前アイコン設定部分に「名前アイコン」（図6）が表示されていることが確認できます。

[図6]

ちなみに削除用のチェックボックスも表示されていますが、名前アイコンを削除したい場合にはこれをチェックして再び右下の「決定」ボタンを押してください。

名前アイコンが登録されたので、（図1）でテキストで表示されていた名前も（図7）のように表示されるようになりました。

[図7]

如何でしたか？さりげない技ですが、面白いアイコンができれば楽しくなりそうですね。次回はそのアイコンの作り方をご説明します。

[お願い]
この記事が参考になりましたら、右下のボタンを押して頂けるとありがたいです。

[☆歓迎☆]
コメント・トラックバック大歓迎！
転載をご希望の方は右下のを押してください。

Yahoo!blogを飾り付けてみましょう「（その７）自分のアバターを設定してみよう後編」

アバターについて、最後にもう少し説明しておきましょう。

まずはYahoo!アバター(http://avatar.yahoo.co.jp)にアクセスしてください。（図1）ログインしていない場合は、右上の「ログイン」リンクからログインしてください。

[図1]

次に、画面中央付近にある「クローゼット」リンク（図2）をクリックしてください。

[図2]

するとクローゼット画面（図3）になります。

[図3]

こちらの画面について、少し説明いたします。

・[表情]
アバターの下にある表情マーク（図4）をクリックすると、表情を変更することができます。その日の気分に合わせて、表情を変えてみるっていうのも良いかもしれませんね。

[図4]

・[アイテムの試着]
前回の手順で登録したアイテムがクローゼットには登録されています。アイテム画像または「アイテムの試着」リンク（図5）をクリックすると、試着したり、はずしたりすることができます。なお、現在使用中のものは「着用中」と表示されます。

[図5]

・[アイテムの削除]
いらなくなったアイテムは「削除」リンク（図6）をクリックして、削除することができます。

[図6]

「削除」りんくをクリックすると、削除の確認画面（図7）が出てきますので、下のほうにある「削除する」ボタンをクリックして削除してください。

[図7]

無料のYahoo!会員はこのアイテムを30個までしか登録できません。なので、こまめに整理していかないと、すぐにいっぱいになる方もいるかもしれません。
プレミアム会員になるとなんと1000個も登録できるそうです。ワイはそんなにいりませんが、、、。お好みでどうぞ。

・[コーディネートの保存]
変更するコーディネートが決まったら、アバターの下にある「このコーディネートを保存」ボタン（図8）をクリックしてください。保存しないと、コーディネートは変更されません。

[図8]

次に「キャラクター保存画面」（図9）が出てきたら、無事にコーディネート終了です。ご自分のブログに戻って確認してみてください。

[図9]

・[アルバム]
お気に入りのコーディネートを画像としてアルバムに残しておくことができます。素敵なコーディネートができたら、アバターの下にある「アルバム保存」ボタン（図10）をクリックしてください。

[図10]

すると、「アルバム保存確認画面」（図11）がでますので、下のほうにある「保存する」ボタンをクリックして、保存してください。

[図11]

以上、駆け足にアバターについて説明しましたが、お分かりになりましたか？あなたも素敵なアバターができたら、トラックバックでもコメントでも教えてくださいね。

ちなみに、このアバターはおしゃれなアイテムが多すぎて、ワイにはちょっと似合いません、、、。

[お願い]
この記事が参考になりましたら、右下のボタンを押して頂けるとありがたいです。

[☆歓迎☆]
コメント・トラックバック大歓迎！
転載をご希望の方は右下のを押してください。

Yahoo!blogを飾り付けてみましょう「（その６）自分のアバターを設定してみよう中編」

前回アバターの登録設定までしましたが、今回は詳細を設定してみたいと思います。

まずはYahoo!アバター(http://avatar.yahoo.co.jp)にアクセスしてください。（図1）

[図1]

もしも、Yahoo!IDでログインしていない場合は、右上の「ログイン」リンク（図2）でをクリックしてログインしてください。

[図2]

ログインしてトップ画面を開いたら、早速アバターの設定をしていきましょう。やり方は簡単で、着せ替え人形をしていく感覚です。
それでは、画面中央付近にある「アイテム一覧」リンク（図3）をクリックしてください。

[図3]

ここで、顔・髪型・服装・背景などを選択していくことができます。それでは、まず顔の設定をしてみましょう。
画面中央付近にある「■新着一覧」リスト（図4）をクリックしてください。

[図4]

するとリスト（図5）が開くので、その中から「■顔」を選択して、右側にある「表示」ボタンをクリックください。

[図5]

ちなみに「■顔」の下に「顔つき」「ほくろ、そばかす」「ひげ」「状態」「メガネ、サングラス」などがありますが、そのジャンルの一番上にある「■」のついた項目を選択すると、これらすべてが表示されるようになっています。（図6）

[図6]

それでは、試しにお好きな顔を選んでみてください。決まりましたら、その画像をクリックするか、もしくは右側にある「アイテム試着」をクリックします。すると、左上にあるアバターの顔も変わることが分かると思います。（図7）気に入らなければ、アバター下にある「試着前に戻す」リンクをクリックしてください。

[図7]

ちなみに、その画面に好みの顔がなくても何ページかにわたりアイテムがある場合があります。（図8）その場合には、左側のページ数で選択するか、右側の「次の8件」リンクで次のページを表示します。

[図8]

さて、話を元に戻します。お好きな顔を選択したら次はアバターが表示されている下にある「このコーディネートを保存」ボタン（図9）をクリックしてください。

[図9]

すると、クローゼット登録確認の画面がでてきますので、確認したら下にある「クローゼット登録」ボタン（図10）をクリックしてください。

[図10]

最後に登録確認の画面（図11）がでてきたら、登録完了です。

[図11]

基本的な流れは以上のようになっています。今回は説明の為に顔だけを設定してすぐに保存しましたが、実際に登録する場合は服装や背景なども一緒に設定して最後に保存しても構いません。

みなさんのセンスで、素敵なアバターを作ってみてくださいね。

最後に、アイテムの中には「プレミアム会員」（Yahoo!のいわゆる有料会員）しか使えないものがあります。もしも、有料アイテムを使用したい場合は、プレミアム会員の登録をしてください。

[お願い]
この記事が参考になりましたら、右下のボタンを押して頂けるとありがたいです。

[☆歓迎☆]
コメント・トラックバック大歓迎！
転載をご希望の方は右下のを押してください。